Add files via upload

Fix typo in 7_2_Backpropagation.ipynb

Notebooks/Chap01/1_1_BackgroundMathematics.ipynb

@@ -1,18 +1,16 @@
 {
   "cells": [
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
-        "colab_type": "text",
-        "id": "view-in-github"
+        "id": "view-in-github",
+        "colab_type": "text"
       },
       "source": [
         "<a href=\"https://colab.research.google.com/github/udlbook/udlbook/blob/main/Notebooks/Chap01/1_1_BackgroundMathematics.ipynb\" target=\"_parent\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>"
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "s5zzKSOusPOB"
@@ -41,7 +39,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "WV2Dl6owme2d"
@@ -49,11 +46,11 @@
       "source": [
         "**Linear functions**<br> We will be using the term *linear equation* to mean a weighted sum of inputs plus an offset. If there is just one input $x$, then this is a straight line:\n",
         "\n",
-        "\\begin{equation}y=\\beta+\\omega x,\\end{equation} \n",
+        "\\begin{equation}y=\\beta+\\omega x,\\end{equation}\n",
         "\n",
         "where $\\beta$ is the y-intercept of the linear and $\\omega$ is the slope of the line. When there are two inputs $x_{1}$ and $x_{2}$, then this becomes:\n",
         "\n",
-        "\\begin{equation}y=\\beta+\\omega_1 x_1 + \\omega_2 x_2.\\end{equation} \n",
+        "\\begin{equation}y=\\beta+\\omega_1 x_1 + \\omega_2 x_2.\\end{equation}\n",
         "\n",
         "Any other functions are by definition **non-linear**.\n",
         "\n",
@@ -99,7 +96,7 @@
         "ax.plot(x,y,'r-')\n",
         "ax.set_ylim([0,10]);ax.set_xlim([0,10])\n",
         "ax.set_xlabel('x'); ax.set_ylabel('y')\n",
-        "plt.show\n",
+        "plt.show()\n",
         "\n",
         "# TODO -- experiment with changing the values of beta and omega\n",
         "# to understand what they do.  Try to make a line\n",
@@ -107,7 +104,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "AedfvD9dxShZ"
@@ -192,7 +188,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "i8tLwpls476R"
@@ -236,7 +231,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "fGzVJQ6N-mHJ"
@@ -275,11 +269,10 @@
         "# Compute with vector/matrix form\n",
         "y_vec = beta_vec+np.matmul(omega_mat, x_vec)\n",
         "print(\"Matrix/vector form\")\n",
-        "print('y1= %3.3f\\ny2 = %3.3f'%((y_vec[0],y_vec[1])))\n"
+        "print('y1= %3.3f\\ny2 = %3.3f'%((y_vec[0][0],y_vec[1][0])))\n"
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "3LGRoTMLU8ZU"
@@ -293,7 +286,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "7Y5zdKtKZAB2"
@@ -325,11 +317,10 @@
         "ax.plot(x,y,'r-')\n",
         "ax.set_ylim([0,100]);ax.set_xlim([-5,5])\n",
         "ax.set_xlabel('x'); ax.set_ylabel('exp[x]')\n",
-        "plt.show"
+        "plt.show()"
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "XyrT8257IWCu"
@@ -345,7 +336,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "R6A4e5IxIWCu"
@@ -373,11 +363,10 @@
         "ax.plot(x,y,'r-')\n",
         "ax.set_ylim([-5,5]);ax.set_xlim([0,5])\n",
         "ax.set_xlabel('x'); ax.set_ylabel('$\\log[x]$')\n",
-        "plt.show"
+        "plt.show()"
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "yYWrL5AXIWCv"
@@ -397,8 +386,8 @@
   ],
   "metadata": {
     "colab": {
-      "include_colab_link": true,
-      "provenance": []
+      "provenance": [],
+      "include_colab_link": true
     },
     "kernelspec": {
       "display_name": "Python 3 (ipykernel)",
@@ -420,4 +409,4 @@
   },
   "nbformat": 4,
   "nbformat_minor": 0
-}
+}

Notebooks/Chap02/2_1_Supervised_Learning.ipynb

@@ -4,7 +4,6 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyOmndC0N7dFV7W3Mh5ljOLl",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -197,7 +196,7 @@
       "source": [
         "# Visualizing the loss function\n",
         "\n",
-        "The above process is equivalent to to descending coordinate wise on the loss function<br>\n",
+        "The above process is equivalent to descending coordinate wise on the loss function<br>\n",
         "\n",
         "Now let's plot that function"
       ],
@@ -235,8 +234,8 @@
         "levels = 40\n",
         "ax.contour(phi0_mesh, phi1_mesh, all_losses ,levels, colors=['#80808080'])\n",
         "ax.set_ylim([1,-1])\n",
-        "ax.set_xlabel('Intercept, $\\phi_0$')\n",
-        "ax.set_ylabel('Slope, $\\phi_1$')\n",
+        "ax.set_xlabel(r'Intercept, $\\phi_0$')\n",
+        "ax.set_ylabel(r'Slope, $\\phi_1$')\n",
         "\n",
         "# Plot the position of your best fitting line on the loss function\n",
         "# It should be close to the minimum\n",

Notebooks/Chap03/3_1_Shallow_Networks_I.ipynb

@@ -1,18 +1,16 @@
 {
   "cells": [
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
-        "colab_type": "text",
-        "id": "view-in-github"
+        "id": "view-in-github",
+        "colab_type": "text"
       },
       "source": [
         "<a href=\"https://colab.research.google.com/github/udlbook/udlbook/blob/main/Notebooks/Chap03/3_1_Shallow_Networks_I.ipynb\" target=\"_parent\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>"
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "1Z6LB4Ybn1oN"
@@ -42,7 +40,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "wQDy9UzXpnf5"
@@ -102,8 +99,8 @@
       "source": [
         "# Define a shallow neural network with, one input, one output, and three hidden units\n",
         "def shallow_1_1_3(x, activation_fn, phi_0,phi_1,phi_2,phi_3, theta_10, theta_11, theta_20, theta_21, theta_30, theta_31):\n",
-        "  # TODO Replace the lines below to compute the three initial lines\n",
-        "  # (figure 3.3a-c) from the theta parameters.  These are the preactivations\n",
+        "  # TODO Replace the code below to compute the three initial lines\n",
+        "  # from the theta parameters (i.e. implement equations at bottom of figure 3.3a-c).  These are the preactivations\n",
         "  pre_1 = np.zeros_like(x)\n",
         "  pre_2 = np.zeros_like(x)\n",
         "  pre_3 = np.zeros_like(x)\n",
@@ -199,7 +196,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "T34bszToImKQ"
@@ -210,7 +206,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "jhaBSS8oIWSX"
@@ -269,7 +264,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "osonHsEqVp2I"
@@ -354,9 +348,8 @@
   ],
   "metadata": {
     "colab": {
-      "authorship_tag": "ABX9TyPBNztJrxnUt1ELWfm1Awa3",
-      "include_colab_link": true,
-      "provenance": []
+      "provenance": [],
+      "include_colab_link": true
     },
     "kernelspec": {
       "display_name": "Python 3",
@@ -368,4 +361,4 @@
   },
   "nbformat": 4,
   "nbformat_minor": 0
-}
+}

Notebooks/Chap04/4_2_Clipping_functions.ipynb

@@ -4,7 +4,7 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyPkFrjmRAUf0fxN07RC4xMI",
+      "authorship_tag": "ABX9TyPZzptvvf7OPZai8erQ/0xT",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -127,26 +127,26 @@
         "    fig, ax = plt.subplots(3,3)\n",
         "    fig.set_size_inches(8.5, 8.5)\n",
         "    fig.tight_layout(pad=3.0)\n",
-        "    ax[0,0].plot(x,layer2_pre_1,'r-'); ax[0,0].set_ylabel('$\\psi_{10}+\\psi_{11}h_{1}+\\psi_{12}h_{2}+\\psi_{13}h_3$')\n",
-        "    ax[0,1].plot(x,layer2_pre_2,'b-'); ax[0,1].set_ylabel('$\\psi_{20}+\\psi_{21}h_{1}+\\psi_{22}h_{2}+\\psi_{23}h_3$')\n",
-        "    ax[0,2].plot(x,layer2_pre_3,'g-'); ax[0,2].set_ylabel('$\\psi_{30}+\\psi_{31}h_{1}+\\psi_{32}h_{2}+\\psi_{33}h_3$')\n",
-        "    ax[1,0].plot(x,h1_prime,'r-'); ax[1,0].set_ylabel(\"$h_{1}^{'}$\")\n",
-        "    ax[1,1].plot(x,h2_prime,'b-'); ax[1,1].set_ylabel(\"$h_{2}^{'}$\")\n",
-        "    ax[1,2].plot(x,h3_prime,'g-'); ax[1,2].set_ylabel(\"$h_{3}^{'}$\")\n",
-        "    ax[2,0].plot(x,phi1_h1_prime,'r-'); ax[2,0].set_ylabel(\"$\\phi_1 h_{1}^{'}$\")\n",
-        "    ax[2,1].plot(x,phi2_h2_prime,'b-'); ax[2,1].set_ylabel(\"$\\phi_2 h_{2}^{'}$\")\n",
-        "    ax[2,2].plot(x,phi3_h3_prime,'g-'); ax[2,2].set_ylabel(\"$\\phi_3 h_{3}^{'}$\")\n",
+        "    ax[0,0].plot(x,layer2_pre_1,'r-'); ax[0,0].set_ylabel(r'$\\psi_{10}+\\psi_{11}h_{1}+\\psi_{12}h_{2}+\\psi_{13}h_3$')\n",
+        "    ax[0,1].plot(x,layer2_pre_2,'b-'); ax[0,1].set_ylabel(r'$\\psi_{20}+\\psi_{21}h_{1}+\\psi_{22}h_{2}+\\psi_{23}h_3$')\n",
+        "    ax[0,2].plot(x,layer2_pre_3,'g-'); ax[0,2].set_ylabel(r'$\\psi_{30}+\\psi_{31}h_{1}+\\psi_{32}h_{2}+\\psi_{33}h_3$')\n",
+        "    ax[1,0].plot(x,h1_prime,'r-'); ax[1,0].set_ylabel(r\"$h_{1}^{'}$\")\n",
+        "    ax[1,1].plot(x,h2_prime,'b-'); ax[1,1].set_ylabel(r\"$h_{2}^{'}$\")\n",
+        "    ax[1,2].plot(x,h3_prime,'g-'); ax[1,2].set_ylabel(r\"$h_{3}^{'}$\")\n",
+        "    ax[2,0].plot(x,phi1_h1_prime,'r-'); ax[2,0].set_ylabel(r\"$\\phi_1 h_{1}^{'}$\")\n",
+        "    ax[2,1].plot(x,phi2_h2_prime,'b-'); ax[2,1].set_ylabel(r\"$\\phi_2 h_{2}^{'}$\")\n",
+        "    ax[2,2].plot(x,phi3_h3_prime,'g-'); ax[2,2].set_ylabel(r\"$\\phi_3 h_{3}^{'}$\")\n",
         "\n",
         "    for plot_y in range(3):\n",
         "      for plot_x in range(3):\n",
         "        ax[plot_y,plot_x].set_xlim([0,1]);ax[plot_x,plot_y].set_ylim([-1,1])\n",
         "        ax[plot_y,plot_x].set_aspect(0.5)\n",
-        "      ax[2,plot_y].set_xlabel('Input, $x$');\n",
+        "      ax[2,plot_y].set_xlabel(r'Input, $x$');\n",
         "    plt.show()\n",
         "\n",
         "    fig, ax = plt.subplots()\n",
         "    ax.plot(x,y)\n",
-        "    ax.set_xlabel('Input, $x$'); ax.set_ylabel('Output, $y$')\n",
+        "    ax.set_xlabel(r'Input, $x$'); ax.set_ylabel(r'Output, $y$')\n",
         "    ax.set_xlim([0,1]);ax.set_ylim([-1,1])\n",
         "    ax.set_aspect(0.5)\n",
         "    plt.show()"

Notebooks/Chap05/5_1_Least_Squares_Loss.ipynb

@@ -118,7 +118,7 @@
         "  ax.plot(x_model,y_model)\n",
         "  if sigma_model is not None:\n",
         "    ax.fill_between(x_model, y_model-2*sigma_model, y_model+2*sigma_model, color='lightgray')\n",
-        "  ax.set_xlabel('Input, $x$'); ax.set_ylabel('Output, $y$')\n",
+        "  ax.set_xlabel(r'Input, $x$'); ax.set_ylabel(r'Output, $y$')\n",
         "  ax.set_xlim([0,1]);ax.set_ylim([-1,1])\n",
         "  ax.set_aspect(0.5)\n",
         "  if title is not None:\n",
@@ -222,7 +222,7 @@
         "gauss_prob = normal_distribution(y_gauss, mu, sigma)\n",
         "fig, ax = plt.subplots()\n",
         "ax.plot(y_gauss, gauss_prob)\n",
-        "ax.set_xlabel('Input, $y$'); ax.set_ylabel('Probability $Pr(y)$')\n",
+        "ax.set_xlabel(r'Input, $y$'); ax.set_ylabel(r'Probability $Pr(y)$')\n",
         "ax.set_xlim([-5,5]);ax.set_ylim([0,1.0])\n",
         "plt.show()\n",
         "\n",
@@ -590,4 +590,4 @@
       }
     }
   ]
-}
+}

Notebooks/Chap05/5_2_Binary_Cross_Entropy_Loss.ipynb

@@ -119,12 +119,12 @@
         "  fig.set_size_inches(7.0, 3.5)\n",
         "  fig.tight_layout(pad=3.0)\n",
         "  ax[0].plot(x_model,out_model)\n",
-        "  ax[0].set_xlabel('Input, $x$'); ax[0].set_ylabel('Model output')\n",
+        "  ax[0].set_xlabel(r'Input, $x$'); ax[0].set_ylabel(r'Model output')\n",
         "  ax[0].set_xlim([0,1]);ax[0].set_ylim([-4,4])\n",
         "  if title is not None:\n",
         "    ax[0].set_title(title)\n",
         "  ax[1].plot(x_model,lambda_model)\n",
-        "  ax[1].set_xlabel('Input, $x$'); ax[1].set_ylabel('$\\lambda$ or Pr(y=1|x)')\n",
+        "  ax[1].set_xlabel(r'Input, $x$'); ax[1].set_ylabel(r'$\\lambda$ or Pr(y=1|x)')\n",
         "  ax[1].set_xlim([0,1]);ax[1].set_ylim([-0.05,1.05])\n",
         "  if title is not None:\n",
         "    ax[1].set_title(title)\n",

Notebooks/Chap06/6_1_Line_Search.ipynb

@@ -4,7 +4,6 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyN4E9Vtuk6t2BhZ0Ajv5SW3",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -67,7 +66,7 @@
         "  fig,ax = plt.subplots()\n",
         "  ax.plot(phi_plot,loss_function(phi_plot),'r-')\n",
         "  ax.set_xlim(0,1); ax.set_ylim(0,1)\n",
-        "  ax.set_xlabel('$\\phi$'); ax.set_ylabel('$L[\\phi]$')\n",
+        "  ax.set_xlabel(r'$\\phi$'); ax.set_ylabel(r'$L[\\phi]$')\n",
         "  if a is not None and b is not None and c is not None and d is not None:\n",
         "      plt.axvspan(a, d, facecolor='k', alpha=0.2)\n",
         "      ax.plot([a,a],[0,1],'b-')\n",
@@ -189,4 +188,4 @@
       "outputs": []
     }
   ]
-}
+}

Notebooks/Chap06/6_5_Adam.ipynb

@@ -108,8 +108,8 @@
         "    ax.contour(phi0mesh, phi1mesh, loss_function, 20, colors=['#80808080'])\n",
         "    ax.plot(opt_path[0,:], opt_path[1,:],'-', color='#a0d9d3ff')\n",
         "    ax.plot(opt_path[0,:], opt_path[1,:],'.', color='#a0d9d3ff',markersize=10)\n",
-        "    ax.set_xlabel(\"$\\phi_{0}$\")\n",
-        "    ax.set_ylabel(\"$\\phi_{1}$\")\n",
+        "    ax.set_xlabel(r\"$\\phi_{0}$\")\n",
+        "    ax.set_ylabel(r\"$\\phi_{1}$\")\n",
         "    plt.show()"
       ],
       "metadata": {
@@ -221,7 +221,7 @@
     {
       "cell_type": "markdown",
       "source": [
-        "This moves towards the minimum at a sensible speed, but we never actually converge -- the solution just bounces back and forth between the last two points.  To make it converge, we add momentum to both the estimates of the gradient and the pointwise squared gradient.  We also modify the statistics by a factor that depends on the time to make sure the progress is now slow to start with."
+        "This moves towards the minimum at a sensible speed, but we never actually converge -- the solution just bounces back and forth between the last two points.  To make it converge, we add momentum to both the estimates of the gradient and the pointwise squared gradient.  We also modify the statistics by a factor that depends on the time to make sure the progress is not slow to start with."
       ],
       "metadata": {
         "id": "_6KoKBJdGGI4"
@@ -284,4 +284,4 @@
       "outputs": []
     }
   ]
-}
+}

Notebooks/Chap07/7_2_Backpropagation.ipynb

@@ -143,7 +143,7 @@
         "  # Run through the layers, calculating all_f[0...K-1] and all_h[1...K]\n",
         "  for layer in range(K):\n",
         "      # Update preactivations and activations at this layer according to eqn 7.16\n",
-        "      # Remmember to use np.matmul for matrix multiplications\n",
+        "      # Remember to use np.matmul for matrix multiplications\n",
         "      # TODO -- Replace the lines below\n",
         "      all_f[layer] = all_h[layer]\n",
         "      all_h[layer+1] = all_f[layer]\n",
@@ -353,4 +353,4 @@
       "outputs": []
     }
   ]
-}
+}

Notebooks/Chap07/7_3_Initialization.ipynb

@@ -4,7 +4,6 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyOaATWBrwVMylV1akcKtHjt",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -250,7 +249,7 @@
         "# Main backward pass routine\n",
         "def backward_pass(all_weights, all_biases, all_f, all_h, y):\n",
         "  # Retrieve number of layers\n",
-        "  K = all_weights\n",
+        "  K = len(all_weights) - 1\n",
         "\n",
         "  # We'll store the derivatives dl_dweights and dl_dbiases in lists as well\n",
         "  all_dl_dweights = [None] * (K+1)\n",

Notebooks/Chap08/8_1_MNIST_1D_Performance.ipynb

