Skip to content

Commit

Permalink
Add gemma.css to site notebooks. (#509)
Browse files Browse the repository at this point in the history 
* Add gemma.css to site notebooks.

This is fragile, but it's only a temp measure until the CSS is included in the site bundle.

* Fix buttons on distributed tuning guide too
  • Loading branch information
@markmcd
markmcd authored Aug 7, 2024
1 parent df4921a commit 98a8bb9
Show file tree
Hide file tree
Showing 17 changed files with 319 additions and 14 deletions.
10 changes: 10 additions & 0 deletions site/en/gemma/docs/agile_classifiers.ipynb
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,15 @@
{
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "G3MMAcssHTML"
},
"source": [
"<link rel=\"stylesheet\" href=\"/site-assets/css/gemma.css\">\n",
"<link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css2?family=Google+Symbols:opsz,wght,FILL,[email protected],100..700,0..1,-50..200\" />"
]
},
{
"cell_type": "markdown",
"metadata": {
Expand Down
10 changes: 10 additions & 0 deletions site/en/gemma/docs/codegemma/code_assist_keras.ipynb
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,15 @@
{
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "G3MMAcssHTML"
},
"source": [
"<link rel=\"stylesheet\" href=\"/site-assets/css/gemma.css\">\n",
"<link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css2?family=Google+Symbols:opsz,wght,FILL,[email protected],100..700,0..1,-50..200\" />"
]
},
{
"cell_type": "markdown",
"metadata": {
Expand Down
10 changes: 10 additions & 0 deletions site/en/gemma/docs/codegemma/codegemma_flax_inference.ipynb
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,15 @@
{
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "G3MMAcssHTML"
},
"source": [
"<link rel=\"stylesheet\" href=\"/site-assets/css/gemma.css\">\n",
"<link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css2?family=Google+Symbols:opsz,wght,FILL,[email protected],100..700,0..1,-50..200\" />"
]
},
{
"cell_type": "markdown",
"metadata": {
Expand Down
10 changes: 10 additions & 0 deletions site/en/gemma/docs/codegemma/keras_quickstart.ipynb
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,15 @@
{
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "G3MMAcssHTML"
},
"source": [
"<link rel=\"stylesheet\" href=\"/site-assets/css/gemma.css\">\n",
"<link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css2?family=Google+Symbols:opsz,wght,FILL,[email protected],100..700,0..1,-50..200\" />"
]
},
{
"cell_type": "markdown",
"metadata": {
Expand Down
12 changes: 11 additions & 1 deletion site/en/gemma/docs/distributed_tuning.ipynb
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,15 @@
{
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "G3MMAcssHTML"
},
"source": [
"<link rel=\"stylesheet\" href=\"/site-assets/css/gemma.css\">\n",
"<link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css2?family=Google+Symbols:opsz,wght,FILL,[email protected],100..700,0..1,-50..200\" />"
]
},
{
"cell_type": "markdown",
"metadata": {
Expand Down Expand Up @@ -42,7 +52,7 @@
" <a target=\"_blank\" href=\"https://ai.google.dev/gemma/docs/distributed_tuning\"><img src=\"https://ai.google.dev/static/site-assets/images/docs/notebook-site-button.png\" height=\"32\" width=\"32\" />View on ai.google.dev</a>\n",
" </td>\n",
" <td>\n",
" <a target=\"_blank\" href=\"https://colab.research.google.com/github/googlecolab/colabtools/blob/main/notebooks/Gemma_Distributed_Fine_tuning_on_TPU.ipynb\"><img src=\"https://www.tensorflow.org/images/colab_logo_32px.png\" />Run in Google Colab</a>\n",
" <a target=\"_blank\" href=\"https://colab.research.google.com/github/google/generative-ai-docs/blob/main/site/en/gemma/docs/distributed_tuning.ipynb\"><img src=\"https://www.tensorflow.org/images/colab_logo_32px.png\" />Run in Google Colab</a>\n",
" </td>\n",
" <td>\n",
" <a target=\"_blank\" href=\"https://www.kaggle.com/code/nilaychauhan/keras-gemma-distributed-finetuning-and-inference\"><img src=\"https://www.kaggle.com/static/images/logos/kaggle-logo-transparent-300.png\" height=\"32\" width=\"70\"/>Run in Kaggle</a>\n",
Expand Down
139 changes: 128 additions & 11 deletions site/en/gemma/docs/gemma_chat.ipynb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,15 +3,11 @@
{
"cell_type": "markdown",
"metadata": {
"id": "JLOS92ZAhfFj"
"id": "G3MMAcssHTML"
},
"source": [
"Project: /gemma/_project.yaml\n",
"Book: /gemma/_book.yaml\n",
"\n",
"<link rel=\"stylesheet\" href=\"/site-assets/css/style.css\">\n",
"\n",
"<!-- DO NOT EDIT! Automatically generated file. -->"
"<link rel=\"stylesheet\" href=\"/site-assets/css/gemma.css\">\n",
"<link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css2?family=Google+Symbols:opsz,wght,FILL,[email protected],100..700,0..1,-50..200\" />"
]
},
{
Expand Down Expand Up @@ -569,7 +565,13 @@
"outputs": [
{
"data": {
"text/markdown": "<font size='+1' color='brown'>🙋‍♂️<blockquote>Tell me, in a few words, how to compute all prime numbers up to 1000?</blockquote></font><font size='+1' color='teal'>🤖\n\n> **Sieve of Eratosthenes.** \n> <end_of_turn>\n</font>",
"text/markdown": [
"<font size='+1' color='brown'>🙋‍♂️<blockquote>Tell me, in a few words, how to compute all prime numbers up to 1000?</blockquote></font><font size='+1' color='teal'>🤖\n",
"\n",
"> **Sieve of Eratosthenes.** \n",
"> <end_of_turn>\n",
"</font>"
],
"text/plain": [
"<IPython.core.display.Markdown object>"
]
Expand Down Expand Up @@ -603,7 +605,43 @@
"outputs": [
{
"data": {
"text/markdown": "<font size='+1' color='brown'>🙋‍♂️<blockquote>Now in Python! No numpy, please!</blockquote></font><font size='+1' color='teal'>🤖\n\n> ```python\n> def sieve_of_eratosthenes(n):\n> \"\"\"Returns a list of prime numbers up to n.\"\"\"\n> primes = [True] * (n + 1)\n> primes[0] = primes[1] = False\n> for i in range(2, int(n**0.5) + 1):\n> if primes[i]:\n> for j in range(i * i, n + 1, i):\n> primes[j] = False\n> return [i for i, is_prime in enumerate(primes) if is_prime]\n> \n> primes = sieve_of_eratosthenes(1000)\n> print(primes)\n> ```\n> \n> **Explanation:**\n> \n> 1. **Initialization:**\n> - `primes = [True] * (n + 1)`: Creates a list `primes` of boolean values, initially assuming all numbers are prime.\n> - `primes[0] = primes[1] = False`: Sets 0 and 1 as non-prime.\n> \n> 2. **Iteration:**\n> - `for i in range(2, int(n**0.5) + 1):`: Iterates from 2 to the square root of `n`. We only need to check up to the square root because any composite number must have a prime factor less than or equal to its square root.\n> - `if primes[i]:`: If `i` is marked as prime:\n> - `for j in range(i * i, n + 1, i):`: Marks all multiples of `i` as non-prime.\n> \n> 3. **Result:**\n> - `return [i for i, is_prime in enumerate(primes) if is_prime]`: Creates a list of indices where `primes[i]` is True, representing the prime numbers.\n> \n> \n> Let me know if you'd like a more detailed explanation of any part! \n> <end_of_turn>\n</font>",
"text/markdown": [
"<font size='+1' color='brown'>🙋‍♂️<blockquote>Now in Python! No numpy, please!</blockquote></font><font size='+1' color='teal'>🤖\n",
"\n",
"> ```python\n",
"> def sieve_of_eratosthenes(n):\n",
"> \"\"\"Returns a list of prime numbers up to n.\"\"\"\n",
"> primes = [True] * (n + 1)\n",
"> primes[0] = primes[1] = False\n",
"> for i in range(2, int(n**0.5) + 1):\n",
"> if primes[i]:\n",
"> for j in range(i * i, n + 1, i):\n",
"> primes[j] = False\n",
"> return [i for i, is_prime in enumerate(primes) if is_prime]\n",
"> \n",
"> primes = sieve_of_eratosthenes(1000)\n",
"> print(primes)\n",
"> ```\n",
"> \n",
"> **Explanation:**\n",
"> \n",
"> 1. **Initialization:**\n",
"> - `primes = [True] * (n + 1)`: Creates a list `primes` of boolean values, initially assuming all numbers are prime.\n",
"> - `primes[0] = primes[1] = False`: Sets 0 and 1 as non-prime.\n",
"> \n",
"> 2. **Iteration:**\n",
"> - `for i in range(2, int(n**0.5) + 1):`: Iterates from 2 to the square root of `n`. We only need to check up to the square root because any composite number must have a prime factor less than or equal to its square root.\n",
"> - `if primes[i]:`: If `i` is marked as prime:\n",
"> - `for j in range(i * i, n + 1, i):`: Marks all multiples of `i` as non-prime.\n",
"> \n",
"> 3. **Result:**\n",
"> - `return [i for i, is_prime in enumerate(primes) if is_prime]`: Creates a list of indices where `primes[i]` is True, representing the prime numbers.\n",
"> \n",
"> \n",
"> Let me know if you'd like a more detailed explanation of any part! \n",
"> <end_of_turn>\n",
"</font>"
],
"text/plain": [
"<IPython.core.display.Markdown object>"
]
Expand All @@ -627,7 +665,45 @@
"outputs": [
{
"data": {
"text/markdown": "<font size='+1' color='brown'>🙋‍♂️<blockquote>Thank you, it works! Can you explain the code in French?</blockquote></font><font size='+1' color='teal'>🤖\n\n> Bien sûr ! Voici une explication du code en français :\n> \n> ```python\n> def sieve_of_eratosthenes(n):\n> \"\"\"Retourne une liste de nombres premiers jusqu'à n.\"\"\"\n> primes = [True] * (n + 1)\n> primes[0] = primes[1] = False\n> for i in range(2, int(n**0.5) + 1):\n> if primes[i]:\n> for j in range(i * i, n + 1, i):\n> primes[j] = False\n> return [i for i, is_prime in enumerate(primes) if is_prime]\n> \n> primes = sieve_of_eratosthenes(1000)\n> print(primes)\n> ```\n> \n> **Explication:**\n> \n> 1. **Initialisation:**\n> - `primes = [True] * (n + 1)`: Crée une liste `primes` de valeurs booléennes, initialement supposant que tous les nombres sont premiers.\n> - `primes[0] = primes[1] = False`: Définit 0 et 1 comme non-premiers.\n> \n> 2. **Itération:**\n> - `for i in range(2, int(n**0.5) + 1):`: Itère de 2 jusqu'à la racine carrée de `n`. Nous ne devons vérifier que jusqu'à la racine carrée car tout nombre composite doit avoir un facteur premier inférieur ou égal à sa racine carrée.\n> - `if primes[i]:`: Si `i` est considéré comme premier:\n> - `for j in range(i * i, n + 1, i):`: Marquer tous les multiples de `i` comme non-premiers.\n> \n> 3. **Resultat:**\n> - `return [i for i, is_prime in enumerate(primes) if is_prime]`: Crée une liste des indices où `primes[i]` est vrai, représentant les nombres premiers.\n> \n> \n> N'hésitez pas à me demander si vous avez besoin d'une explication plus détaillée de quelque chose! \n> <end_of_turn>\n</font>",
"text/markdown": [
"<font size='+1' color='brown'>🙋‍♂️<blockquote>Thank you, it works! Can you explain the code in French?</blockquote></font><font size='+1' color='teal'>🤖\n",
"\n",
"> Bien sûr ! Voici une explication du code en français :\n",
"> \n",
"> ```python\n",
"> def sieve_of_eratosthenes(n):\n",
"> \"\"\"Retourne une liste de nombres premiers jusqu'à n.\"\"\"\n",
"> primes = [True] * (n + 1)\n",
"> primes[0] = primes[1] = False\n",
"> for i in range(2, int(n**0.5) + 1):\n",
"> if primes[i]:\n",
"> for j in range(i * i, n + 1, i):\n",
"> primes[j] = False\n",
"> return [i for i, is_prime in enumerate(primes) if is_prime]\n",
"> \n",
"> primes = sieve_of_eratosthenes(1000)\n",
"> print(primes)\n",
"> ```\n",
"> \n",
"> **Explication:**\n",
"> \n",
"> 1. **Initialisation:**\n",
"> - `primes = [True] * (n + 1)`: Crée une liste `primes` de valeurs booléennes, initialement supposant que tous les nombres sont premiers.\n",
"> - `primes[0] = primes[1] = False`: Définit 0 et 1 comme non-premiers.\n",
"> \n",
"> 2. **Itération:**\n",
"> - `for i in range(2, int(n**0.5) + 1):`: Itère de 2 jusqu'à la racine carrée de `n`. Nous ne devons vérifier que jusqu'à la racine carrée car tout nombre composite doit avoir un facteur premier inférieur ou égal à sa racine carrée.\n",
"> - `if primes[i]:`: Si `i` est considéré comme premier:\n",
"> - `for j in range(i * i, n + 1, i):`: Marquer tous les multiples de `i` comme non-premiers.\n",
"> \n",
"> 3. **Resultat:**\n",
"> - `return [i for i, is_prime in enumerate(primes) if is_prime]`: Crée une liste des indices où `primes[i]` est vrai, représentant les nombres premiers.\n",
"> \n",
"> \n",
"> N'hésitez pas à me demander si vous avez besoin d'une explication plus détaillée de quelque chose! \n",
"> <end_of_turn>\n",
"</font>"
],
"text/plain": [
"<IPython.core.display.Markdown object>"
]
Expand All @@ -651,7 +727,48 @@
"outputs": [
{
"data": {
"text/markdown": "<font size='+1' color='brown'>🙋‍♂️<blockquote>Great! Now add those explanations as comments in the code.</blockquote></font><font size='+1' color='teal'>🤖\n\n> ```python\n> def sieve_of_eratosthenes(n):\n> \"\"\"Retourne une liste de nombres premiers jusqu'à n.\"\"\"\n> # Initialise une liste de boolean avec True pour tous les nombres de 0 à n\n> primes = [True] * (n + 1)\n> # Définit 0 et 1 comme non-premiers\n> primes[0] = primes[1] = False\n> # Itère de 2 à la racine carrée de n\n> for i in range(2, int(n**0.5) + 1):\n> # Si i est considéré comme premier\n> if primes[i]:\n> # Itère sur tous les multiples de i\n> for j in range(i * i, n + 1, i):\n> # Définit les multiples de i comme non-premiers\n> primes[j] = False\n> # Retourne la liste des indices des nombres premiers\n> return [i for i, is_prime in enumerate(primes) if is_prime]\n> \n> primes = sieve_of_eratosthenes(1000)\n> print(primes)\n> ```\n> \n> **Explication:**\n> \n> * **Initialisation:**\n> * `primes = [True] * (n + 1)`: Crée une liste `primes` de valeurs booléennes, initialement supposant que tous les nombres sont premiers.\n> * `primes[0] = primes[1] = False`: Définit 0 et 1 comme non-premiers.\n> * **Itération:**\n> * `for i in range(2, int(n**0.5) + 1):`: Itère de 2 jusqu'à la racine carrée de `n`. Nous ne devons vérifier que jusqu'à la racine carrée car tout nombre composite doit avoir un facteur premier inférieur ou égal à sa racine carrée.\n> * `if primes[i]:`: Si `i` est considéré comme premier:\n> * `for j in range(i * i, n + 1, i):`: Marquer tous les multiples de `i` comme non-premiers.\n> * **Resultat:**\n> * `return [i for i, is_prime in enumerate(primes) if is_prime]`: Crée une liste des indices où `primes[i]` est vrai, représentant les nombres premiers. \n> \n> \n> \n> <end_of_turn>\n</font>",
"text/markdown": [
"<font size='+1' color='brown'>🙋‍♂️<blockquote>Great! Now add those explanations as comments in the code.</blockquote></font><font size='+1' color='teal'>🤖\n",
"\n",
"> ```python\n",
"> def sieve_of_eratosthenes(n):\n",
"> \"\"\"Retourne une liste de nombres premiers jusqu'à n.\"\"\"\n",
"> # Initialise une liste de boolean avec True pour tous les nombres de 0 à n\n",
"> primes = [True] * (n + 1)\n",
"> # Définit 0 et 1 comme non-premiers\n",
"> primes[0] = primes[1] = False\n",
"> # Itère de 2 à la racine carrée de n\n",
"> for i in range(2, int(n**0.5) + 1):\n",
"> # Si i est considéré comme premier\n",
"> if primes[i]:\n",
"> # Itère sur tous les multiples de i\n",
"> for j in range(i * i, n + 1, i):\n",
"> # Définit les multiples de i comme non-premiers\n",
"> primes[j] = False\n",
"> # Retourne la liste des indices des nombres premiers\n",
"> return [i for i, is_prime in enumerate(primes) if is_prime]\n",
"> \n",
"> primes = sieve_of_eratosthenes(1000)\n",
"> print(primes)\n",
"> ```\n",
"> \n",
"> **Explication:**\n",
"> \n",
"> * **Initialisation:**\n",
"> * `primes = [True] * (n + 1)`: Crée une liste `primes` de valeurs booléennes, initialement supposant que tous les nombres sont premiers.\n",
"> * `primes[0] = primes[1] = False`: Définit 0 et 1 comme non-premiers.\n",
"> * **Itération:**\n",
"> * `for i in range(2, int(n**0.5) + 1):`: Itère de 2 jusqu'à la racine carrée de `n`. Nous ne devons vérifier que jusqu'à la racine carrée car tout nombre composite doit avoir un facteur premier inférieur ou égal à sa racine carrée.\n",
"> * `if primes[i]:`: Si `i` est considéré comme premier:\n",
"> * `for j in range(i * i, n + 1, i):`: Marquer tous les multiples de `i` comme non-premiers.\n",
"> * **Resultat:**\n",
"> * `return [i for i, is_prime in enumerate(primes) if is_prime]`: Crée une liste des indices où `primes[i]` est vrai, représentant les nombres premiers. \n",
"> \n",
"> \n",
"> \n",
"> <end_of_turn>\n",
"</font>"
],
"text/plain": [
"<IPython.core.display.Markdown object>"
]
Expand Down
10 changes: 10 additions & 0 deletions site/en/gemma/docs/integrations/langchain.ipynb
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,15 @@
{
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "G3MMAcssHTML"
},
"source": [
"<link rel=\"stylesheet\" href=\"/site-assets/css/gemma.css\">\n",
"<link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css2?family=Google+Symbols:opsz,wght,FILL,[email protected],100..700,0..1,-50..200\" />"
]
},
{
"cell_type": "markdown",
"metadata": {
Expand Down
10 changes: 10 additions & 0 deletions site/en/gemma/docs/jax_finetune.ipynb
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,15 @@
{
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "G3MMAcssHTML"
},
"source": [
"<link rel=\"stylesheet\" href=\"/site-assets/css/gemma.css\">\n",
"<link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css2?family=Google+Symbols:opsz,wght,FILL,[email protected],100..700,0..1,-50..200\" />"
]
},
{
"cell_type": "markdown",
"metadata": {
Expand Down
13 changes: 12 additions & 1 deletion site/en/gemma/docs/jax_inference.ipynb
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,15 @@
{
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "G3MMAcssHTML"
},
"source": [
"<link rel=\"stylesheet\" href=\"/site-assets/css/gemma.css\">\n",
"<link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css2?family=Google+Symbols:opsz,wght,FILL,[email protected],100..700,0..1,-50..200\" />"
]
},
{
"cell_type": "markdown",
"metadata": {
Expand Down Expand Up @@ -387,7 +397,8 @@
"name": "stderr",
"output_type": "stream",
"text": [
"\r100%|██████████| 22.5k/22.5k [00:00<00:00, 24.7MB/s]\n",
"\r",
"100%|██████████| 22.5k/22.5k [00:00<00:00, 24.7MB/s]\n",
"\n",
"\n",
" 1%| | 17.0M/1.70G [00:00<00:36, 49.5MB/s]\u001b[A\u001b[A\n",
Expand Down
10 changes: 10 additions & 0 deletions site/en/gemma/docs/keras_inference.ipynb
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,15 @@
{
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "G3MMAcssHTML"
},
"source": [
"<link rel=\"stylesheet\" href=\"/site-assets/css/gemma.css\">\n",
"<link rel=\"stylesheet\" href=\"https://fonts.googleapis.com/css2?family=Google+Symbols:opsz,wght,FILL,[email protected],100..700,0..1,-50..200\" />"
]
},
{
"cell_type": "markdown",
"metadata": {
Expand Down
Loading

0 comments on commit 98a8bb9

Please sign in to comment.