Fix/pytorch accessibility

assets/scss/custom.scss

@@ -1,6 +1,13 @@
 // Override this file to add your own SCSS styling.
 @use "sass:color";
 
+body {
+  line-height: 1.6;
+}
+
+.sidebar, .sidebar a { color: #333333; }
+.dark .sidebar, .dark .sidebar a { color: #e0e0e0; }
+
 .container {
   max-width: 90%;
 }
@@ -196,7 +203,12 @@ html {
 }
 
 .hljs {
-  background-color: #f9f9f9;
+  .hljs-title,
+  .hljs-title.class_,
+  .hljs-title.class_.inherited__,
+  .hljs-title.function_ {
+  color: #7a3e9d;
+}
 }
 
 #TableOfContents li a,

content/notes/pytorch-hpc/overview.md

@@ -96,18 +96,18 @@ Activation functions introduce non-linearity into neural networks, enabling them
 <div class="container">
   <div class="row">
     <div class="col-md-6">
-      {{< figure src="/courses/pytorch-hpc/img/sigmoid.png" caption="Sigmoid" width="400px" >}}
+      {{< figure src="/courses/pytorch-hpc/img/sigmoid.png" caption="Sigmoid" alt="Line graph of the Sigmoid activation function showing an S-shaped curve with output ranging from 0 to 1" width="400px" >}}
     </div>
     <div class="col-md-6">
-      {{< figure src="/courses/pytorch-hpc/img/tanh.png" caption="Tanh" width="400px" >}}
+      {{< figure src="/courses/pytorch-hpc/img/tanh.png" caption="Tanh" alt="Line graph of the Tanh activation function showing an S-shaped curve with output ranging from -1 to 1" width="400px" >}}
     </div>
   </div>
   <div class="row">
     <div class="col-md-6">
-      {{< figure src="/courses/pytorch-hpc/img/relu.png" caption="ReLU" width="400px" >}}
+      {{< figure src="/courses/pytorch-hpc/img/relu.png" caption="ReLU" alt="Line graph of the ReLU activation function showing zero output for negative inputs and a linear increase for positive inputs" width="400px" >}}
     </div>
     <div class="col-md-6">
-      {{< figure src="/courses/pytorch-hpc/img/leakyrelu.png" caption="Leaky ReLU" width="400px" >}}
+      {{< figure src="/courses/pytorch-hpc/img/leakyrelu.png" caption="Leaky ReLU" alt="Line graph of the Leaky ReLU activation function showing a small negative slope for negative inputs and a linear increase for positive inputs" width="400px" >}}
     </div>
   </div>
 </div>

content/notes/pytorch-hpc/simple_nn.md

@@ -13,7 +13,7 @@ menu:
 ### **Neural Network Construction**
 A neural network consists of multiple layers, each performing specific transformations on the input data.
 
-{{< figure src="/courses/pytorch-hpc/img/nn.png" caption="An Artificial Neural Network" width="500px" >}}
+{{< figure src="/courses/pytorch-hpc/img/nn.png" caption="An Artificial Neural Network" alt="Diagram of an artificial neural network showing 4 input layer nodes in blue, 5 hidden layer nodes in orange, and 3 output layer nodes in green, with lines connecting each layer" width="500px" >}}
 
 Frequently used Layers in PyTorch:
 ```python

layouts/partials/book_sidebar.html

@@ -1,4 +1,4 @@
-<form class="docs-search d-flex align-items-center">
+<form class="docs-search d-flex align-items-center" role="search">
   <button class="btn docs-toggle d-md-none p-0 mr-md-3 w-100" type="button" data-toggle="collapse" data-target="#docs-nav" aria-controls="docs-nav" aria-expanded="false" aria-label="Toggle section navigation">
     <div class="d-flex">
       <span class="d-md-none pl-1 flex-grow-1 text-left overflow-hidden">
@@ -21,6 +21,7 @@
     <span class="sidebar-search-shortcut">/</span>
   </button>
   {{ end }}
+  <button type="submit" class="sr-only" aria-label="Submit search">Search</button>
 </form>
 
 <nav class="collapse docs-links" id="docs-nav">

layouts/partials/docs_sidebar.html

@@ -15,13 +15,14 @@
   {{ errorf "Please define menu items named `menu: %s:` in your %s front matter or define `[[menu.%s]]` in `config/default/menus.toml`. See https://sourcethemes.com/academic/docs/managing-content/#menus" $menu_name .Path $menu_name }}
 {{ end }}
 
-<form class="docs-search d-flex align-items-center">
+<form class="docs-search d-flex align-items-center" role="search">
   <button class="btn docs-toggle d-md-none p-0 mr-3" type="button" data-toggle="collapse" data-target="#docs-nav" aria-controls="docs-nav" aria-expanded="false" aria-label="Toggle section navigation">
     <span><i class="fas fa-bars"></i></span>
   </button>
 
   {{ if eq site.Params.search.engine 1 }}
   <input name="q" type="search" class="form-control" placeholder="{{ i18n "search_placeholder" }}" autocomplete="off" aria-label="Search the site (results appear in dialog)">
+  <button type="submit" class="sr-only" aria-label="Submit search">Search</button>
   {{ end }}
 </form>
 

layouts/partials/search.html

@@ -18,8 +18,8 @@ <h1 id="search-title">{{ i18n "search" }}</h1>
 
       <div id="search-box">
         {{ if eq site.Params.search.engine 1 }}
-        <!-- <label for="search-query" class="sr-only">{{ i18n "search" }}</label> -->
-        <input name="q" id="search-query" placeholder="{{i18n "search_placeholder"}}" autocapitalize="off"
+        <label for="search-query" class="sr-only">{{ i18n "search" }}</label> 
+        <input name="q" id="search-query" aria-label="Search" placeholder="{{i18n "search_placeholder"}}" autocapitalize="off"
         autocomplete="off" autocorrect="off" spellcheck="false" type="search">
         {{ else }}
         <!-- Search box will appear here -->