@@ -46,8 +46,8 @@
     {
       "cell_type": "code",
       "source": [
-        "# Run this if you're in a Colab to make a local copy of the MNIST 1D repository\n",
-        "!git clone https://github.com/greydanus/mnist1d"
+        "# Run this if you're in a Colab to install MNIST 1D repository\n",
+        "%pip install git+https://github.com/greydanus/mnist1d"
       ],
       "metadata": {
         "id": "ifVjS4cTOqKz"
@@ -83,6 +83,8 @@
     {
       "cell_type": "code",
       "source": [
+        "!mkdir ./sample_data\n",
+        "\n",
         "args = mnist1d.data.get_dataset_args()\n",
         "data = mnist1d.data.get_dataset(args, path='./sample_data/mnist1d_data.pkl', download=False, regenerate=False)\n",
         "\n",
@@ -136,7 +138,6 @@
         "optimizer = torch.optim.SGD(model.parameters(), lr = 0.05, momentum=0.9)\n",
         "# object that decreases learning rate by half every 10 epochs\n",
         "scheduler = StepLR(optimizer, step_size=10, gamma=0.5)\n",
-        "# create 100 dummy data points and store in data loader class\n",
         "x_train = torch.tensor(data['x'].astype('float32'))\n",
         "y_train = torch.tensor(data['y'].transpose().astype('long'))\n",
         "x_test= torch.tensor(data['x_test'].astype('float32'))\n",
@@ -235,4 +236,4 @@
       }
     }
   ]
-}
+}

Notebooks/Chap08/8_2_Bias_Variance_Trade_Off.ipynb

@@ -92,7 +92,7 @@
     {
       "cell_type": "code",
       "source": [
-        "# Draw the fitted function, together win uncertainty used to generate points\n",
+        "# Draw the fitted function, together with uncertainty used to generate points\n",
         "def plot_function(x_func, y_func, x_data=None,y_data=None, x_model = None, y_model =None, sigma_func = None, sigma_model=None):\n",
         "\n",
         "    fig,ax = plt.subplots()\n",
@@ -203,7 +203,7 @@
         "# Closed form solution\n",
         "beta, omega = fit_model_closed_form(x_data,y_data,n_hidden=3)\n",
         "\n",
-        "# Get prediction for model across graph grange\n",
+        "# Get prediction for model across graph range\n",
         "x_model = np.linspace(0,1,100);\n",
         "y_model = network(x_model, beta, omega)\n",
         "\n",
@@ -302,7 +302,7 @@
         "sigma_func = 0.3\n",
         "n_hidden = 5\n",
         "\n",
-        "# Set random seed so that get same result every time\n",
+        "# Set random seed so that we get the same result every time\n",
         "np.random.seed(1)\n",
         "\n",
         "for c_hidden in range(len(hidden_variables)):\n",
@@ -344,4 +344,4 @@
       "outputs": []
     }
   ]
-}
+}

Notebooks/Chap08/8_3_Double_Descent.ipynb

@@ -5,7 +5,6 @@
     "colab": {
       "provenance": [],
       "gpuType": "T4",
-      "authorship_tag": "ABX9TyN/KUpEObCKnHZ/4Onp5sHG",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -48,8 +47,8 @@
     {
       "cell_type": "code",
       "source": [
-        "# Run this if you're in a Colab to make a local copy of the MNIST 1D repository\n",
-        "!git clone https://github.com/greydanus/mnist1d"
+        "# Run this if you're in a Colab to install MNIST 1D repository\n",
+        "!pip install git+https://github.com/greydanus/mnist1d"
       ],
       "metadata": {
         "id": "fn9BP5N5TguP"
@@ -124,7 +123,7 @@
         "  D_k = n_hidden   # Hidden dimensions\n",
         "  D_o = 10    # Output dimensions\n",
         "\n",
-        "  # Define a model with two hidden layers of size 100\n",
+        "  # Define a model with two hidden layers\n",
         "  # And ReLU activations between them\n",
         "  model = nn.Sequential(\n",
         "  nn.Linear(D_i, D_k),\n",
@@ -157,7 +156,6 @@
         "  optimizer = torch.optim.SGD(model.parameters(), lr = 0.01, momentum=0.9)\n",
         "\n",
         "\n",
-        "  # create 100 dummy data points and store in data loader class\n",
         "  x_train = torch.tensor(data['x'].astype('float32'))\n",
         "  y_train = torch.tensor(data['y'].transpose().astype('long'))\n",
         "  x_test= torch.tensor(data['x_test'].astype('float32'))\n",

Notebooks/Chap08/8_4_High_Dimensional_Spaces.ipynb

@@ -224,7 +224,7 @@
     {
       "cell_type": "markdown",
       "source": [
-        "You should see see that by the time we get to 300 dimensions most of the volume is in the outer 1 percent. <br><br>\n",
+        "You should see that by the time we get to 300 dimensions most of the volume is in the outer 1 percent. <br><br>\n",
         "\n",
         "The conclusion of all of this is that in high dimensions you should be sceptical of your intuitions about how things work.  I have tried to visualize many things in one or two dimensions in the book, but you should also be sceptical about these visualizations!"
       ],
@@ -233,4 +233,4 @@
       }
     }
   ]
-}
+}

Notebooks/Chap09/9_1_L2_Regularization.ipynb

@@ -178,7 +178,7 @@
         "\n",
         "def draw_loss_function(compute_loss, data,  model, my_colormap, phi_iters = None):\n",
         "\n",
-        "  # Make grid of intercept/slope values to plot\n",
+        "  # Make grid of offset/frequency values to plot\n",
         "  offsets_mesh, freqs_mesh = np.meshgrid(np.arange(-10,10.0,0.1), np.arange(2.5,22.5,0.1))\n",
         "  loss_mesh = np.zeros_like(freqs_mesh)\n",
         "  # Compute loss for every set of parameters\n",
@@ -304,7 +304,7 @@
         "for c_step in range (n_steps):\n",
         "  # Do gradient descent step\n",
         "  phi_all[:,c_step+1:c_step+2] = gradient_descent_step(phi_all[:,c_step:c_step+1],data, model)\n",
-        "  # Measure loss and draw model every 4th step\n",
+        "  # Measure loss and draw model every 8th step\n",
         "  if c_step % 8 == 0:\n",
         "    loss =  compute_loss(data[0,:], data[1,:], model, phi_all[:,c_step+1:c_step+2])\n",
         "    draw_model(data,model,phi_all[:,c_step+1], \"Iteration %d, loss = %f\"%(c_step+1,loss))\n",
@@ -369,7 +369,7 @@
         "# Code to draw the regularization function\n",
         "def draw_reg_function():\n",
         "\n",
-        "  # Make grid of intercept/slope values to plot\n",
+        "  # Make grid of offset/frequency values to plot\n",
         "  offsets_mesh, freqs_mesh = np.meshgrid(np.arange(-10,10.0,0.1), np.arange(2.5,22.5,0.1))\n",
         "  loss_mesh = np.zeros_like(freqs_mesh)\n",
         "  # Compute loss for every set of parameters\n",
@@ -399,7 +399,7 @@
         "# Code to draw loss function with regularization\n",
         "def draw_loss_function_reg(data,  model, lambda_, my_colormap, phi_iters = None):\n",
         "\n",
-        "  # Make grid of intercept/slope values to plot\n",
+        "  # Make grid of offset/frequency values to plot\n",
         "  offsets_mesh, freqs_mesh = np.meshgrid(np.arange(-10,10.0,0.1), np.arange(2.5,22.5,0.1))\n",
         "  loss_mesh = np.zeros_like(freqs_mesh)\n",
         "  # Compute loss for every set of parameters\n",
@@ -512,7 +512,7 @@
         "for c_step in range (n_steps):\n",
         "  # Do gradient descent step\n",
         "  phi_all[:,c_step+1:c_step+2] = gradient_descent_step2(phi_all[:,c_step:c_step+1],lambda_, data, model)\n",
-        "  # Measure loss and draw model every 4th step\n",
+        "  # Measure loss and draw model every 8th step\n",
         "  if c_step % 8 == 0:\n",
         "    loss =  compute_loss2(data[0,:], data[1,:], model, phi_all[:,c_step+1:c_step+2], lambda_)\n",
         "    draw_model(data,model,phi_all[:,c_step+1], \"Iteration %d, loss = %f\"%(c_step+1,loss))\n",
@@ -528,7 +528,7 @@
     {
       "cell_type": "markdown",
       "source": [
-        "You should see that the gradient descent algorithm now finds the correct minimum.  By applying a tiny bit of domain knowledge (the parameter phi0 tends to be near zero and the parameters phi1 tends to be near 12.5), we get a better solution.  However, the cost is that this solution is slightly biased towards this prior knowledge."
+        "You should see that the gradient descent algorithm now finds the correct minimum.  By applying a tiny bit of domain knowledge (the parameter phi0 tends to be near zero and the parameter phi1 tends to be near 12.5), we get a better solution.  However, the cost is that this solution is slightly biased towards this prior knowledge."
       ],
       "metadata": {
         "id": "wrszSLrqZG4k"

Notebooks/Chap09/9_2_Implicit_Regularization.ipynb

@@ -4,7 +4,6 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyOR3WOJwfTlMD8eOLsPfPrz",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -140,7 +139,7 @@
         "    fig.set_size_inches(7,7)\n",
         "    ax.contourf(phi0mesh, phi1mesh, loss_function, 256, cmap=my_colormap);\n",
         "    ax.contour(phi0mesh, phi1mesh, loss_function, 20, colors=['#80808080'])\n",
-        "    ax.set_xlabel('$\\phi_{0}$'); ax.set_ylabel('$\\phi_{1}$')\n",
+        "    ax.set_xlabel(r'$\\phi_{0}$'); ax.set_ylabel(r'$\\phi_{1}$')\n",
         "\n",
         "    if grad_path_typical_lr is not None:\n",
         "        ax.plot(grad_path_typical_lr[0,:], grad_path_typical_lr[1,:],'ro-')\n",
@@ -335,4 +334,4 @@
       }
     }
   ]
-}
+}

Notebooks/Chap09/9_3_Ensembling.ipynb

@@ -52,7 +52,7 @@
         "# import libraries\n",
         "import numpy as np\n",
         "import matplotlib.pyplot as plt\n",
-        "# Define seed so get same results each time\n",
+        "# Define seed to get same results each time\n",
         "np.random.seed(1)"
       ]
     },
@@ -80,7 +80,7 @@
         "    for i in range(n_data):\n",
         "        x[i] = np.random.uniform(i/n_data, (i+1)/n_data, 1)\n",
         "\n",
-        "    # y value from running through functoin and adding noise\n",
+        "    # y value from running through function and adding noise\n",
         "    y = np.ones(n_data)\n",
         "    for i in range(n_data):\n",
         "        y[i] = true_function(x[i])\n",
@@ -96,7 +96,7 @@
     {
       "cell_type": "code",
       "source": [
-        "# Draw the fitted function, together win uncertainty used to generate points\n",
+        "# Draw the fitted function, together with uncertainty used to generate points\n",
         "def plot_function(x_func, y_func, x_data=None,y_data=None, x_model = None, y_model =None, sigma_func = None, sigma_model=None):\n",
         "\n",
         "    fig,ax = plt.subplots()\n",
@@ -137,7 +137,7 @@
         "n_data = 15\n",
         "x_data,y_data = generate_data(n_data, sigma_func)\n",
         "\n",
-        "# Plot the functinon, data and uncertainty\n",
+        "# Plot the function, data and uncertainty\n",
         "plot_function(x_func, y_func, x_data, y_data, sigma_func=sigma_func)"
       ],
       "metadata": {
@@ -216,7 +216,7 @@
         "# Closed form solution\n",
         "beta, omega = fit_model_closed_form(x_data,y_data,n_hidden=14)\n",
         "\n",
-        "# Get prediction for model across graph grange\n",
+        "# Get prediction for model across graph range\n",
         "x_model = np.linspace(0,1,100);\n",
         "y_model = network(x_model, beta, omega)\n",
         "\n",
@@ -297,7 +297,7 @@
     {
       "cell_type": "code",
       "source": [
-        "# Plot the median of the results\n",
+        "# Plot the mean of the results\n",
         "# TODO -- find the mean prediction\n",
         "# Replace this line\n",
         "y_model_mean = all_y_model[0,:]\n",
@@ -325,4 +325,4 @@
       }
     }
   ]
-}
+}

Notebooks/Chap09/9_4_Bayesian_Approach.ipynb

@@ -1,18 +1,16 @@
 {
   "cells": [
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
-        "colab_type": "text",
-        "id": "view-in-github"
+        "id": "view-in-github",
+        "colab_type": "text"
       },
       "source": [
         "<a href=\"https://colab.research.google.com/github/udlbook/udlbook/blob/main/Notebooks/Chap09/9_4_Bayesian_Approach.ipynb\" target=\"_parent\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>"
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "el8l05WQEO46"
@@ -38,7 +36,7 @@
         "# import libraries\n",
         "import numpy as np\n",
         "import matplotlib.pyplot as plt\n",
-        "# Define seed so get same results each time\n",
+        "# Define seed to get same results each time\n",
         "np.random.seed(1)"
       ]
     },
@@ -87,7 +85,7 @@
       },
       "outputs": [],
       "source": [
-        "# Draw the fitted function, together win uncertainty used to generate points\n",
+        "# Draw the fitted function, together with uncertainty used to generate points\n",
         "def plot_function(x_func, y_func, x_data=None,y_data=None, x_model = None, y_model =None, sigma_func = None, sigma_model=None):\n",
         "\n",
         "    fig,ax = plt.subplots()\n",
@@ -159,7 +157,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "i8T_QduzeBmM"
@@ -195,7 +192,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "JojV6ueRk49G"
@@ -211,7 +207,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "YX0O_Ciwp4W1"
@@ -225,7 +220,7 @@
         " &\\propto&\\text{Norm}_{\\boldsymbol\\phi}\\biggl[\\frac{1}{\\sigma^2}\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\\mathbf{H}\\mathbf{y},\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\\biggr].\n",
         "\\end{align}\n",
         "\n",
-        "In fact, since this already a normal distribution, the constant of proportionality must be one and we can write\n",
+        "In fact, since this is already a normal distribution, the constant of proportionality must be one and we can write\n",
         "\n",
         "\\begin{align}\n",
         " Pr(\\boldsymbol\\phi|\\{\\mathbf{x}_{i},\\mathbf{y}_{i}\\}) &=& \\text{Norm}_{\\boldsymbol\\phi}\\biggl[\\frac{1}{\\sigma^2}\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\\mathbf{H}\\mathbf{y},\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\\biggr].\n",
@@ -277,7 +272,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "GjPnlG4q0UFK"
@@ -334,7 +328,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "GiNg5EroUiUb"
@@ -343,17 +336,16 @@
         "Now we need to perform inference for a new data points $\\mathbf{x}^*$ with corresponding hidden values $\\mathbf{h}^*$.  Instead of having a single estimate of the parameters, we have a distribution over the possible parameters.  So we marginalize (integrate) over this distribution to account for all possible values:\n",
         "\n",
         "\\begin{align}\n",
-        "Pr(y^*|\\mathbf{x}^*)  &=& \\int Pr(y^{*}|\\mathbf{x}^*,\\boldsymbol\\phi)Pr(\\boldsymbol\\phi|\\{\\mathbf{x}_{i},\\mathbf{y}_{i}\\}) d\\boldsymbol\\phi\\\\\n",
-        "&=& \\int \\text{Norm}_{y^*}\\bigl[[\\mathbf{h}^{*T},1]\\boldsymbol\\phi,\\sigma^2\\bigr]\\cdot\\text{Norm}_{\\boldsymbol\\phi}\\biggl[\\frac{1}{\\sigma^2}\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\\mathbf{H}\\mathbf{y},\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\\biggr]d\\boldsymbol\\phi\\\\\n",
-        "&=& \\text{Norm}_{y^*}\\biggl[\\frac{1}{\\sigma^2} [\\mathbf{h}^{*T},1]\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\\mathbf{H}\\mathbf{y},  [\\mathbf{h}^{*T},1]\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\n",
-        "[\\mathbf{h}^*;1]\\biggr]\n",
+        "Pr(y^*|\\mathbf{x}^*)  &= \\int Pr(y^{*}|\\mathbf{x}^*,\\boldsymbol\\phi)Pr(\\boldsymbol\\phi|\\{\\mathbf{x}_{i},\\mathbf{y}_{i}\\}) d\\boldsymbol\\phi\\\\\n",
+        "&= \\int \\text{Norm}_{y^*}\\bigl[[\\mathbf{h}^{*T},1]\\boldsymbol\\phi,\\sigma^2\\bigr]\\cdot\\text{Norm}_{\\boldsymbol\\phi}\\biggl[\\frac{1}{\\sigma^2}\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\\mathbf{H}\\mathbf{y},\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\\biggr]d\\boldsymbol\\phi\\\\\n",
+        "&= \\text{Norm}_{y^*}\\biggl[\\frac{1}{\\sigma^2} [\\mathbf{h}^{*T},1]\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\\mathbf{H}\\mathbf{y},  [\\mathbf{h}^{*T},1]\\left(\\frac{1}{\\sigma^2}\\mathbf{H}\\mathbf{H}^T+\\frac{1}{\\sigma_p^2}\\mathbf{I}\\right)^{-1}\n",
+        "[\\mathbf{h}^*;1]\\biggr],\n",
         "\\end{align}\n",
         "\n",
+        "where the notation $[\\mathbf{h}^{*T},1]$ is a row vector containing $\\mathbf{h}^{T}$ with a one appended to the end and $[\\mathbf{h};1 ]$ is a column vector containing $\\mathbf{h}$ with a one appended to the end.\n",
         "\n",
         "\n",
-        "\n",
-        "To compute this, we reformulated the integrand using the relations from appendices\n",
-        "C.3.3 and C.3.4 as the product of a normal distribution in $\\boldsymbol\\phi$ and a constant with respect\n",
+        "To compute this, we reformulated the integrand using the relations from appendices C.3.3 and C.3.4 as the product of a normal distribution in $\\boldsymbol\\phi$ and a constant with respect\n",
         "to $\\boldsymbol\\phi$. The integral of the normal distribution must be one, and so the final result is just the constant. This constant is itself a normal distribution in $y^*$. <br>\n",
         "\n",
         "If you feel so inclined you can work through the math of this yourself.\n",
@@ -404,7 +396,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "8Hcbe_16sK0F"
@@ -419,9 +410,8 @@
   ],
   "metadata": {
     "colab": {
-      "authorship_tag": "ABX9TyMB8B4269DVmrcLoCWrhzKF",
-      "include_colab_link": true,
-      "provenance": []
+      "provenance": [],
+      "include_colab_link": true
     },
     "kernelspec": {
       "display_name": "Python 3",

Notebooks/Chap09/9_5_Augmentation.ipynb

@@ -4,7 +4,6 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyM38ZVBK4/xaHk5Ys5lF6dN",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -44,8 +43,8 @@
     {
       "cell_type": "code",
       "source": [
-        "# Run this if you're in a Colab to make a local copy of the MNIST 1D repository\n",
-        "!git clone https://github.com/greydanus/mnist1d"
+        "# Run this if you're in a Colab to install MNIST 1D repository\n",
+        "!pip install git+https://github.com/greydanus/mnist1d"
       ],
       "metadata": {
         "id": "syvgxgRr3myY"
@@ -95,7 +94,7 @@
         "D_k = 200   # Hidden dimensions\n",
         "D_o = 10    # Output dimensions\n",
         "\n",
-        "# Define a model with two hidden layers of size 100\n",
+        "# Define a model with two hidden layers of size 200\n",
         "# And ReLU activations between them\n",
         "model = nn.Sequential(\n",
         "nn.Linear(D_i, D_k),\n",
@@ -186,7 +185,7 @@
         "ax.plot(errors_test,'b-',label='test')\n",
         "ax.set_ylim(0,100); ax.set_xlim(0,n_epoch)\n",
         "ax.set_xlabel('Epoch'); ax.set_ylabel('Error')\n",
-        "ax.set_title('TrainError %3.2f, Test Error %3.2f'%(errors_train[-1],errors_test[-1]))\n",
+        "ax.set_title('Train Error %3.2f, Test Error %3.2f'%(errors_train[-1],errors_test[-1]))\n",
         "ax.legend()\n",
         "plt.show()"
       ],
@@ -233,7 +232,7 @@
       "cell_type": "code",
       "source": [
         "n_data_orig = data['x'].shape[0]\n",
-        "# We'll double the amount o fdata\n",
+        "# We'll double the amount of data\n",
         "n_data_augment = n_data_orig+4000\n",
         "augmented_x = np.zeros((n_data_augment, D_i))\n",
         "augmented_y = np.zeros(n_data_augment)\n",

Notebooks/Chap10/10_2_Convolution_for_MNIST_1D.ipynb

@@ -4,7 +4,7 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyNJodaaCLMRWL9vTl8B/iLI",
+      "authorship_tag": "ABX9TyNb46PJB/CC1pcHGfjpUUZg",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -45,8 +45,8 @@
     {
       "cell_type": "code",
       "source": [
-        "# Run this if you're in a Colab to make a local copy of the MNIST 1D repository\n",
-        "!git clone https://github.com/greydanus/mnist1d"
+        "# Run this if you're in a Colab to install MNIST 1D repository\n",
+        "!pip install git+https://github.com/greydanus/mnist1d"
       ],
       "metadata": {
         "id": "D5yLObtZCi9J"

Notebooks/Chap11/11_1_Shattered_Gradients.ipynb

@@ -4,7 +4,7 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyMLKg5ZmXqojcVrZD5BGm9g",
+      "authorship_tag": "ABX9TyP3VmRg51U+7NCfSYjRRrgv",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -267,8 +267,8 @@
         "  fig,ax = plt.subplots()\n",
         "  ax.plot(np.squeeze(x_in), np.squeeze(dydx), 'b-')\n",
         "  ax.set_xlim(-2,2)\n",
-        "  ax.set_xlabel('Input, $x$')\n",
-        "  ax.set_ylabel('Gradient, $dy/dx$')\n",
+        "  ax.set_xlabel(r'Input, $x$')\n",
+        "  ax.set_ylabel(r'Gradient, $dy/dx$')\n",
         "  ax.set_title('No layers = %d'%(K))\n",
         "  plt.show()"
       ],

Notebooks/Chap11/11_2_Residual_Networks.ipynb

@@ -4,7 +4,7 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyMXS3SPB4cS/4qxix0lH/Hq",
+      "authorship_tag": "ABX9TyNIY8tswL9e48d5D53aSmHO",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -45,8 +45,8 @@
     {
       "cell_type": "code",
       "source": [
-        "# Run this if you're in a Colab to make a local copy of the MNIST 1D repository\n",
-        "!git clone https://github.com/greydanus/mnist1d"
+        "# Run this if you're in a Colab to install MNIST 1D repository\n",
+        "!pip install git+https://github.com/greydanus/mnist1d"
       ],
       "metadata": {
         "id": "D5yLObtZCi9J"

Notebooks/Chap11/11_3_Batch_Normalization.ipynb

@@ -4,7 +4,7 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyPVeAd3eDpEOCFh8CVyr1zz",
+      "authorship_tag": "ABX9TyPx2mM2zTHmDJeKeiE1RymT",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -45,8 +45,8 @@
     {
       "cell_type": "code",
       "source": [
-        "# Run this if you're in a Colab to make a local copy of the MNIST 1D repository\n",
-        "!git clone https://github.com/greydanus/mnist1d"
+        "# Run this if you're in a Colab to install MNIST 1D repository\n",
+        "!pip install git+https://github.com/greydanus/mnist1d"
       ],
       "metadata": {
         "id": "D5yLObtZCi9J"

Notebooks/Chap12/12_2_Multihead_Self_Attention.ipynb

@@ -4,7 +4,6 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyMSk8qTqDYqFnRJVZKlsue0",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -147,9 +146,7 @@
         "  exp_values = np.exp(data_in) ;\n",
         "  # Sum over columns\n",
         "  denom = np.sum(exp_values, axis = 0);\n",
-        "  # Replicate denominator to N rows\n",
-        "  denom = np.matmul(np.ones((data_in.shape[0],1)), denom[np.newaxis,:])\n",
-        "  # Compute softmax\n",
+        "  # Compute softmax (numpy broadcasts denominator to all rows automatically)\n",
         "  softmax = exp_values / denom\n",
         "  # return the answer\n",
         "  return softmax"

Notebooks/Chap13/13_2_Graph_Classification.ipynb

@@ -4,7 +4,6 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyOMSGUFWT+YN0fwYHpMmHJM",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -99,7 +98,7 @@
         "\n",
         "# TODO -- Define node matrix\n",
         "# There will be 9 nodes and 118 possible chemical elements\n",
-        "# so we'll define a 9x118 matrix.  Each column represents one\n",
+        "# so we'll define a 118x9 matrix.  Each column represents one\n",
         "# node and is a one-hot vector (i.e. all zeros, except a single one at the\n",
         "# chemical number of the element).\n",
         "# Chemical numbers:  Hydrogen-->1, Carbon-->6,  Oxygen-->8\n",
@@ -241,4 +240,4 @@
       }
     }
   ]
-}
+}

Notebooks/Chap15/15_2_Wasserstein_Distance.ipynb

@@ -128,7 +128,7 @@
     {
       "cell_type": "code",
       "source": [
-        "draw_2D_heatmap(dist_mat,'Distance $|i-j|$', my_colormap)"
+        "draw_2D_heatmap(dist_mat,r'Distance $|i-j|$', my_colormap)"
       ],
       "metadata": {
         "id": "G0HFPBXyHT6V"
@@ -197,7 +197,7 @@
       "cell_type": "code",
       "source": [
         "TP = np.array(opt.x).reshape(10,10)\n",
-        "draw_2D_heatmap(TP,'Transport plan $\\mathbf{P}$', my_colormap)"
+        "draw_2D_heatmap(TP,r'Transport plan $\\mathbf{P}$', my_colormap)"
       ],
       "metadata": {
         "id": "nZGfkrbRV_D0"
@@ -218,7 +218,8 @@
       "cell_type": "code",
       "source": [
         "was = np.sum(TP * dist_mat)\n",
-        "print(\"Wasserstein distance = \", was)"
+        "print(\"Your Wasserstein distance = \", was)\n",
+        "print(\"Correct answer =  0.15148578811369506\")"
       ],
       "metadata": {
         "id": "yiQ_8j-Raq3c"

Notebooks/Chap17/17_2_Reparameterization_Trick.ipynb

@@ -1,18 +1,16 @@
 {
   "cells": [
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
-        "colab_type": "text",
-        "id": "view-in-github"
+        "id": "view-in-github",
+        "colab_type": "text"
       },
       "source": [
         "<a href=\"https://colab.research.google.com/github/udlbook/udlbook/blob/main/Notebooks/Chap17/17_2_Reparameterization_Trick.ipynb\" target=\"_parent\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>"
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "t9vk9Elugvmi"
@@ -40,7 +38,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "paLz5RukZP1J"
@@ -114,7 +111,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "r5Hl2QkimWx9"
@@ -139,13 +135,12 @@
         "\n",
         "fig,ax = plt.subplots()\n",
         "ax.plot(phi_vals, expected_vals,'r-')\n",
-        "ax.set_xlabel('Parameter $\\phi$')\n",
-        "ax.set_ylabel('$\\mathbb{E}_{Pr(x|\\phi)}[f[x]]$')\n",
+        "ax.set_xlabel(r'Parameter $\\phi$')\n",
+        "ax.set_ylabel(r'$\\mathbb{E}_{Pr(x|\\phi)}[f[x]]$')\n",
         "plt.show()"
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "zTCykVeWqj_O"
@@ -253,13 +248,12 @@
         "\n",
         "fig,ax = plt.subplots()\n",
         "ax.plot(phi_vals, deriv_vals,'r-')\n",
-        "ax.set_xlabel('Parameter $\\phi$')\n",
-        "ax.set_ylabel('$\\partial/\\partial\\phi\\mathbb{E}_{Pr(x|\\phi)}[f[x]]$')\n",
+        "ax.set_xlabel(r'Parameter $\\phi$')\n",
+        "ax.set_ylabel(r'$\\partial/\\partial\\phi\\mathbb{E}_{Pr(x|\\phi)}[f[x]]$')\n",
         "plt.show()"
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "ASu4yKSwAEYI"
@@ -269,7 +263,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "xoFR1wifc8-b"
@@ -366,13 +359,12 @@
         "\n",
         "fig,ax = plt.subplots()\n",
         "ax.plot(phi_vals, deriv_vals,'r-')\n",
-        "ax.set_xlabel('Parameter $\\phi$')\n",
-        "ax.set_ylabel('$\\partial/\\partial\\phi\\mathbb{E}_{Pr(x|\\phi)}[f[x]]$')\n",
+        "ax.set_xlabel(r'Parameter $\\phi$')\n",
+        "ax.set_ylabel(r'$\\partial/\\partial\\phi\\mathbb{E}_{Pr(x|\\phi)}[f[x]]$')\n",
         "plt.show()"
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "1TWBiUC7bQSw"
@@ -403,7 +395,6 @@
       ]
     },
     {
-      "attachments": {},
       "cell_type": "markdown",
       "metadata": {
         "id": "d-0tntSYdKPR"
@@ -415,9 +406,8 @@
   ],
   "metadata": {
     "colab": {
-      "authorship_tag": "ABX9TyOxO2/0DTH4n4zhC97qbagY",
-      "include_colab_link": true,
-      "provenance": []
+      "provenance": [],
+      "include_colab_link": true
     },
     "kernelspec": {
       "display_name": "Python 3",
@@ -429,4 +419,4 @@
   },
   "nbformat": 4,
   "nbformat_minor": 0
-}
+}

Notebooks/Chap20/20_1_Random_Data.ipynb

@@ -4,7 +4,7 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyPkSYbEjOcEmLt8tU6HxNuR",
+      "authorship_tag": "ABX9TyNgBRvfIlngVobKuLE6leM+",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -45,8 +45,8 @@
     {
       "cell_type": "code",
       "source": [
-        "# Run this if you're in a Colab to make a local copy of the MNIST 1D repository\n",
-        "!git clone https://github.com/greydanus/mnist1d"
+        "# Run this if you're in a Colab to install MNIST 1D repository\n",
+        "!pip install git+https://github.com/greydanus/mnist1d"
       ],
       "metadata": {
         "id": "D5yLObtZCi9J"

Notebooks/Chap20/20_2_Full_Batch_Gradient_Descent.ipynb

@@ -4,7 +4,7 @@
   "metadata": {
     "colab": {
       "provenance": [],
-      "authorship_tag": "ABX9TyOo4vm4MXcIvAzVlMCaLikH",
+      "authorship_tag": "ABX9TyO6xuszaG4nNAcWy/3juLkn",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -44,8 +44,8 @@
     {
       "cell_type": "code",
       "source": [
-        "# Run this if you're in a Colab to make a local copy of the MNIST 1D repository\n",
-        "!git clone https://github.com/greydanus/mnist1d"
+        "# Run this if you're in a Colab to install MNIST 1D repository\n",
+        "!pip install git+https://github.com/greydanus/mnist1d"
       ],
       "metadata": {
         "id": "D5yLObtZCi9J"

Notebooks/Chap20/20_2_Full_Batch_Gradient_Descent_GPU.ipynb

@@ -5,7 +5,7 @@
     "colab": {
       "provenance": [],
       "gpuType": "T4",
-      "authorship_tag": "ABX9TyMjPBfDONmjqTSyEQDP2gjY",
+      "authorship_tag": "ABX9TyOG/5A+P053/x1IfFg52z4V",
       "include_colab_link": true
     },
     "kernelspec": {
@@ -47,8 +47,8 @@
     {
       "cell_type": "code",
       "source": [
-        "# Run this if you're in a Colab to make a local copy of the MNIST 1D repository\n",
-        "!git clone https://github.com/greydanus/mnist1d"
+        "# Run this if you're in a Colab to install MNIST 1D repository\n",
+        "!pip install git+https://github.com/greydanus/mnist1d"
       ],
       "metadata": {
         "id": "D5yLObtZCi9J"

Notebooks/Chap20/20_3_Lottery_Tickets.ipynb

@@ -43,8 +43,8 @@
         "id": "Sg2i1QmhKW5d"
       },
       "source": [
-        "# Run this if you're in a Colab\n",
-        "!git clone https://github.com/greydanus/mnist1d"
+        "# Run this if you're in a Colab to install MNIST 1D repository\n",
+        "!pip install git+https://github.com/greydanus/mnist1d"
       ],
       "execution_count": null,
       "outputs": []

index_old.html

@@ -1,406 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>udlbook</title>
-    <link rel="stylesheet" href="style.css">
-</head>
-
-<body>
-<div id="head">
-    <div>
-        <h1 style="margin: 0; font-size: 36px">Understanding Deep Learning</h1>
-        by Simon J.D. Prince
-        <br>Published by MIT Press Dec 5th 2023.<br>
-        <ul>
-            <li>
-                <p style="font-size: larger; margin-bottom: 0">Download full PDF <a
-                        href="https://github.com/udlbook/udlbook/releases/download/v2.03/UnderstandingDeepLearning_02_26_24_C.pdf">here</a>
-                </p>2024-03-26. CC-BY-NC-ND license<br>
-                <img src="https://img.shields.io/github/downloads/udlbook/udlbook/total" alt="download stats shield">
-            </li>
-            <li> Order your copy from  <a href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/">here </a></li>
-            <li> Known errata can be found here:   <a
-            href="https://github.com/udlbook/udlbook/raw/main/UDL_Errata.pdf">PDF</a></li>
-            <li> Report new errata via <a href="https://github.com/udlbook/udlbook/issues">github</a>
-                or contact me directly at udlbookmail@gmail.com
-            <li> Follow me on <a href="https://twitter.com/SimonPrinceAI">Twitter</a> or <a
-                    href="https://www.linkedin.com/in/simon-prince-615bb9165/">LinkedIn</a> for updates.
-        </ul>
-        <h2>Table of contents</h2>
-        <ul>
-            <li> Chapter 1 - Introduction
-            <li> Chapter 2 - Supervised learning
-            <li> Chapter 3 - Shallow neural networks
-            <li> Chapter 4 - Deep neural networks
-            <li> Chapter 5 - Loss functions
-            <li> Chapter 6 - Training models
-            <li> Chapter 7 - Gradients and initialization
-            <li> Chapter 8 - Measuring performance
-            <li> Chapter 9 - Regularization
-            <li> Chapter 10 - Convolutional networks
-            <li> Chapter 11 - Residual networks
-            <li> Chapter 12 - Transformers
-            <li> Chapter 13 - Graph neural networks
-            <li> Chapter 14 - Unsupervised learning
-            <li> Chapter 15 - Generative adversarial networks
-            <li> Chapter 16 - Normalizing flows
-            <li> Chapter 17 - Variational autoencoders
-            <li> Chapter 18 - Diffusion models
-            <li> Chapter 19 - Deep reinforcement learning
-            <li> Chapter 20 - Why does deep learning work?
-            <li> Chapter 21 - Deep learning and ethics
-        </ul>
-    </div>
-    <div id="cover">
-        <img src="https://raw.githubusercontent.com/udlbook/udlbook/main/UDLCoverSmall.jpg"
-             alt="front cover">
-    </div>
-</div>
-<div id="body">
-    <h2>Resources for instructors </h2>
-    <p>Instructor answer booklet available with proof of credentials via <a
-            href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning"> MIT Press</a>.</p>
-    <p>Request an exam/desk copy via <a href="https://mitpress.ublish.com/request?cri=15055">MIT Press</a>.</p>
-    <p>Figures in PDF (vector) / SVG (vector) / Powerpoint (images):
-    <ul>
-        <li> Chapter 1 - Introduction: <a href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap1PDF.zip">PDF
-            Figures</a> / <a href="https://drive.google.com/uc?export=download&id=1udnl5pUOAc8DcAQ7HQwyzP9pwL95ynnv">
-            SVG
-            Figures</a> / <a
-                href="https://docs.google.com/presentation/d/1IjTqIUvWCJc71b5vEJYte-Dwujcp7rvG/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-            Figures</a>
-        <li> Chapter 2 - Supervised learning: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap2PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1VSxcU5y1qNFlmd3Lb3uOWyzILuOj1Dla"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1Br7R01ROtRWPlNhC_KOommeHAWMBpWtz/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 3 - Shallow neural networks: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap3PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=19kZFWlXhzN82Zx02ByMmSZOO4T41fmqI"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1e9M3jB5I9qZ4dCBY90Q3Hwft_i068QVQ/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 4 - Deep neural networks: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap4PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1ojr0ebsOhzvS04ItAflX2cVmYqHQHZUa"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1LTSsmY4mMrJbqXVvoTOCkQwHrRKoYnJj/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 5 - Loss functions: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap5PDF.zip">PDF
-            Figures</a> / <a href="https://drive.google.com/uc?export=download&id=17MJO7fiMpFZVqKeqXTbQ36AMpmR4GizZ">
-            SVG
-            Figures</a> / <a
-                href="https://docs.google.com/presentation/d/1gcpC_3z9oRp87eMkoco-kdLD-MM54Puk/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-            Figures</a>
-        <li> Chapter 6 - Training models: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap6PDF.zip">PDF
-            Figures</a> / <a href="https://drive.google.com/uc?export=download&id=1VPdhFRnCr9_idTrX0UdHKGAw2shUuwhK">
-            SVG
-            Figures</a> / <a
-                href="https://docs.google.com/presentation/d/1AKoeggAFBl9yLC7X5tushAGzCCxmB7EY/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-            Figures</a>
-        <li> Chapter 7 - Gradients and initialization: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap7PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1TTl4gvrTvNbegnml4CoGoKOOd6O8-PGs"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/11zhB6PI-Dp6Ogmr4IcI6fbvbqNqLyYcz/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 8 - Measuring performance: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap8PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=19eQOnygd_l0DzgtJxXuYnWa4z7QKJrJx"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1SHRmJscDLUuQrG7tmysnScb3ZUAqVMZo/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 9 - Regularization: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap9PDF.zip">PDF
-            Figures</a> / <a href="https://drive.google.com/uc?export=download&id=1LprgnUGL7xAM9-jlGZC9LhMPeefjY0r0">
-            SVG
-            Figures</a> / <a
-                href="https://docs.google.com/presentation/d/1VwIfvjpdfTny6sEfu4ZETwCnw6m8Eg-5/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-            Figures</a>
-        <li> Chapter 10 - Convolutional networks: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap10PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1-Wb3VzaSvVeRzoUzJbI2JjZE0uwqupM9"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1MtfKBC4Y9hWwGqeP6DVwUNbi1j5ncQCg/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 11 - Residual networks: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap11PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1Mr58jzEVseUAfNYbGWCQyDtEDwvfHRi1"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1saY8Faz0KTKAAifUrbkQdLA2qkyEjOPI/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 12 - Transformers: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap12PDF.zip">PDF
-            Figures</a> / <a href="https://drive.google.com/uc?export=download&id=1txzOVNf8-jH4UfJ6SLnrtOfPd1Q3ebzd">
-            SVG
-            Figures</a> / <a
-                href="https://docs.google.com/presentation/d/1GVNvYWa0WJA6oKg89qZre-UZEhABfm0l/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-            Figures</a>
-        <li> Chapter 13 - Graph neural networks: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap13PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1lQIV6nRp6LVfaMgpGFhuwEXG-lTEaAwe"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1YwF3U82c1mQ74c1WqHVTzLZ0j7GgKaWP/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 14 - Unsupervised learning: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap14PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1aMbI6iCuUvOywqk5pBOmppJu1L1anqsM"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1A-lBGv3NHl4L32NvfFgy1EKeSwY-0UeB/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
-                PowerPoint Figures</a>
-        <li> Chapter 15 - Generative adversarial networks: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap15PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1EErnlZCOlXc3HK7m83T2Jh_0NzIUHvtL"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/10Ernk41ShOTf4IYkMD-l4dJfKATkXH4w/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 16 - Normalizing flows: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap16PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1B9bxtmdugwtg-b7Y4AdQKAIEVWxjx8l3"> SVG Figures</a>                                                                                                     
-            /
-            <a href="https://docs.google.com/presentation/d/1nLLzqb9pdfF_h6i1HUDSyp7kSMIkSUUA/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 17 - Variational autoencoders: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap17PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1SNtNIY7khlHQYMtaOH-FosSH3kWwL4b7"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1lQE4Bu7-LgvV2VlJOt_4dQT-kusYl7Vo/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Chapter 18 - Diffusion models: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap18PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1A-pIGl4PxjVMYOKAUG3aT4a8wD3G-q_r"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1x_ufIBtVPzWUvRieKMkpw5SdRjXWwdfR/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
-            PowerPoint Figures</a>
-        <li> Chapter 19 - Deep reinforcement learning: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap19PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1a5WUoF7jeSgwC_PVdckJi1Gny46fCqh0"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1TnYmVbFNhmMFetbjyfXGmkxp1EHauMqr/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
-                PowerPoint Figures </a>
-        <li> Chapter 20 - Why does deep learning work?: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap20PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1M2d0DHEgddAQoIedKSDTTt7m1ZdmBLQ3"> SVG Figures</a>
-            /
-            <a href="https://docs.google.com/presentation/d/1coxF4IsrCzDTLrNjRagHvqB_FBy10miA/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
-                PowerPoint Figures</a>
-        <li> Chapter 21 - Deep learning and ethics: <a
-                href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap21PDF.zip">PDF Figures</a> / <a
-                href="https://drive.google.com/uc?export=download&id=1jixmFfwmZkW_UVYzcxmDcMsdFFtnZ0bU"> SVG Figures</a>/
-            <a
-                    href="https://docs.google.com/presentation/d/1EtfzanZYILvi9_-Idm28zD94I_6OrN9R/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PowerPoint
-                Figures</a>
-        <li> Appendices - <a href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLAppendixPDF.zip">PDF
-            Figures</a> / <a href="https://drive.google.com/uc?export=download&id=1k2j7hMN40ISPSg9skFYWFL3oZT7r8v-l">
-            SVG
-            Figures</a> / <a
-                href="https://docs.google.com/presentation/d/1_2cJHRnsoQQHst0rwZssv-XH4o5SEHks/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">Powerpoint
-            Figures</a>
-    </ul>
-
-    Instructions for editing figures / equations can be found <a
-        href="https://drive.google.com/file/d/1T_MXXVR4AfyMnlEFI-UVDh--FXI5deAp/view?usp=sharing">here</a>.
-
-    <p> My slides for 20 lecture undergraduate deep learning course:</p>
-    <ul>
-        <li><a href="https://drive.google.com/uc?export=download&id=17RHb11BrydOvxSFNbRIomE1QKLVI087m">1. Introduction</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=1491zkHULC7gDfqlV6cqUxyVYXZ-de-Ub">2. Supervised Learning</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=1XkP1c9EhOBowla1rT1nnsDGMf2rZvrt7">3. Shallow Neural Networks</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=1e2ejfZbbfMKLBv0v-tvBWBdI8gO3SSS1">4. Deep Neural Networks</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=1fxQ_a1Q3eFPZ4kPqKbak6_emJK-JfnRH">5. Loss Functions</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=17QQ5ZzXBtR_uCNCUU1gPRWWRUeZN9exW">6. Fitting Models</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=1hC8JUCOaFWiw3KGn0rm7nW6mEq242QDK">7. Computing Gradients</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=1tSjCeAVg0JCeBcPgDJDbi7Gg43Qkh9_d">7b. Initialization</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=1RVZW3KjEs0vNSGx3B2fdizddlr6I0wLl">8. Performance</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=1LTicIKPRPbZRkkg6qOr1DSuOB72axood">9. Regularization</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=1bGVuwAwrofzZdfvj267elIzkYMIvYFj0">10. Convolutional Networks</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=14w31QqWRDix1GdUE-na0_E0kGKBhtKzs">11. Image Generation</a></li>
-        <li><a href="https://drive.google.com/uc?export=download&id=1af6bTTjAbhDYfrDhboW7Fuv52Gk9ygKr">12. Transformers and LLMs</a></li>
-    </ul>
-
-    <h2>Resources for students</h2>
-
-    <p>Answers to selected questions: <a
-            href="https://github.com/udlbook/udlbook/raw/main/UDL_Answer_Booklet_Students.pdf">PDF</a>
-    </p>
-    <p>Python notebooks: (Early ones more thoroughly tested than later ones!)</p>
-
-    <ul>
-        <li> Notebook 1.1 - Background mathematics: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap01/1_1_BackgroundMathematics.ipynb">ipynb/colab</a>
-        </li>
-        <li> Notebook 2.1 - Supervised learning: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap02/2_1_Supervised_Learning.ipynb">ipynb/colab</a>
-        </li>
-        <li> Notebook 3.1 - Shallow networks I: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_1_Shallow_Networks_I.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 3.2 - Shallow networks II: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_2_Shallow_Networks_II.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 3.3 - Shallow network regions: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_3_Shallow_Network_Regions.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 3.4 - Activation functions: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_4_Activation_Functions.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 4.1 - Composing networks: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap04/4_1_Composing_Networks.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 4.2 - Clipping functions: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap04/4_2_Clipping_functions.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 4.3 - Deep networks: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap04/4_3_Deep_Networks.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 5.1 - Least squares loss: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap05/5_1_Least_Squares_Loss.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 5.2 - Binary cross-entropy loss: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap05/5_2_Binary_Cross_Entropy_Loss.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 5.3 - Multiclass cross-entropy loss: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap05/5_3_Multiclass_Cross_entropy_Loss.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 6.1 - Line search: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_1_Line_Search.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 6.2 - Gradient descent: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_2_Gradient_Descent.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 6.3 - Stochastic gradient descent: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_3_Stochastic_Gradient_Descent.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 6.4 - Momentum: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_4_Momentum.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 6.5 - Adam: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_5_Adam.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 7.1 - Backpropagation in toy model: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap07/7_1_Backpropagation_in_Toy_Model.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 7.2 - Backpropagation: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap07/7_2_Backpropagation.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 7.3 - Initialization: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap07/7_3_Initialization.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 8.1 - MNIST-1D performance: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_1_MNIST_1D_Performance.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 8.2 - Bias-variance trade-off: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_2_Bias_Variance_Trade_Off.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 8.3 - Double descent: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_3_Double_Descent.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 8.4 - High-dimensional spaces: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_4_High_Dimensional_Spaces.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 9.1 - L2 regularization: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_1_L2_Regularization.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 9.2 - Implicit regularization: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_2_Implicit_Regularization.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 9.3 - Ensembling: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_3_Ensembling.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 9.4 - Bayesian approach: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_4_Bayesian_Approach.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 9.5 - Augmentation <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_5_Augmentation.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 10.1 - 1D convolution: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_1_1D_Convolution.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 10.2 - Convolution for MNIST-1D: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_2_Convolution_for_MNIST_1D.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 10.3 - 2D convolution: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_3_2D_Convolution.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 10.4 - Downsampling & upsampling: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_4_Downsampling_and_Upsampling.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 10.5 - Convolution for MNIST: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_5_Convolution_For_MNIST.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 11.1 - Shattered gradients: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap11/11_1_Shattered_Gradients.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 11.2 - Residual networks: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap11/11_2_Residual_Networks.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 11.3 - Batch normalization: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap11/11_3_Batch_Normalization.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 12.1 - Self-attention: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_1_Self_Attention.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 12.2 - Multi-head self-attention: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_2_Multihead_Self_Attention.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 12.3 - Tokenization: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_3_Tokenization.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 12.4 - Decoding strategies: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_4_Decoding_Strategies.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 13.1 - Encoding graphs: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_1_Graph_Representation.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 13.2 - Graph classification : <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_2_Graph_Classification.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 13.3 - Neighborhood sampling: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_3_Neighborhood_Sampling.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 13.4 - Graph attention: <a
-                href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_4_Graph_Attention_Networks.ipynb">ipynb/colab </a>
-        </li>
-        <li> Notebook 15.1 - GAN toy example: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap15/15_1_GAN_Toy_Example.ipynb">ipynb/colab </a></li>
-        <li> Notebook 15.2 - Wasserstein distance: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap15/15_2_Wasserstein_Distance.ipynb">ipynb/colab </a></li>
-        <li> Notebook 16.1 - 1D normalizing flows: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap16/16_1_1D_Normalizing_Flows.ipynb">ipynb/colab </a></li>
-        <li> Notebook 16.2 - Autoregressive flows: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap16/16_2_Autoregressive_Flows.ipynb">ipynb/colab </a></li>
-        <li> Notebook 16.3 - Contraction mappings: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap16/16_3_Contraction_Mappings.ipynb">ipynb/colab </a></li>
-        <li> Notebook 17.1 - Latent variable models: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap17/17_1_Latent_Variable_Models.ipynb">ipynb/colab </a></li>
-        <li> Notebook 17.2 - Reparameterization trick: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap17/17_2_Reparameterization_Trick.ipynb">ipynb/colab </a></li>
-        <li> Notebook 17.3 - Importance sampling: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap17/17_3_Importance_Sampling.ipynb">ipynb/colab </a></li>
-        <li> Notebook 18.1 - Diffusion encoder: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_1_Diffusion_Encoder.ipynb">ipynb/colab </a></li>
-        <li> Notebook 18.2 - 1D diffusion model: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_2_1D_Diffusion_Model.ipynb">ipynb/colab </a></li>
-        <li> Notebook 18.3 - Reparameterized model: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_3_Reparameterized_Model.ipynb">ipynb/colab </a></li>
-        <li> Notebook 18.4 - Families of diffusion models: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_4_Families_of_Diffusion_Models.ipynb">ipynb/colab </a></li>
-        <li> Notebook 19.1 - Markov decision processes: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_1_Markov_Decision_Processes.ipynb">ipynb/colab </a></li>
-        <li> Notebook 19.2 - Dynamic programming: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_2_Dynamic_Programming.ipynb">ipynb/colab </a></li>
-        <li> Notebook 19.3 - Monte-Carlo methods: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_3_Monte_Carlo_Methods.ipynb">ipynb/colab </a></li>
-        <li> Notebook 19.4 - Temporal difference methods: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_4_Temporal_Difference_Methods.ipynb">ipynb/colab </a></li>
-        <li> Notebook 19.5 - Control variates: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_5_Control_Variates.ipynb">ipynb/colab </a></li>
-        <li> Notebook 20.1 - Random data: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_1_Random_Data.ipynb">ipynb/colab </a></li>
-        <li> Notebook 20.2 - Full-batch gradient descent: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_2_Full_Batch_Gradient_Descent.ipynb">ipynb/colab </a></li>
-        <li> Notebook 20.3 - Lottery tickets: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_3_Lottery_Tickets.ipynb">ipynb/colab </a></li>
-        <li> Notebook 20.4 - Adversarial attacks: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_4_Adversarial_Attacks.ipynb">ipynb/colab </a></li>
-        <li> Notebook 21.1 - Bias mitigation: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap21/21_1_Bias_Mitigation.ipynb">ipynb/colab </a></li>
-        <li> Notebook 21.2 - Explainability: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap21/21_2_Explainability.ipynb">ipynb/colab </a></li>
-    </ul>
-
-
-    <br>
-    <h2>Citation</h2>
-    <pre><code>
- @book{prince2023understanding,
- author = "Simon J.D. Prince",
- title = "Understanding Deep Learning",
- publisher = "MIT Press",
- year = 2023,
- url = "http://udlbook.com"
-}
-    </code></pre>
-</div>
-</body>

package.json

@@ -2,7 +2,7 @@
   "name": "react-website-smooth-scroll",
   "version": "0.1.0",
   "private": true,
-  "homepage": "https://udlbook.github.io/udlbook/",
+  "homepage": "https://udlbook.github.io/udlbook",
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^6.5.1",
     "@testing-library/jest-dom": "^5.15.1",

public/index.html

@@ -27,7 +27,7 @@
     <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 <link href="https://fonts.googleapis.com/css2?family=Encode+Sans+Expanded:wght@400;700&display=swap" rel="stylesheet">
-    <title>React App</title>
+    <title>Understanding Deep Learning</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

src/App.js

@@ -9,7 +9,7 @@ function App() {
   return (
     <Router>
       <Routes>
-        <Route exact path="/" element ={<Home/>} />      
+        <Route exact path="/udlbook/" element ={<Home/>} />      
       </Routes>
       
     </Router>

src/components/Footer/FooterElements.js

@@ -105,6 +105,9 @@ export const SocialLogo = styled(Link)`
     align-items: center;
     margin-bottom: 16px;
     font-weight: bold;
+    @media screen and (max-width: 768px) {
+        font-size: 20px;
+    }
 `
 
 export const WebsiteRights = styled.small` 

src/components/Footer/index.js

@@ -16,7 +16,7 @@ const Footer = () => {
                 <FooterWrap>
                     <SocialMedia>
                         <SocialMediaWrap>
-                            <SocialLogo to='/' onClick={toggleHome}>
+                            <SocialLogo to='/udlbook/' onClick={toggleHome}>
                                 Understanding Deep Learning
                             </SocialLogo>
                             <WebsiteRights>©{new Date().getFullYear()} Simon J.D. Prince</WebsiteRights>

src/components/HeroSection/HeroElements.js

@@ -84,32 +84,29 @@ export const HeroNewsItem = styled.div`
     margin-bottom: 16px;
     display: flex;  
     justify-content: start;
+
 `
 export const HeroNewsItemDate = styled.div`
     width: 20%;
-    font-size: 16px ; 
     margin-right: 20px ; 
-
     @media screen and (max-width: 768px) {
-        font-size: 24px;
+        font-size: 12px;
     }
-
     @media screen and (max-width: 480px) {
-        font-size: 18px;
+        font-size: 12px;
     }
 `
 
 export const HeroNewsItemContent = styled.div`
     width: 80%; 
     color: #000000;
-    font-size: 16px ; 
 
     @media screen and (max-width: 768px) {
-        font-size: 24px;
+        font-size: 12px;
     }
 
     @media screen and (max-width: 480px) {
-        font-size: 18px;
+        font-size: 12px;
     }
 `
 
@@ -167,20 +164,89 @@ export const HeroDownloadsImg = styled.img`
 export const HeroLink = styled.a`
   color: #fff;
   text-decoration: none;
-  padding: 0.1rem 0rem;
-  height: 100%;
+  padding: 0.6rem 0rem 0rem 0rem;
   cursor: pointer;
+  position:relative ; 
 
-  &:hover {
-    filter: brightness(0.85);
-  }
+  &:before{
+    position: absolute;
+    margin: 0 auto;
+    top: 100%;
+    left: 0;
+    width: 100%;
+    height: 2px;
+    background-color: #fff;
+    content: '';
+    opacity: .3;
+    -webkit-transform: scaleX(1);
+    transition-property: opacity, -webkit-transform;
+    transition-duration: .3s;
+}
 
-  &.active {
-    color: #000
-    border-bottom: 3px solid #01bf71;
+    &:hover:before {
+    opacity: 1;
+    -webkit-transform: scaleX(1.05);
   }
 `;
 
+//   color: #fff;
+//   text-decoration: none;
+//   padding: 0.1rem 0rem;
+//   height: 100%;
+//   cursor: pointer;
+//   position:relative ; 
+
+//   &:before{
+//     position: absolute;
+//     margin: 0 auto;
+//     top: 100%;
+//     left: 0;
+//     width: 100%;
+//     height: 2px;
+//     background-color: #000;
+//     content: '';
+//     opacity: .3;
+//     -webkit-transform: scaleX(1);
+//     transition-property: opacity, -webkit-transform;
+//     transition-duration: .3s;
+// }
+
+//     &:hover:before {
+//     opacity: 1;
+//     -webkit-transform: scaleX(1.05);
+//   }
+// `;
+
+export const UDLLink = styled.a`
+    text-decoration: none;
+    color: #000;
+    font-weight: 300;
+    margin: 0 2px;
+    position: relative;
+
+    &:before{
+        position: absolute;
+        margin: 0 auto;
+        top: 100%;
+        left: 0;
+        width: 100%;
+        height: 2px;
+        background-color: #000;
+        content: '';
+        opacity: .3;
+        -webkit-transform: scaleX(1);
+        transition-property: opacity, -webkit-transform;
+        transition-duration: .3s;
+    }
+
+    &:hover:before {
+        opacity: 1;
+        -webkit-transform: scaleX(1.05);
+      }
+`
+
+
+
 
 export const HeroNewsTitle = styled.div` 
     margin-left: 0px;
@@ -233,10 +299,6 @@ export const HeroCitationBlock = styled.div`
 
 export const HeroFollowBlock = styled.div`
 @media screen and (max-width: 768px) {
-    font-size: 24px;
+    font-size: 14px;
 }
-
-@media screen and (max-width: 480px) {
-    font-size: 18px;
-}
-`
+`

src/components/HeroSection/index.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { HeroContainer, HeroNewsBlock, HeroCitationBlock, HeroCitationTitle, HeroFollowBlock, HeroDownloadsImg, HeroLink, HeroRow, HeroColumn1, HeroColumn2, HeroContent, Img, HeroImgWrap, HeroNewsTitle, HeroNewsItem, HeroNewsItemDate, HeroNewsItemContent} from './HeroElements'
+import { HeroContainer, HeroNewsBlock, HeroCitationBlock, HeroCitationTitle, HeroFollowBlock, HeroDownloadsImg, HeroLink, HeroRow, HeroColumn1, HeroColumn2, HeroContent, Img, HeroImgWrap, HeroNewsTitle, HeroNewsItem, HeroNewsItemDate, HeroNewsItemContent, UDLLink} from './HeroElements'
 import img from '../../images/F23.prince.learning.turquoise.jpg'
 
 const HeroSection = () => {
@@ -27,42 +27,41 @@ const HeroSection = () => {
                                 <HeroNewsItemContent> Book now available again.</HeroNewsItemContent>
                             </HeroNewsItem>
 
-
+                            <HeroNewsItem>
+                                <HeroNewsItemDate>02/21/24</HeroNewsItemDate>
+                                <HeroNewsItemContent>New blog about the <UDLLink href="https://www.borealisai.com/research-blogs/the-neural-tangent-kernel/">Neural Tangent Kernel.</UDLLink></HeroNewsItemContent>
+                            </HeroNewsItem>
                             <HeroNewsItem>
                                 <HeroNewsItemDate>02/15/24</HeroNewsItemDate>
                                 <HeroNewsItemContent> First printing of book has sold out in most places. Second printing available mid-March.</HeroNewsItemContent>
                             </HeroNewsItem>
-    
+
 
                             <HeroNewsItem>
                                 <HeroNewsItemDate>01/29/24</HeroNewsItemDate>
-                                <HeroNewsItemContent> New blog about <a href="https://www.borealisai.com/research-blogs/gradient-flow/"> gradient flow </a> published.</HeroNewsItemContent>
+                                <HeroNewsItemContent> New blog about <UDLLink href="https://www.borealisai.com/research-blogs/gradient-flow/"> gradient flow </UDLLink> published.</HeroNewsItemContent>
                             </HeroNewsItem>
 
                             <HeroNewsItem>
                                 <HeroNewsItemDate>12/26/23</HeroNewsItemDate>
-                                <HeroNewsItemContent> Machine Learning Street Talk  <a href="https://www.youtube.com/watch?v=sJXn4Cl4oww"> podcast </a>  discussing book.</HeroNewsItemContent>
+                                <HeroNewsItemContent> Machine Learning Street Talk  <UDLLink href="https://www.youtube.com/watch?v=sJXn4Cl4oww"> podcast </UDLLink>  discussing book.</HeroNewsItemContent>
                             </HeroNewsItem>
 
                             <HeroNewsItem>
                                 <HeroNewsItemDate>12/19/23</HeroNewsItemDate>
-                                <HeroNewsItemContent>Deeper Insights <a href="https://podcasts.apple.com/us/podcast/understanding-deep-learning-with-simon-prince/id1669436318?i=1000638269385">podcast</a> discussing book.</HeroNewsItemContent>
+                                <HeroNewsItemContent>Deeper Insights <UDLLink href="https://podcasts.apple.com/us/podcast/understanding-deep-learning-with-simon-prince/id1669436318?i=1000638269385">podcast</UDLLink> discussing book.</HeroNewsItemContent>
                             </HeroNewsItem>
 
                             <HeroNewsItem>
                                 <HeroNewsItemDate>12/06/23</HeroNewsItemDate>
-                                <HeroNewsItemContent> I did an <a href="https://www.borealisai.com/news/understanding-deep-learning/">interview</a> discussing the book with Borealis AI.</HeroNewsItemContent>
+                                <HeroNewsItemContent> I did an <UDLLink href="https://www.borealisai.com/news/understanding-deep-learning/">interview</UDLLink> discussing the book with Borealis AI.</HeroNewsItemContent>
                             </HeroNewsItem>
 
                             <HeroNewsItem>
                                 <HeroNewsItemDate>12/05/23</HeroNewsItemDate>
-                                <HeroNewsItemContent> Book released by <a href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/">The MIT Press</a>.</HeroNewsItemContent>
+                                <HeroNewsItemContent> Book released by <UDLLink href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/">The MIT Press</UDLLink>.</HeroNewsItemContent>
                             </HeroNewsItem>
                         </HeroNewsBlock>
-                        <HeroFollowBlock>
-                            Follow me on <a href="https://twitter.com/SimonPrinceAI">Twitter</a> or <a
-                            href="https://www.linkedin.com/in/simon-prince-615bb9165/">LinkedIn</a> for updates.
-                        </HeroFollowBlock>
                         <HeroCitationTitle>CITATION:</HeroCitationTitle>
                         <HeroCitationBlock>
                             <pre>
@@ -71,16 +70,20 @@ const HeroSection = () => {
                                 </code>
                             </pre>
                         </HeroCitationBlock>
+                        <HeroFollowBlock>
+                            Follow me on <UDLLink href="https://twitter.com/SimonPrinceAI">Twitter</UDLLink> or <UDLLink
+                            href="https://www.linkedin.com/in/simon-prince-615bb9165/">LinkedIn</UDLLink> for updates.
+                        </HeroFollowBlock>
                     </HeroColumn1>
                     <HeroColumn2>
                         <HeroImgWrap>
                             <Img src={img} alt="book cover"/>
                         </HeroImgWrap>
-                        <HeroLink href="https://github.com/udlbook/udlbook/releases/download/v2.03/UnderstandingDeepLearning_02_26_24_C.pdf">Download full pdf</HeroLink>
+                        <HeroLink href="https://github.com/udlbook/udlbook/releases/download/v2.05/UnderstandingDeepLearning_04_18_24_C.pdf">Download full pdf (18 Apr 2024)</HeroLink>
                         <HeroDownloadsImg src="https://img.shields.io/github/downloads/udlbook/udlbook/total" alt="download stats shield"/>
                         <HeroLink href="https://mitpress.mit.edu/9780262048644/understanding-deep-learning/">Buy the book</HeroLink>
                         <HeroLink href="https://github.com/udlbook/udlbook/raw/main/UDL_Answer_Booklet_Students.pdf">Answers to selected questions</HeroLink>
-                        <HeroLink href="https://github.com/udlbook/udlbook/raw/main/UDL_Errata.pdf">Find/Report Errata</HeroLink>
+                        <HeroLink href="https://github.com/udlbook/udlbook/raw/main/UDL_Errata.pdf">Errata</HeroLink>
                     </HeroColumn2>
                 </HeroRow>
             </HeroContent>

src/components/Instructors/InstructorsElements.js

@@ -127,4 +127,39 @@ export const InstructorsContent = styled.div`
     flex-direction: column;
     align-items: left ; 
     list-style-position: inside;
+    @media screen and (max-width: 1050px) {
+        font-size: 12px;
+    }
+
+    @media screen and (max-width: 768px) {
+        font-size: 10px;
+    }
+`
+
+export const InstructorsLink = styled.a`
+    text-decoration: none;
+    color: #555;
+    font-weight: 300;
+    margin: 0 2px;
+    position: relative;
+
+    &:before{
+        position: absolute;
+        margin: 0 auto;
+        top: 100%;
+        left: 0;
+        width: 100%;
+        height: 2px;
+        background-color: #555;
+        content: '';
+        opacity: .3;
+        -webkit-transform: scaleX(1);
+        transition-property: opacity, -webkit-transform;
+        transition-duration: .3s;
+    }
+
+    &:hover:before {
+        opacity: 1;
+        -webkit-transform: scaleX(1.05);
+      }
 `

src/components/Instructors/index.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { ImgWrap, Img, InstructorsContainer, InstructorsContent, InstructorsRow2, InstructorsWrapper, InstructorsRow, Column1, Column2, TextWrapper, TopLine, Heading, Subtitle} from './InstructorsElements'
+import { ImgWrap, Img, InstructorsLink, InstructorsContainer, InstructorsContent, InstructorsRow2, InstructorsWrapper, InstructorsRow, Column1, Column2, TextWrapper, TopLine, Heading, Subtitle} from './InstructorsElements'
 
 // export const homeObjOne = {
 //     id: 'about',
@@ -45,7 +45,7 @@ const InstructorsSection = () => {
                     <InstructorsRow2>
                         <Column1>
                             <TopLine>Register</TopLine>
-                            <a href="https://mitpress.ublish.com/request?cri=15055">Register</a> with MIT Press for answer booklet.
+                            <InstructorsLink href="https://mitpress.ublish.com/request?cri=15055">Register</InstructorsLink> with MIT Press for answer booklet.
                             <InstructorsContent>
 
                             </InstructorsContent>
@@ -56,19 +56,19 @@ const InstructorsSection = () => {
                             </InstructorsContent>
                             <InstructorsContent>
                                 <ol>
-                                    <li>Introduction <a href="https://drive.google.com/uc?export=download&id=17RHb11BrydOvxSFNbRIomE1QKLVI087m">PPTX</a></li>
-                                    <li>Supervised Learning <a href="https://drive.google.com/uc?export=download&id=1491zkHULC7gDfqlV6cqUxyVYXZ-de-Ub">PPTX</a></li>
-                                    <li>Shallow Neural Networks <a href="https://drive.google.com/uc?export=download&id=1XkP1c9EhOBowla1rT1nnsDGMf2rZvrt7">PPTX</a></li>
-                                    <li>Deep Neural Networks <a href="https://drive.google.com/uc?export=download&id=1e2ejfZbbfMKLBv0v-tvBWBdI8gO3SSS1">PPTX</a></li>
-                                    <li>Loss Functions <a href="https://drive.google.com/uc?export=download&id=1fxQ_a1Q3eFPZ4kPqKbak6_emJK-JfnRH">PPTX</a></li>
-                                    <li>Fitting Models <a href="https://drive.google.com/uc?export=download&id=17QQ5ZzXBtR_uCNCUU1gPRWWRUeZN9exW">PPTX</a></li>
-                                    <li>Computing Gradients <a href="https://drive.google.com/uc?export=download&id=1hC8JUCOaFWiw3KGn0rm7nW6mEq242QDK">PPTX</a></li>
-                                    <li>Initialization <a href="https://drive.google.com/uc?export=download&id=1tSjCeAVg0JCeBcPgDJDbi7Gg43Qkh9_d">PPTX</a></li>
-                                    <li>Performance <a href="https://drive.google.com/uc?export=download&id=1RVZW3KjEs0vNSGx3B2fdizddlr6I0wLl">PPTX</a></li>
-                                    <li>Regularization <a href="https://drive.google.com/uc?export=download&id=1LTicIKPRPbZRkkg6qOr1DSuOB72axood">PPTX</a></li>
-                                    <li>Convolutional Networks <a href="https://drive.google.com/uc?export=download&id=1bGVuwAwrofzZdfvj267elIzkYMIvYFj0">PPTX</a></li>
-                                    <li>Image Generation <a href="https://drive.google.com/uc?export=download&id=14w31QqWRDix1GdUE-na0_E0kGKBhtKzs">PPTX</a></li>
-                                    <li>Transformers and LLMs <a href="https://drive.google.com/uc?export=download&id=1af6bTTjAbhDYfrDhboW7Fuv52Gk9ygKr">PPTX</a></li>
+                                    <li>Introduction <InstructorsLink href="https://drive.google.com/uc?export=download&id=17RHb11BrydOvxSFNbRIomE1QKLVI087m">PPTX</InstructorsLink></li>
+                                    <li>Supervised Learning <InstructorsLink href="https://drive.google.com/uc?export=download&id=1491zkHULC7gDfqlV6cqUxyVYXZ-de-Ub">PPTX</InstructorsLink></li>
+                                    <li>Shallow Neural Networks <InstructorsLink href="https://drive.google.com/uc?export=download&id=1XkP1c9EhOBowla1rT1nnsDGMf2rZvrt7">PPTX</InstructorsLink></li>
+                                    <li>Deep Neural Networks <InstructorsLink href="https://drive.google.com/uc?export=download&id=1e2ejfZbbfMKLBv0v-tvBWBdI8gO3SSS1">PPTX</InstructorsLink></li>
+                                    <li>Loss Functions <InstructorsLink href="https://drive.google.com/uc?export=download&id=1fxQ_a1Q3eFPZ4kPqKbak6_emJK-JfnRH">PPTX</InstructorsLink></li>
+                                    <li>Fitting Models <InstructorsLink href="https://drive.google.com/uc?export=download&id=17QQ5ZzXBtR_uCNCUU1gPRWWRUeZN9exW">PPTX</InstructorsLink></li>
+                                    <li>Computing Gradients <InstructorsLink href="https://drive.google.com/uc?export=download&id=1hC8JUCOaFWiw3KGn0rm7nW6mEq242QDK">PPTX</InstructorsLink></li>
+                                    <li>Initialization <InstructorsLink href="https://drive.google.com/uc?export=download&id=1tSjCeAVg0JCeBcPgDJDbi7Gg43Qkh9_d">PPTX</InstructorsLink></li>
+                                    <li>Performance <InstructorsLink href="https://drive.google.com/uc?export=download&id=1RVZW3KjEs0vNSGx3B2fdizddlr6I0wLl">PPTX</InstructorsLink></li>
+                                    <li>Regularization <InstructorsLink href="https://drive.google.com/uc?export=download&id=1LTicIKPRPbZRkkg6qOr1DSuOB72axood">PPTX</InstructorsLink></li>
+                                    <li>Convolutional Networks <InstructorsLink href="https://drive.google.com/uc?export=download&id=1bGVuwAwrofzZdfvj267elIzkYMIvYFj0">PPTX</InstructorsLink></li>
+                                    <li>Image Generation <InstructorsLink href="https://drive.google.com/uc?export=download&id=14w31QqWRDix1GdUE-na0_E0kGKBhtKzs">PPTX</InstructorsLink></li>
+                                    <li>Transformers and LLMs <InstructorsLink href="https://drive.google.com/uc?export=download&id=1af6bTTjAbhDYfrDhboW7Fuv52Gk9ygKr">PPTX</InstructorsLink></li>
                                 </ol>
                              </InstructorsContent>
                         </Column1>
@@ -76,92 +76,92 @@ const InstructorsSection = () => {
                             <TopLine>Figures</TopLine>
                             <InstructorsContent>
                             <ol>
-                                <li> Introduction: <a href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap1PDF.zip">PDF</a> / <a href="https://drive.google.com/uc?export=download&id=1udnl5pUOAc8DcAQ7HQwyzP9pwL95ynnv"> SVG</a> / <a href="https://docs.google.com/presentation/d/1IjTqIUvWCJc71b5vEJYte-Dwujcp7rvG/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX </a></li>
+                                <li> Introduction: <InstructorsLink href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap1PDF.zip">PDF</InstructorsLink> / <InstructorsLink href="https://drive.google.com/uc?export=download&id=1udnl5pUOAc8DcAQ7HQwyzP9pwL95ynnv"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1IjTqIUvWCJc71b5vEJYte-Dwujcp7rvG/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX </InstructorsLink></li>
 
-                            <li> Supervised learning: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap2PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1VSxcU5y1qNFlmd3Lb3uOWyzILuOj1Dla"> SVG</a> / <a href="https://docs.google.com/presentation/d/1Br7R01ROtRWPlNhC_KOommeHAWMBpWtz/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Shallow neural networks: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap3PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=19kZFWlXhzN82Zx02ByMmSZOO4T41fmqI"> SVG</a> / <a href="https://docs.google.com/presentation/d/1e9M3jB5I9qZ4dCBY90Q3Hwft_i068QVQ/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Deep neural networks: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap4PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1ojr0ebsOhzvS04ItAflX2cVmYqHQHZUa"> SVG</a>
+                            <li> Supervised learning: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap2PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1VSxcU5y1qNFlmd3Lb3uOWyzILuOj1Dla"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1Br7R01ROtRWPlNhC_KOommeHAWMBpWtz/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Shallow neural networks: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap3PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=19kZFWlXhzN82Zx02ByMmSZOO4T41fmqI"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1e9M3jB5I9qZ4dCBY90Q3Hwft_i068QVQ/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Deep neural networks: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap4PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1ojr0ebsOhzvS04ItAflX2cVmYqHQHZUa"> SVG</InstructorsLink>
                                     /
-                                    <a href="https://docs.google.com/presentation/d/1LTSsmY4mMrJbqXVvoTOCkQwHrRKoYnJj/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Loss functions: <a
+                                    <InstructorsLink href="https://docs.google.com/presentation/d/1LTSsmY4mMrJbqXVvoTOCkQwHrRKoYnJj/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Loss functions: <InstructorsLink
                                         href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap5PDF.zip">PDF
-                                    </a> / <a href="https://drive.google.com/uc?export=download&id=17MJO7fiMpFZVqKeqXTbQ36AMpmR4GizZ">
+                                    </InstructorsLink> / <InstructorsLink href="https://drive.google.com/uc?export=download&id=17MJO7fiMpFZVqKeqXTbQ36AMpmR4GizZ">
                                     SVG
-                                    </a> / <a
-                                        href="https://docs.google.com/presentation/d/1gcpC_3z9oRp87eMkoco-kdLD-MM54Puk/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Training models: <a
+                                    </InstructorsLink> / <InstructorsLink
+                                        href="https://docs.google.com/presentation/d/1gcpC_3z9oRp87eMkoco-kdLD-MM54Puk/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Training models: <InstructorsLink
                                         href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap6PDF.zip">PDF
-                                    </a> / <a href="https://drive.google.com/uc?export=download&id=1VPdhFRnCr9_idTrX0UdHKGAw2shUuwhK">
+                                    </InstructorsLink> / <InstructorsLink href="https://drive.google.com/uc?export=download&id=1VPdhFRnCr9_idTrX0UdHKGAw2shUuwhK">
                                     SVG
-                                    </a> / <a
-                                        href="https://docs.google.com/presentation/d/1AKoeggAFBl9yLC7X5tushAGzCCxmB7EY/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Gradients and initialization: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap7PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1TTl4gvrTvNbegnml4CoGoKOOd6O8-PGs"> SVG</a> / <a href="https://docs.google.com/presentation/d/11zhB6PI-Dp6Ogmr4IcI6fbvbqNqLyYcz/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Measuring performance: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap8PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=19eQOnygd_l0DzgtJxXuYnWa4z7QKJrJx"> SVG</a> / <a href="https://docs.google.com/presentation/d/1SHRmJscDLUuQrG7tmysnScb3ZUAqVMZo/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Regularization: <a
+                                    </InstructorsLink> / <InstructorsLink
+                                        href="https://docs.google.com/presentation/d/1AKoeggAFBl9yLC7X5tushAGzCCxmB7EY/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Gradients and initialization: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap7PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1TTl4gvrTvNbegnml4CoGoKOOd6O8-PGs"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/11zhB6PI-Dp6Ogmr4IcI6fbvbqNqLyYcz/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Measuring performance: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap8PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=19eQOnygd_l0DzgtJxXuYnWa4z7QKJrJx"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1SHRmJscDLUuQrG7tmysnScb3ZUAqVMZo/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Regularization: <InstructorsLink
                                         href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap9PDF.zip">PDF
-                                    </a> / <a href="https://drive.google.com/uc?export=download&id=1LprgnUGL7xAM9-jlGZC9LhMPeefjY0r0">
+                                    </InstructorsLink> / <InstructorsLink href="https://drive.google.com/uc?export=download&id=1LprgnUGL7xAM9-jlGZC9LhMPeefjY0r0">
                                     SVG
-                                    </a> / <a
-                                        href="https://docs.google.com/presentation/d/1VwIfvjpdfTny6sEfu4ZETwCnw6m8Eg-5/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Convolutional networks: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap10PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1-Wb3VzaSvVeRzoUzJbI2JjZE0uwqupM9"> SVG</a> / <a href="https://docs.google.com/presentation/d/1MtfKBC4Y9hWwGqeP6DVwUNbi1j5ncQCg/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Residual networks: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap11PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1Mr58jzEVseUAfNYbGWCQyDtEDwvfHRi1"> SVG</a> / <a href="https://docs.google.com/presentation/d/1saY8Faz0KTKAAifUrbkQdLA2qkyEjOPI/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Transformers: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap12PDF.zip">PDF</a> / <a href="https://drive.google.com/uc?export=download&id=1txzOVNf8-jH4UfJ6SLnrtOfPd1Q3ebzd">
-                                    SVG</a> / <a
-                                        href="https://docs.google.com/presentation/d/1GVNvYWa0WJA6oKg89qZre-UZEhABfm0l/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Graph neural networks: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap13PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1lQIV6nRp6LVfaMgpGFhuwEXG-lTEaAwe"> SVG</a> / <a href="https://docs.google.com/presentation/d/1YwF3U82c1mQ74c1WqHVTzLZ0j7GgKaWP/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Unsupervised learning: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap14PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1aMbI6iCuUvOywqk5pBOmppJu1L1anqsM"> SVG</a> / <a href="https://docs.google.com/presentation/d/1A-lBGv3NHl4L32NvfFgy1EKeSwY-0UeB/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
-                                        PPTX</a></li>
-                                <li> GANs: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap15PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1EErnlZCOlXc3HK7m83T2Jh_0NzIUHvtL"> SVG</a> / <a href="https://docs.google.com/presentation/d/10Ernk41ShOTf4IYkMD-l4dJfKATkXH4w/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Normalizing flows: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap16PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1B9bxtmdugwtg-b7Y4AdQKAIEVWxjx8l3"> SVG</a> / <a href="https://docs.google.com/presentation/d/1nLLzqb9pdfF_h6i1HUDSyp7kSMIkSUUA/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Variational autoencoders: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap17PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1SNtNIY7khlHQYMtaOH-FosSH3kWwL4b7"> SVG</a> / <a href="https://docs.google.com/presentation/d/1lQE4Bu7-LgvV2VlJOt_4dQT-kusYl7Vo/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Diffusion models: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap18PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1A-pIGl4PxjVMYOKAUG3aT4a8wD3G-q_r"> SVG</a> / 
-                                    <a href="https://docs.google.com/presentation/d/1x_ufIBtVPzWUvRieKMkpw5SdRjXWwdfR/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
-                                    PPTX</a></li>
-                                <li> Deep reinforcement learning: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap19PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1a5WUoF7jeSgwC_PVdckJi1Gny46fCqh0"> SVG</a> / <a href="https://docs.google.com/presentation/d/1TnYmVbFNhmMFetbjyfXGmkxp1EHauMqr/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
-                                        PPTX </a></li>
-                                <li> Why does deep learning work?: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap20PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1M2d0DHEgddAQoIedKSDTTt7m1ZdmBLQ3"> SVG</a> / <a href="https://docs.google.com/presentation/d/1coxF4IsrCzDTLrNjRagHvqB_FBy10miA/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
-                                        PPTX</a></li>
-                                <li> Deep learning and ethics: <a
-                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap21PDF.zip">PDF</a> / <a
-                                        href="https://drive.google.com/uc?export=download&id=1jixmFfwmZkW_UVYzcxmDcMsdFFtnZ0bU">SVG</a> / <a
-                                            href="https://docs.google.com/presentation/d/1EtfzanZYILvi9_-Idm28zD94I_6OrN9R/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
-                                <li> Appendices - <a href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLAppendixPDF.zip">PDF</a> / <a href="https://drive.google.com/uc?export=download&id=1k2j7hMN40ISPSg9skFYWFL3oZT7r8v-l">
-                                    SVG</a> / <a
-                                        href="https://docs.google.com/presentation/d/1_2cJHRnsoQQHst0rwZssv-XH4o5SEHks/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</a></li>
+                                    </InstructorsLink> / <InstructorsLink
+                                        href="https://docs.google.com/presentation/d/1VwIfvjpdfTny6sEfu4ZETwCnw6m8Eg-5/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Convolutional networks: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap10PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1-Wb3VzaSvVeRzoUzJbI2JjZE0uwqupM9"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1MtfKBC4Y9hWwGqeP6DVwUNbi1j5ncQCg/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Residual networks: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap11PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1Mr58jzEVseUAfNYbGWCQyDtEDwvfHRi1"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1saY8Faz0KTKAAifUrbkQdLA2qkyEjOPI/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Transformers: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap12PDF.zip">PDF</InstructorsLink> / <InstructorsLink href="https://drive.google.com/uc?export=download&id=1txzOVNf8-jH4UfJ6SLnrtOfPd1Q3ebzd">
+                                    SVG</InstructorsLink> / <InstructorsLink
+                                        href="https://docs.google.com/presentation/d/1GVNvYWa0WJA6oKg89qZre-UZEhABfm0l/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Graph neural networks: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap13PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1lQIV6nRp6LVfaMgpGFhuwEXG-lTEaAwe"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1YwF3U82c1mQ74c1WqHVTzLZ0j7GgKaWP/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Unsupervised learning: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap14PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1aMbI6iCuUvOywqk5pBOmppJu1L1anqsM"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1A-lBGv3NHl4L32NvfFgy1EKeSwY-0UeB/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
+                                        PPTX</InstructorsLink></li>
+                                <li> GANs: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap15PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1EErnlZCOlXc3HK7m83T2Jh_0NzIUHvtL"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/10Ernk41ShOTf4IYkMD-l4dJfKATkXH4w/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Normalizing flows: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap16PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1SNtNIY7khlHQYMtaOH-FosSH3kWwL4b7"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1nLLzqb9pdfF_h6i1HUDSyp7kSMIkSUUA/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Variational autoencoders: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap17PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1B9bxtmdugwtg-b7Y4AdQKAIEVWxjx8l3"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1lQE4Bu7-LgvV2VlJOt_4dQT-kusYl7Vo/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Diffusion models: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap18PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1A-pIGl4PxjVMYOKAUG3aT4a8wD3G-q_r"> SVG</InstructorsLink> / 
+                                    <InstructorsLink href="https://docs.google.com/presentation/d/1x_ufIBtVPzWUvRieKMkpw5SdRjXWwdfR/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
+                                    PPTX</InstructorsLink></li>
+                                <li> Deep reinforcement learning: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap19PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1a5WUoF7jeSgwC_PVdckJi1Gny46fCqh0"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1TnYmVbFNhmMFetbjyfXGmkxp1EHauMqr/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
+                                        PPTX </InstructorsLink></li>
+                                <li> Why does deep learning work?: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap20PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1M2d0DHEgddAQoIedKSDTTt7m1ZdmBLQ3"> SVG</InstructorsLink> / <InstructorsLink href="https://docs.google.com/presentation/d/1coxF4IsrCzDTLrNjRagHvqB_FBy10miA/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">
+                                        PPTX</InstructorsLink></li>
+                                <li> Deep learning and ethics: <InstructorsLink
+                                        href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLChap21PDF.zip">PDF</InstructorsLink> / <InstructorsLink
+                                        href="https://drive.google.com/uc?export=download&id=1jixmFfwmZkW_UVYzcxmDcMsdFFtnZ0bU">SVG</InstructorsLink> / <InstructorsLink
+                                            href="https://docs.google.com/presentation/d/1EtfzanZYILvi9_-Idm28zD94I_6OrN9R/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
+                                <li> Appendices - <InstructorsLink href="https://github.com/udlbook/udlbook/raw/main/PDFFigures/UDLAppendixPDF.zip">PDF</InstructorsLink> / <InstructorsLink href="https://drive.google.com/uc?export=download&id=1k2j7hMN40ISPSg9skFYWFL3oZT7r8v-l">
+                                    SVG</InstructorsLink> / <InstructorsLink
+                                        href="https://docs.google.com/presentation/d/1_2cJHRnsoQQHst0rwZssv-XH4o5SEHks/edit?usp=drive_link&ouid=110441678248547154185&rtpof=true&sd=true">PPTX</InstructorsLink></li>
                             </ol>
                             </InstructorsContent>
-                            <a href="https://drive.google.com/file/d/1T_MXXVR4AfyMnlEFI-UVDh--FXI5deAp/view?usp=sharing">Instructions</a> for editing equations in figures.
+                            <InstructorsLink href="https://drive.google.com/file/d/1T_MXXVR4AfyMnlEFI-UVDh--FXI5deAp/view?usp=sharing">Instructions</InstructorsLink> for editing equations in figures.
 
                             <InstructorsContent>
                                 

src/components/Media/MediaElements.js

@@ -125,6 +125,10 @@ export const MediaContent = styled.div`
     flex-direction: column;
     align-items: left ; 
     list-style-position: inside;
+    @media screen and (max-width: 768px) {
+        font-size: 14px;
+    }
+
 `
 
 export const MediaRow2 = styled.div` 
@@ -136,4 +140,44 @@ export const MediaRow2 = styled.div`
     @media screen and (max-width: 768px){
         grid-template-areas: ${({imgStart}) => (imgStart ? `'col1' 'col2'` : `'col1 col1' 'col2 col2'`)};
     }
+`
+
+export const VideoFrame=styled.div`
+    width: 560px ; 
+    height: 315px ; 
+    @media screen and (max-width: 1050px) {
+        width: 280px ; 
+        height: 157px ; 
+    }
+
+
+`
+
+
+export const MediaLink = styled.a`
+    text-decoration: none;
+    color: #57c6d1;
+    font-weight: 300;
+    margin: 0 2px;
+    position: relative;
+
+    &:before{
+        position: absolute;
+        margin: 0 auto;
+        top: 100%;
+        left: 0;
+        width: 100%;
+        height: 2px;
+        background-color: #57c6d1;;
+        content: '';
+        opacity: .3;
+        -webkit-transform: scaleX(1);
+        transition-property: opacity, -webkit-transform;
+        transition-duration: .3s;
+    }
+
+    &:hover:before {
+        opacity: 1;
+        -webkit-transform: scaleX(1.05);
+      }
 `

src/components/Media/index.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { ImgWrap, Img, MediaContainer, MediaContent, MediaWrapper, MediaRow, MediaRow2, Column1, Column2, TextWrapper, TopLine, Heading, Subtitle} from './MediaElements'
+import { ImgWrap, Img, MediaLink, MediaContainer, MediaContent, MediaWrapper, VideoFrame, MediaRow, MediaRow2, Column1, Column2, TextWrapper, TopLine, Heading, Subtitle} from './MediaElements'
 
 // export const homeObjOne = {
 //     id: 'about',
@@ -45,11 +45,18 @@ const MediaSection = () => {
                     <MediaRow>
                         <Column1>
                             Machine learning street talk podcast
-                            <iframe width="560" height="315" src="https://www.youtube.com/embed/sJXn4Cl4oww?si=Lm_hQPqj0RXy-75H&amp;controls=0" title="YouTube video player" frameborder="2" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+                            <VideoFrame>
+                                <iframe width="100%" height="100%" 
+                                    src="https://www.youtube.com/embed/sJXn4Cl4oww?si=Lm_hQPqj0RXy-75H&amp;controls=0" 
+                                    title="YouTube video player" frameborder="2" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen>
+                                </iframe>
+                            </VideoFrame>
                         </Column1>
                         <Column2>
-                        Deeper insights podcast 
-                        <iframe width="560" height="315" src="https://www.youtube.com/embed/nQf4o9TDSHI?si=uMk66zLD7uhuSnQ1&amp;controls=0" title="YouTube video player" frameborder="2" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+                            Deeper insights podcast 
+                            <VideoFrame>
+                                <iframe width="100%" height="100%" src="https://www.youtube.com/embed/nQf4o9TDSHI?si=uMk66zLD7uhuSnQ1&amp;controls=0" title="YouTube video player" frameborder="2" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+                            </VideoFrame>
                         </Column2>
                     </MediaRow>
                     <MediaRow2>
@@ -57,9 +64,9 @@ const MediaSection = () => {
                             <TopLine>Reviews</TopLine>
                             <MediaContent>
                                 <ul>
-                                    <li> Amazon <a href="https://www.amazon.com/Understanding-Deep-Learning-Simon-Prince-ebook/product-reviews/B0BXKH8XY6/">reviews</a></li>          
-                                    <li>Goodreads <a href="https://www.goodreads.com/book/show/123239819-understanding-deep-learning?">reviews </a></li>
-                                    <li>Book <a href="https://medium.com/@vishalvignesh/udl-book-review-the-new-deep-learning-textbook-youll-want-to-finish-69e1557b018d">review</a> by Vishal V.</li>
+                                    <li> Amazon <MediaLink href="https://www.amazon.com/Understanding-Deep-Learning-Simon-Prince-ebook/product-reviews/B0BXKH8XY6/">reviews</MediaLink></li>          
+                                    <li>Goodreads <MediaLink href="https://www.goodreads.com/book/show/123239819-understanding-deep-learning?">reviews </MediaLink></li>
+                                    <li>Book <MediaLink href="https://medium.com/@vishalvignesh/udl-book-review-the-new-deep-learning-textbook-youll-want-to-finish-69e1557b018d">review</MediaLink> by Vishal V.</li>
                                 </ul>
                             </MediaContent>
                         </Column1>
@@ -67,8 +74,8 @@ const MediaSection = () => {
                             <TopLine>Interviews</TopLine>
                             <MediaContent>
                                 <ul>
-                                    <li>Borealis AI <a href="https://www.borealisai.com/news/understanding-deep-learning/">interview</a></li>
-                                    <li>Shepherd ML book <a href="https://shepherd.com/best-books/machine-learning-and-deep-neural-networks">recommendations</a></li>
+                                    <li>Borealis AI <MediaLink href="https://www.borealisai.com/news/understanding-deep-learning/">interview</MediaLink></li>
+                                    <li>Shepherd ML book <MediaLink href="https://shepherd.com/best-books/machine-learning-and-deep-neural-networks">recommendations</MediaLink></li>
                                 </ul>
                             </MediaContent>
                         </Column2>

src/components/More/MoreElements.js

@@ -135,10 +135,18 @@ export const MoreOuterList = styled.ul`
     // list-style:none;
     list-style-position: inside;
     margin:0;
+    @media screen and (max-width: 768px) {
+        font-size: 14px;
+    }
+
 `
 
 export const MoreInnerList = styled.ul`
     list-style-position: inside;
+    @media screen and (max-width: 768px) {
+        font-size: 12px;
+    }
+
 `
 
 export const MoreInnerP = styled.p`
@@ -149,19 +157,31 @@ export const MoreInnerP = styled.p`
     color: #fff
 `
 
+
 export const MoreLink = styled.a`
-  color: #fff;
-  text-decoration: none;
-  padding: 0.1rem 0rem;
-  height: 100%;
-  cursor: pointer;
+    text-decoration: none;
+    color: #555;
+    font-weight: 300;
+    margin: 0 2px;
+    position: relative;
 
-  &:hover {
-    filter: brightness(0.85);
-  }
+    &:before{
+        position: absolute;
+        margin: 0 auto;
+        top: 100%;
+        left: 0;
+        width: 100%;
+        height: 2px;
+        background-color: #555;
+        content: '';
+        opacity: .3;
+        -webkit-transform: scaleX(1);
+        transition-property: opacity, -webkit-transform;
+        transition-duration: .3s;
+    }
 
-  &.active {
-    color: #000
-    border-bottom: 3px solid #01bf71;
-  }
-`;
+    &:hover:before {
+        opacity: 1;
+        -webkit-transform: scaleX(1.05);
+      }
+`

src/components/More/index.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { ImgWrap, Img, MoreContainer, MoreRow2, MoreWrapper, MoreRow, Column1, Column2, TextWrapper, TopLine, Heading, Subtitle, MoreOuterList, MoreInnerList, MoreInnerP} from './MoreElements'
+import { ImgWrap, Img, MoreContainer, MoreLink, MoreRow2, MoreWrapper, MoreRow, Column1, Column2, TextWrapper, TopLine, Heading, Subtitle, MoreOuterList, MoreInnerList, MoreInnerP} from './MoreElements'
 import img from '../../images/more.svg'
 
 
@@ -28,7 +28,7 @@ const MoreSection = () => {
                             <TopLine>Book</TopLine>
                                 <MoreOuterList>
                                     <li>
-                                        <a href="http://computervisionmodels.com" target="_blank" rel="noreferrer">Computer vision: models, learning, and inference</a>
+                                        <MoreLink href="http://computervisionmodels.com" target="_blank" rel="noreferrer">Computer vision: models, learning, and inference</MoreLink>
                                         <MoreInnerP>
                                             <MoreInnerList>
                                                 <li> 2012 book published with CUP </li>
@@ -44,7 +44,7 @@ const MoreSection = () => {
                             <TopLine>Transformers & LLMs</TopLine>
                             <MoreOuterList>
                                 <li>
-                                    <a href="https://www.borealisai.com/research-blogs/a-high-level-overview-of-large-language-models/" target="_blank"  rel="noreferrer">Intro to LLMs</a>
+                                    <MoreLink href="https://www.borealisai.com/research-blogs/a-high-level-overview-of-large-language-models/" target="_blank"  rel="noreferrer">Intro to LLMs</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> What is an LLM?</li>
@@ -57,7 +57,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-14-transformers-i-introduction/" target="_blank"  rel="noreferrer">Transformers I</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-14-transformers-i-introduction/" target="_blank"  rel="noreferrer">Transformers I</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Dot-Product self-attention </li>
@@ -72,7 +72,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-16-transformers-ii-extensions/" target="_blank"  rel="noreferrer">Transformers II</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-16-transformers-ii-extensions/" target="_blank"  rel="noreferrer">Transformers II</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Sinusoidal position embeddings </li>
@@ -93,7 +93,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-17-transformers-iii-training/" target="_blank"  rel="noreferrer">Transformers III</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-17-transformers-iii-training/" target="_blank"  rel="noreferrer">Transformers III</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Tricks for training transformers </li>
@@ -106,7 +106,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/research-blogs/training-and-fine-tuning-large-language-models/" target="_blank"  rel="noreferrer">Training and fine-tuning LLMs</a>
+                                    <MoreLink href="https://www.borealisai.com/research-blogs/training-and-fine-tuning-large-language-models/" target="_blank"  rel="noreferrer">Training and fine-tuning LLMs</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Large language models </li>
@@ -118,7 +118,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/research-blogs/speeding-up-inference-in-transformers/" target="_blank"  rel="noreferrer">Speeding up inference in LLMs</a>
+                                    <MoreLink href="https://www.borealisai.com/research-blogs/speeding-up-inference-in-transformers/" target="_blank"  rel="noreferrer">Speeding up inference in LLMs</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Problems with transformers</li>
@@ -135,7 +135,7 @@ const MoreSection = () => {
                             <TopLine>Math for machine learning</TopLine>
                             <MoreOuterList>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1j2v2n6STPnblOCZ1_GBcVAZrsYkjPYwR/view?usp=sharing" target="_blank"  rel="noreferrer">Linear algebra</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1j2v2n6STPnblOCZ1_GBcVAZrsYkjPYwR/view?usp=sharing" target="_blank"  rel="noreferrer">Linear algebra</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Vectors and matrices </li>
@@ -154,7 +154,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1cmxXneW122-hcfmMRjEE-n5C9T2YvuQX/view?usp=sharing" target="_blank"  rel="noreferrer">Introduction to probability</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1cmxXneW122-hcfmMRjEE-n5C9T2YvuQX/view?usp=sharing" target="_blank"  rel="noreferrer">Introduction to probability</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Random variables </li>
@@ -168,7 +168,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1GI3eZNB1CjTqYHLyuRhCV215rwqANVOx/view?usp=sharing" target="_blank"  rel="noreferrer">Probability distributions</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1GI3eZNB1CjTqYHLyuRhCV215rwqANVOx/view?usp=sharing" target="_blank"  rel="noreferrer">Probability distributions</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Bernouilli distribution </li>
@@ -184,7 +184,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1DZ4rCmC7AZ8PFc51PiMUIkBO-xqKT_CG/view?usp=sharing" target="_blank"  rel="noreferrer">Fitting probability distributions</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1DZ4rCmC7AZ8PFc51PiMUIkBO-xqKT_CG/view?usp=sharing" target="_blank"  rel="noreferrer">Fitting probability distributions</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Maximum likelihood </li>
@@ -196,7 +196,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1CTfmsN-HJWZBRj8lY0ZhgHEbPCmYXWnA/view?usp=sharing" target="_blank"  rel="noreferrer">The normal distribution</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1CTfmsN-HJWZBRj8lY0ZhgHEbPCmYXWnA/view?usp=sharing" target="_blank"  rel="noreferrer">The normal distribution</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Types of covariance matrix </li>
@@ -214,7 +214,7 @@ const MoreSection = () => {
                             <TopLine>Optimization</TopLine>
                             <MoreOuterList>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1IoOSfJ0ku89aVyM9qygPl4MVnAhMEbAZ/view?usp=sharing" target="_blank"  rel="noreferrer">Gradient-based optimmization</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1IoOSfJ0ku89aVyM9qygPl4MVnAhMEbAZ/view?usp=sharing" target="_blank"  rel="noreferrer">Gradient-based optimization</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Convexity </li>
@@ -227,7 +227,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-8-bayesian-optimization/" target="_blank"  rel="noreferrer">Bayesian optimization</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-8-bayesian-optimization/" target="_blank"  rel="noreferrer">Bayesian optimization</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Gaussian processes </li>
@@ -243,7 +243,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-9-sat-solvers-i-introduction-and-applications/" target="_blank"  rel="noreferrer">SAT Solvers I</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-9-sat-solvers-i-introduction-and-applications/" target="_blank"  rel="noreferrer">SAT Solvers I</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Boolean logic and satisfiability </li>
@@ -258,7 +258,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-10-sat-solvers-ii-algorithms/" target="_blank"  rel="noreferrer">SAT Solvers II</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-10-sat-solvers-ii-algorithms/" target="_blank"  rel="noreferrer">SAT Solvers II</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Conditioning </li>
@@ -272,7 +272,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-11-sat-solvers-iii-factor-graphs-and-smt-solvers/" target="_blank"  rel="noreferrer">SAT Solvers III</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-11-sat-solvers-iii-factor-graphs-and-smt-solvers/" target="_blank"  rel="noreferrer">SAT Solvers III</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Satisfiability vs. problem size </li>
@@ -286,7 +286,7 @@ const MoreSection = () => {
                                 </li>
                             </MoreOuterList>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-11-sat-solvers-iii-factor-graphs-and-smt-solvers/" target="_blank"  rel="noreferrer">SAT Solvers III</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-11-sat-solvers-iii-factor-graphs-and-smt-solvers/" target="_blank"  rel="noreferrer">SAT Solvers III</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Satisfiability vs. problem size </li>
@@ -302,7 +302,7 @@ const MoreSection = () => {
                             <TopLine>Computer vision</TopLine>
                                 <MoreOuterList>
                                     <li>
-                                        <a href="https://drive.google.com/file/d/1r3V1GC5grhPF2pD91izuE0hTrTUEpQ9I/view?usp=sharing" target="_blank" rel="noreferrer">Image Processing</a>
+                                        <MoreLink href="https://drive.google.com/file/d/1r3V1GC5grhPF2pD91izuE0hTrTUEpQ9I/view?usp=sharing" target="_blank" rel="noreferrer">Image Processing</MoreLink>
                                         <MoreInnerP>
                                             <MoreInnerList>
                                                 <li> Whitening </li>
@@ -314,7 +314,7 @@ const MoreSection = () => {
                                         </MoreInnerP>
                                     </li>
                                     <li>
-                                        <a href="https://drive.google.com/file/d/1dbMBE13MWcd84dEGjYeWsC6eXouoC0xn/view?usp=sharing" target="_blank" rel="noreferrer">Pinhole camera</a>
+                                        <MoreLink href="https://drive.google.com/file/d/1dbMBE13MWcd84dEGjYeWsC6eXouoC0xn/view?usp=sharing" target="_blank" rel="noreferrer">Pinhole camera</MoreLink>
                                         <MoreInnerP>
                                             <MoreInnerList> 
                                                 <li> Pinhole camera model </li>
@@ -327,7 +327,7 @@ const MoreSection = () => {
                                         </MoreInnerP>
                                     </li>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1UArrb1ovqvZHbv90MufkW372r__ZZACQ/view?usp=sharing" target="_blank" rel="noreferrer">Geometric transformations</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1UArrb1ovqvZHbv90MufkW372r__ZZACQ/view?usp=sharing" target="_blank" rel="noreferrer">Geometric transformations</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Euclidean, similarity, affine, projective transformations </li>
@@ -340,7 +340,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1RqUoc7kvK8vqZF1NVuw7bIex9v4_QlSx/view?usp=sharing" target="_blank" rel="noreferrer">Multiple cameras</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1RqUoc7kvK8vqZF1NVuw7bIex9v4_QlSx/view?usp=sharing" target="_blank" rel="noreferrer">Multiple cameras</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Two view geometry </li>
@@ -357,7 +357,7 @@ const MoreSection = () => {
                             <TopLine>Reinforcement learning</TopLine>
                             <MoreOuterList>
                                 <li>
-                                    <a href="https://arxiv.org/abs/2307.05979" target="_blank"  rel="noreferrer">Transformers in RL</a>
+                                    <MoreLink href="https://arxiv.org/abs/2307.05979" target="_blank"  rel="noreferrer">Transformers in RL</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Challenges in RL</li>
@@ -381,7 +381,7 @@ const MoreSection = () => {
                             <TopLine>AI Theory</TopLine>
                             <MoreOuterList>
                                 <li>
-                                    <a href="https://www.borealisai.com/research-blogs/gradient-flow/" target="_blank"  rel="noreferrer">Gradient flow</a>
+                                    <MoreLink href="https://www.borealisai.com/research-blogs/gradient-flow/" target="_blank"  rel="noreferrer">Gradient flow</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Gradient flow </li>
@@ -393,7 +393,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                <a href="https://www.borealisai.com/research-blogs/the-neural-tangent-kernel/" target="_blank"  rel="noreferrer">Neural tangent kernel</a>
+                                <MoreLink href="https://www.borealisai.com/research-blogs/the-neural-tangent-kernel/" target="_blank"  rel="noreferrer">Neural tangent kernel</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Infinite width neural networks </li>
@@ -410,7 +410,7 @@ const MoreSection = () => {
                             <TopLine>Temporal models</TopLine>
                             <MoreOuterList>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1rrzGNyZDjXQ3_9ZqCGDmRMM3GYtHSBvj/view?usp=sharing" target="_blank"  rel="noreferrer">Temporal models</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1rrzGNyZDjXQ3_9ZqCGDmRMM3GYtHSBvj/view?usp=sharing" target="_blank"  rel="noreferrer">Temporal models</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Kalman filter </li>
@@ -426,7 +426,7 @@ const MoreSection = () => {
                             <TopLine> Unsupervised learning</TopLine>
                             <MoreOuterList>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1BrPHxAuyz28hhz_FtbO0A1cWYdMs2_h8/view?usp=sharing" target="_blank"  rel="noreferrer">Modeling complex data densities</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1BrPHxAuyz28hhz_FtbO0A1cWYdMs2_h8/view?usp=sharing" target="_blank"  rel="noreferrer">Modeling complex data densities</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Hidden variables </li>
@@ -440,7 +440,7 @@ const MoreSection = () => {
                                 </li>
 
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-5-variational-auto-encoders/" target="_blank"  rel="noreferrer">Variational autoencoders</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-5-variational-auto-encoders/" target="_blank"  rel="noreferrer">Variational autoencoders</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Non-linear latent variable models </li>
@@ -453,7 +453,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://arxiv.org/abs/1908.09257" target="_blank"  rel="noreferrer">Normalizing flows: introduction and review</a>
+                                    <MoreLink href="https://arxiv.org/abs/1908.09257" target="_blank"  rel="noreferrer">Normalizing flows: introduction and review</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                         <li> Normalizing flows </li>
@@ -471,7 +471,7 @@ const MoreSection = () => {
                             <TopLine>Graphical Models</TopLine>
                             <MoreOuterList>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1ghgeRmeZMyzNHcuzVwS4vRP6BXi3npVO/view?usp=sharing" target="_blank"  rel="noreferrer">Graphical models</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1ghgeRmeZMyzNHcuzVwS4vRP6BXi3npVO/view?usp=sharing" target="_blank"  rel="noreferrer">Graphical models</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Conditional independence </li>
@@ -484,7 +484,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1WAMc3wtZoPv5wRkdF-D0SShVYF6Net84/view?usp=sharing" target="_blank"  rel="noreferrer">Models for chains and trees</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1WAMc3wtZoPv5wRkdF-D0SShVYF6Net84/view?usp=sharing" target="_blank"  rel="noreferrer">Models for chains and trees</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Hidden Markov models </li>
@@ -498,7 +498,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1qqS9OfA1z7t12M45UaBr4CSCj1jwzcwz/view?usp=sharing" target="_blank"  rel="noreferrer">Models for grids</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1qqS9OfA1z7t12M45UaBr4CSCj1jwzcwz/view?usp=sharing" target="_blank"  rel="noreferrer">Models for grids</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Markov random fields </li>
@@ -515,7 +515,7 @@ const MoreSection = () => {
                             <TopLine>Machine learning</TopLine>
                             <MoreOuterList>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1ArWWi-qbzK2ih6KpOeIF8wX5g3S4J5DY/view?usp=sharing" target="_blank"  rel="noreferrer">Learning and inference</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1ArWWi-qbzK2ih6KpOeIF8wX5g3S4J5DY/view?usp=sharing" target="_blank"  rel="noreferrer">Learning and inference</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Discriminative models </li>
@@ -526,7 +526,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1QZX5jm4xN8rhpvdjRsFP5Ybw1EXSNGaL/view?usp=sharing" target="_blank"  rel="noreferrer">Regression models</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1QZX5jm4xN8rhpvdjRsFP5Ybw1EXSNGaL/view?usp=sharing" target="_blank"  rel="noreferrer">Regression models</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Linear regression </li>
@@ -541,7 +541,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://drive.google.com/file/d/1-_f4Yfm8iBWcaZ2Gyjw6O0eZiODipmSV/view?usp=sharing" target="_blank"  rel="noreferrer">Classification models</a>
+                                    <MoreLink href="https://drive.google.com/file/d/1-_f4Yfm8iBWcaZ2Gyjw6O0eZiODipmSV/view?usp=sharing" target="_blank"  rel="noreferrer">Classification models</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Logistic regression </li>
@@ -555,7 +555,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-2-few-shot-learning-and-meta-learning-i/" target="_blank"  rel="noreferrer">Few-shot learning and meta-learning I</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-2-few-shot-learning-and-meta-learning-i/" target="_blank"  rel="noreferrer">Few-shot learning and meta-learning I</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Meta-learning framework </li>
@@ -567,7 +567,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-3-few-shot-learning-and-meta-learning-ii/" target="_blank"  rel="noreferrer">Few-shot learning and meta-learning II</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-3-few-shot-learning-and-meta-learning-ii/" target="_blank"  rel="noreferrer">Few-shot learning and meta-learning II</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> MAML & Reptile </li>
@@ -585,7 +585,7 @@ const MoreSection = () => {
                            <TopLine>Natural language processing</TopLine>
                            <MoreOuterList>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-6-neural-natural-language-generation-decoding-algorithms/" target="_blank"  rel="noreferrer">Neural natural language generation I</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-6-neural-natural-language-generation-decoding-algorithms/" target="_blank"  rel="noreferrer">Neural natural language generation I</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Encoder-decoder architecture </li>
@@ -599,7 +599,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-7-neural-natural-language-generation-sequence-level-training/" target="_blank"  rel="noreferrer">Neural natural language generation II</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-7-neural-natural-language-generation-sequence-level-training/" target="_blank"  rel="noreferrer">Neural natural language generation II</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Fine-tuning with reinforcement learning </li>
@@ -614,7 +614,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-15-parsing-i-context-free-grammars-and-cyk-algorithm/" target="_blank"  rel="noreferrer">Parsing I</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-15-parsing-i-context-free-grammars-and-cyk-algorithm/" target="_blank"  rel="noreferrer">Parsing I</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Parse trees </li>
@@ -626,7 +626,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-18-parsing-ii-wcfgs-inside-algorithm-and-weighted-parsing/" target="_blank"  rel="noreferrer">Parsing II</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-18-parsing-ii-wcfgs-inside-algorithm-and-weighted-parsing/" target="_blank"  rel="noreferrer">Parsing II</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Weighted context-free grammars </li>
@@ -638,7 +638,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-19-parsing-iii-pcfgs-and-inside-outside-algorithm/" target="_blank"  rel="noreferrer">Parsing III</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-19-parsing-iii-pcfgs-and-inside-outside-algorithm/" target="_blank"  rel="noreferrer">Parsing III</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Probabilistic context-free grammars </li>
@@ -652,7 +652,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/understanding-xlnet/" target="_blank"  rel="noreferrer">XLNet</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/understanding-xlnet/" target="_blank"  rel="noreferrer">XLNet</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Language modeling </li>
@@ -670,7 +670,7 @@ const MoreSection = () => {
                            <TopLine>Responsible AI</TopLine>
                            <MoreOuterList>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial1-bias-and-fairness-ai/" target="_blank"  rel="noreferrer">Bias and fairness</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial1-bias-and-fairness-ai/" target="_blank"  rel="noreferrer">Bias and fairness</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Sources of bias</li>
@@ -683,7 +683,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/research-blogs/explainability-i-local-post-hoc-explanations/" target="_blank"  rel="noreferrer">Explainability I</a>
+                                    <MoreLink href="https://www.borealisai.com/research-blogs/explainability-i-local-post-hoc-explanations/" target="_blank"  rel="noreferrer">Explainability I</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Taxonomy of XAI approaches</li>
@@ -696,7 +696,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/research-blogs/explainability-ii-global-explanations-proxy-models-and-interpretable-models/" target="_blank"  rel="noreferrer">Explainability II</a>
+                                    <MoreLink href="https://www.borealisai.com/research-blogs/explainability-ii-global-explanations-proxy-models-and-interpretable-models/" target="_blank"  rel="noreferrer">Explainability II</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Global feature importance</li>
@@ -710,7 +710,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-12-differential-privacy-i-introduction/" target="_blank"  rel="noreferrer">Differential privacy I</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-12-differential-privacy-i-introduction/" target="_blank"  rel="noreferrer">Differential privacy I</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Early approaches to privacy </li>
@@ -724,7 +724,7 @@ const MoreSection = () => {
                                     </MoreInnerP>
                                 </li>
                                 <li>
-                                    <a href="https://www.borealisai.com/en/blog/tutorial-13-differential-privacy-ii-machine-learning-and-data-generation/" target="_blank"  rel="noreferrer">Differential privacy II</a>
+                                    <MoreLink href="https://www.borealisai.com/en/blog/tutorial-13-differential-privacy-ii-machine-learning-and-data-generation/" target="_blank"  rel="noreferrer">Differential privacy II</MoreLink>
                                     <MoreInnerP>
                                         <MoreInnerList> 
                                             <li> Differential privacy and matchine learning</li>

src/components/NavBar/NavbarElements.js

@@ -39,6 +39,10 @@ export const NavLogo = styled(LinkR)`
   margin-left: 24px;
   font-weight: bold;
   text-decoration: none;
+  @media screen and (max-width: 768px) {
+    font-size: 1.0rem;
+  }
+
 `;
 
 export const MobileIcon = styled.div`

src/components/NavBar/index.js

@@ -29,7 +29,7 @@ const Navbar = ( {toggle} ) => {
         <IconContext.Provider value={{color: '#fff'}}>
             <Nav scrollNav={scrollNav}>
                 <NavbarContainer>
-                    <NavLogo to="/" onClick={toggleHome}>
+                    <NavLogo to="/udlbook/" onClick={toggleHome}>
                         <h1> Understanding Deep Learning </h1>
                     </NavLogo>
                     <MobileIcon onClick={toggle}>

src/components/Notebooks/NotebookElements.js

@@ -34,16 +34,30 @@ export const NotebookRow = styled.div`
     }
 `
 
-export const Column1 = styled.div` 
+export const Column1 = styled.p` 
     margin-bottom: 15px;
     padding: 0 15px;
     grid-area: col1;
+    @media screen and (max-width: 1050px) {
+        font-size: 12px;
+    }
+
+    @media screen and (max-width: 768px) {
+        font-size: 10px;
+    }
 `
 
-export const Column2 = styled.div` 
+export const Column2 = styled.p` 
     margin-bottom: 15px;
     padding: 0 15px;
     grid-area: col2;
+    @media screen and (max-width: 1050px) {
+        font-size: 12px;
+    }
+
+    @media screen and (max-width: 768px) {
+        font-size: 10px;
+    }
 `
 
 export const TextWrapper = styled.div`
@@ -83,7 +97,6 @@ export const Subtitle = styled.p`
     font-size: 18px;
     line-height: 24px;
     color: ${({darkText})=> (darkText ? '#010606' : '#fff')};
-
 `
 
 export const BtnWrap = styled.div`
@@ -103,3 +116,32 @@ export const Img = styled.img`
   margin-left: 10px;
   padding-right: 0;
 `;
+
+
+export const NBLink = styled.a`
+    text-decoration: none;
+    color: #57c6d1;;
+    font-weight: 300;
+    margin: 0 2px;
+    position: relative;
+
+    &:before{
+        position: absolute;
+        margin: 0 auto;
+        top: 100%;
+        left: 0;
+        width: 100%;
+        height: 2px;
+        background-color: #57c6d1;;
+        content: '';
+        opacity: .3;
+        -webkit-transform: scaleX(1);
+        transition-property: opacity, -webkit-transform;
+        transition-duration: .3s;
+    }
+
+    &:hover:before {
+        opacity: 1;
+        -webkit-transform: scaleX(1.05);
+      }
+`

src/components/Notebooks/index.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { ImgWrap, Img, NotebookContainer, NotebookWrapper, NotebookRow, Column1, Column2, TextWrapper, TopLine, Heading, Subtitle} from './NotebookElements'
+import { NBLink, ImgWrap, Img, NotebookContainer, NotebookWrapper, NotebookRow, Column1, Column2, TextWrapper, TopLine, Heading, Subtitle} from './NotebookElements'
 
 // export const homeObjOne = {
 //     id: 'about',
@@ -45,168 +45,168 @@ const NotebookSection = () => {
                     <NotebookRow>
                         <Column1>
                             <ul>
-                                <li> Notebook 1.1 - Background mathematics: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap01/1_1_BackgroundMathematics.ipynb">ipynb/colab</a>
+                                <li> Notebook 1.1 - Background mathematics: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap01/1_1_BackgroundMathematics.ipynb">ipynb/colab</NBLink>
                                 </li>
-                                <li> Notebook 2.1 - Supervised learning: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap02/2_1_Supervised_Learning.ipynb">ipynb/colab</a>
+                                <li> Notebook 2.1 - Supervised learning: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap02/2_1_Supervised_Learning.ipynb">ipynb/colab</NBLink>
                                 </li>
-                                <li> Notebook 3.1 - Shallow networks I: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_1_Shallow_Networks_I.ipynb">ipynb/colab </a>
+                                <li> Notebook 3.1 - Shallow networks I: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_1_Shallow_Networks_I.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 3.2 - Shallow networks II: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_2_Shallow_Networks_II.ipynb">ipynb/colab </a>
+                                <li> Notebook 3.2 - Shallow networks II: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_2_Shallow_Networks_II.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 3.3 - Shallow network regions: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_3_Shallow_Network_Regions.ipynb">ipynb/colab </a>
+                                <li> Notebook 3.3 - Shallow network regions: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_3_Shallow_Network_Regions.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 3.4 - Activation functions: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_4_Activation_Functions.ipynb">ipynb/colab </a>
+                                <li> Notebook 3.4 - Activation functions: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap03/3_4_Activation_Functions.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 4.1 - Composing networks: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap04/4_1_Composing_Networks.ipynb">ipynb/colab </a>
+                                <li> Notebook 4.1 - Composing networks: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap04/4_1_Composing_Networks.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 4.2 - Clipping functions: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap04/4_2_Clipping_functions.ipynb">ipynb/colab </a>
+                                <li> Notebook 4.2 - Clipping functions: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap04/4_2_Clipping_functions.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 4.3 - Deep networks: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap04/4_3_Deep_Networks.ipynb">ipynb/colab </a>
+                                <li> Notebook 4.3 - Deep networks: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap04/4_3_Deep_Networks.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 5.1 - Least squares loss: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap05/5_1_Least_Squares_Loss.ipynb">ipynb/colab </a>
+                                <li> Notebook 5.1 - Least squares loss: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap05/5_1_Least_Squares_Loss.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 5.2 - Binary cross-entropy loss: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap05/5_2_Binary_Cross_Entropy_Loss.ipynb">ipynb/colab </a>
+                                <li> Notebook 5.2 - Binary cross-entropy loss: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap05/5_2_Binary_Cross_Entropy_Loss.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 5.3 - Multiclass cross-entropy loss: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap05/5_3_Multiclass_Cross_entropy_Loss.ipynb">ipynb/colab </a>
+                                <li> Notebook 5.3 - Multiclass cross-entropy loss: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap05/5_3_Multiclass_Cross_entropy_Loss.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 6.1 - Line search: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_1_Line_Search.ipynb">ipynb/colab </a>
+                                <li> Notebook 6.1 - Line search: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_1_Line_Search.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 6.2 - Gradient descent: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_2_Gradient_Descent.ipynb">ipynb/colab </a>
+                                <li> Notebook 6.2 - Gradient descent: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_2_Gradient_Descent.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 6.3 - Stochastic gradient descent: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_3_Stochastic_Gradient_Descent.ipynb">ipynb/colab </a>
+                                <li> Notebook 6.3 - Stochastic gradient descent: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_3_Stochastic_Gradient_Descent.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 6.4 - Momentum: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_4_Momentum.ipynb">ipynb/colab </a>
+                                <li> Notebook 6.4 - Momentum: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_4_Momentum.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 6.5 - Adam: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_5_Adam.ipynb">ipynb/colab </a>
+                                <li> Notebook 6.5 - Adam: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap06/6_5_Adam.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 7.1 - Backpropagation in toy model: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap07/7_1_Backpropagation_in_Toy_Model.ipynb">ipynb/colab </a>
+                                <li> Notebook 7.1 - Backpropagation in toy model: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap07/7_1_Backpropagation_in_Toy_Model.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 7.2 - Backpropagation: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap07/7_2_Backpropagation.ipynb">ipynb/colab </a>
+                                <li> Notebook 7.2 - Backpropagation: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap07/7_2_Backpropagation.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 7.3 - Initialization: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap07/7_3_Initialization.ipynb">ipynb/colab </a>
+                                <li> Notebook 7.3 - Initialization: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap07/7_3_Initialization.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 8.1 - MNIST-1D performance: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_1_MNIST_1D_Performance.ipynb">ipynb/colab </a>
+                                <li> Notebook 8.1 - MNIST-1D performance: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_1_MNIST_1D_Performance.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 8.2 - Bias-variance trade-off: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_2_Bias_Variance_Trade_Off.ipynb">ipynb/colab </a>
+                                <li> Notebook 8.2 - Bias-variance trade-off: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_2_Bias_Variance_Trade_Off.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 8.3 - Double descent: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_3_Double_Descent.ipynb">ipynb/colab </a>
+                                <li> Notebook 8.3 - Double descent: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_3_Double_Descent.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 8.4 - High-dimensional spaces: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_4_High_Dimensional_Spaces.ipynb">ipynb/colab </a>
+                                <li> Notebook 8.4 - High-dimensional spaces: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap08/8_4_High_Dimensional_Spaces.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 9.1 - L2 regularization: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_1_L2_Regularization.ipynb">ipynb/colab </a>
+                                <li> Notebook 9.1 - L2 regularization: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_1_L2_Regularization.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 9.2 - Implicit regularization: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_2_Implicit_Regularization.ipynb">ipynb/colab </a>
+                                <li> Notebook 9.2 - Implicit regularization: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_2_Implicit_Regularization.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 9.3 - Ensembling: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_3_Ensembling.ipynb">ipynb/colab </a>
+                                <li> Notebook 9.3 - Ensembling: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_3_Ensembling.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 9.4 - Bayesian approach: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_4_Bayesian_Approach.ipynb">ipynb/colab </a>
+                                <li> Notebook 9.4 - Bayesian approach: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_4_Bayesian_Approach.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 9.5 - Augmentation <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_5_Augmentation.ipynb">ipynb/colab </a>
+                                <li> Notebook 9.5 - Augmentation <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap09/9_5_Augmentation.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 10.1 - 1D convolution: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_1_1D_Convolution.ipynb">ipynb/colab </a>
+                                <li> Notebook 10.1 - 1D convolution: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_1_1D_Convolution.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 10.2 - Convolution for MNIST-1D: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_2_Convolution_for_MNIST_1D.ipynb">ipynb/colab </a>
+                                <li> Notebook 10.2 - Convolution for MNIST-1D: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_2_Convolution_for_MNIST_1D.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 10.3 - 2D convolution: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_3_2D_Convolution.ipynb">ipynb/colab </a>
+                                <li> Notebook 10.3 - 2D convolution: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_3_2D_Convolution.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 10.4 - Downsampling & upsampling: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_4_Downsampling_and_Upsampling.ipynb">ipynb/colab </a>
+                                <li> Notebook 10.4 - Downsampling & upsampling: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_4_Downsampling_and_Upsampling.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 10.5 - Convolution for MNIST: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_5_Convolution_For_MNIST.ipynb">ipynb/colab </a>
+                                <li> Notebook 10.5 - Convolution for MNIST: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap10/10_5_Convolution_For_MNIST.ipynb">ipynb/colab </NBLink>
                                 </li>
                             </ul>
                         </Column1>
                         <Column2>
                         <ul>
-                                <li> Notebook 11.1 - Shattered gradients: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap11/11_1_Shattered_Gradients.ipynb">ipynb/colab </a>
+                                <li> Notebook 11.1 - Shattered gradients: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap11/11_1_Shattered_Gradients.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 11.2 - Residual networks: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap11/11_2_Residual_Networks.ipynb">ipynb/colab </a>
+                                <li> Notebook 11.2 - Residual networks: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap11/11_2_Residual_Networks.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 11.3 - Batch normalization: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap11/11_3_Batch_Normalization.ipynb">ipynb/colab </a>
+                                <li> Notebook 11.3 - Batch normalization: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap11/11_3_Batch_Normalization.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 12.1 - Self-attention: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_1_Self_Attention.ipynb">ipynb/colab </a>
+                                <li> Notebook 12.1 - Self-attention: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_1_Self_Attention.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 12.2 - Multi-head self-attention: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_2_Multihead_Self_Attention.ipynb">ipynb/colab </a>
+                                <li> Notebook 12.2 - Multi-head self-attention: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_2_Multihead_Self_Attention.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 12.3 - Tokenization: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_3_Tokenization.ipynb">ipynb/colab </a>
+                                <li> Notebook 12.3 - Tokenization: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_3_Tokenization.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 12.4 - Decoding strategies: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_4_Decoding_Strategies.ipynb">ipynb/colab </a>
+                                <li> Notebook 12.4 - Decoding strategies: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap12/12_4_Decoding_Strategies.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 13.1 - Encoding graphs: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_1_Graph_Representation.ipynb">ipynb/colab </a>
+                                <li> Notebook 13.1 - Encoding graphs: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_1_Graph_Representation.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 13.2 - Graph classification : <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_2_Graph_Classification.ipynb">ipynb/colab </a>
+                                <li> Notebook 13.2 - Graph classification : <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_2_Graph_Classification.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 13.3 - Neighborhood sampling: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_3_Neighborhood_Sampling.ipynb">ipynb/colab </a>
+                                <li> Notebook 13.3 - Neighborhood sampling: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_3_Neighborhood_Sampling.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 13.4 - Graph attention: <a
-                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_4_Graph_Attention_Networks.ipynb">ipynb/colab </a>
+                                <li> Notebook 13.4 - Graph attention: <NBLink
+                                        href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap13/13_4_Graph_Attention_Networks.ipynb">ipynb/colab </NBLink>
                                 </li>
-                                <li> Notebook 15.1 - GAN toy example: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap15/15_1_GAN_Toy_Example.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 15.2 - Wasserstein distance: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap15/15_2_Wasserstein_Distance.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 16.1 - 1D normalizing flows: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap16/16_1_1D_Normalizing_Flows.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 16.2 - Autoregressive flows: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap16/16_2_Autoregressive_Flows.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 16.3 - Contraction mappings: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap16/16_3_Contraction_Mappings.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 17.1 - Latent variable models: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap17/17_1_Latent_Variable_Models.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 17.2 - Reparameterization trick: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap17/17_2_Reparameterization_Trick.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 17.3 - Importance sampling: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap17/17_3_Importance_Sampling.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 18.1 - Diffusion encoder: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_1_Diffusion_Encoder.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 18.2 - 1D diffusion model: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_2_1D_Diffusion_Model.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 18.3 - Reparameterized model: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_3_Reparameterized_Model.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 18.4 - Families of diffusion models: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_4_Families_of_Diffusion_Models.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 19.1 - Markov decision processes: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_1_Markov_Decision_Processes.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 19.2 - Dynamic programming: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_2_Dynamic_Programming.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 19.3 - Monte-Carlo methods: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_3_Monte_Carlo_Methods.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 19.4 - Temporal difference methods: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_4_Temporal_Difference_Methods.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 19.5 - Control variates: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_5_Control_Variates.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 20.1 - Random data: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_1_Random_Data.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 20.2 - Full-batch gradient descent: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_2_Full_Batch_Gradient_Descent.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 20.3 - Lottery tickets: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_3_Lottery_Tickets.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 20.4 - Adversarial attacks: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_4_Adversarial_Attacks.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 21.1 - Bias mitigation: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap21/21_1_Bias_Mitigation.ipynb">ipynb/colab </a></li>
-                                <li> Notebook 21.2 - Explainability: <a href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap21/21_2_Explainability.ipynb">ipynb/colab </a></li>
+                                <li> Notebook 15.1 - GAN toy example: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap15/15_1_GAN_Toy_Example.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 15.2 - Wasserstein distance: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap15/15_2_Wasserstein_Distance.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 16.1 - 1D normalizing flows: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap16/16_1_1D_Normalizing_Flows.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 16.2 - Autoregressive flows: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap16/16_2_Autoregressive_Flows.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 16.3 - Contraction mappings: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap16/16_3_Contraction_Mappings.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 17.1 - Latent variable models: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap17/17_1_Latent_Variable_Models.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 17.2 - Reparameterization trick: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap17/17_2_Reparameterization_Trick.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 17.3 - Importance sampling: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap17/17_3_Importance_Sampling.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 18.1 - Diffusion encoder: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_1_Diffusion_Encoder.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 18.2 - 1D diffusion model: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_2_1D_Diffusion_Model.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 18.3 - Reparameterized model: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_3_Reparameterized_Model.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 18.4 - Families of diffusion models: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap18/18_4_Families_of_Diffusion_Models.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 19.1 - Markov decision processes: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_1_Markov_Decision_Processes.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 19.2 - Dynamic programming: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_2_Dynamic_Programming.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 19.3 - Monte-Carlo methods: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_3_Monte_Carlo_Methods.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 19.4 - Temporal difference methods: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_4_Temporal_Difference_Methods.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 19.5 - Control variates: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap19/19_5_Control_Variates.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 20.1 - Random data: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_1_Random_Data.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 20.2 - Full-batch gradient descent: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_2_Full_Batch_Gradient_Descent.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 20.3 - Lottery tickets: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_3_Lottery_Tickets.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 20.4 - Adversarial attacks: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap20/20_4_Adversarial_Attacks.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 21.1 - Bias mitigation: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap21/21_1_Bias_Mitigation.ipynb">ipynb/colab </NBLink></li>
+                                <li> Notebook 21.2 - Explainability: <NBLink href="https://github.com/udlbook/udlbook/blob/main/Notebooks/Chap21/21_2_Explainability.ipynb">ipynb/colab </NBLink></li>
                             </ul>
                         </Column2>
                     </NotebookRow>

style.css

@@ -1,23 +0,0 @@
-body {
-    font-size: 17px;
-    margin: 2% 10%;
-}
-
-#head {
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap-reverse;
-    justify-content: space-between;
-    width: 100%;
-}
-
-#cover {
-    justify-content: center;
-    display: flex;
-    width: 30%;
-}
-
-#cover img {
-    width: 100%;
-    height: min-content;
-}