From 393959df5063bfa9cbf3d74c96091f971a23c35b Mon Sep 17 00:00:00 2001
From: Jan Haller <bromeon@gmail.com>
Date: Sun, 7 May 2023 21:51:15 +0200
Subject: [PATCH 1/2] Accessibility improvements

---
 website/config.toml           |  2 ++
 website/templates/index.html  | 18 +++++++++---------
 website/templates/layout.html | 22 +++++++++++-----------
 3 files changed, 22 insertions(+), 20 deletions(-)

diff --git a/website/config.toml b/website/config.toml
index 23712e72a4a8..a4bb0eee87ca 100644
--- a/website/config.toml
+++ b/website/config.toml
@@ -1,6 +1,8 @@
 # The URL the site will be built for
 base_url = "https://godot-rust.github.io"
 
+title = "godot-rust: Rust bindings for the Godot game engine"
+
 # Whether to automatically compile all Sass files in the sass directory
 compile_sass = false
 
diff --git a/website/templates/index.html b/website/templates/index.html
index 919b8b9a118c..2cd57811f685 100644
--- a/website/templates/index.html
+++ b/website/templates/index.html
@@ -12,7 +12,7 @@
 
 {% block content %}
 <div class="flex items-center flex-col mt-10">
-  <img src="{{ get_url(path='godot-ferris-2.png') }}" class="h-28 w-auto">
+  <img src="{{ get_url(path='godot-ferris-2.png') }}" class="h-28 w-auto" alt="godot-rust Ferris with stripes">
 
   <div class="logo-title mb-12">
     {{ section.title }}
@@ -25,7 +25,7 @@
 
   <div class="flex flex-wrap space-x-4 mt-6">
     <div class="flex flex-col items-center">
-      <a href="book" target="_blank">
+      <a href="book" target="_blank" title="godot-rust book">
         <svg xmlns="http://www.w3.org/2000/svg" class="text-black dark:text-white social-icon social-icon-thin" viewBox="-2 -2 20 20">
           <title>godot-rust book</title>
           <path fill-rule="evenodd" d="M6 1h6v7a.5.5 0 0 1-.757.429L9 7.083 6.757 8.43A.5.5 0 0 1 6 8V1z"/>
@@ -37,7 +37,7 @@
     </div>
 
     <div class="flex flex-col items-center">
-      <a href="{{config.extra.links.github_gdnative}}" target="_blank">
+      <a href="{{config.extra.links.github_gdnative}}" target="_blank" title="GitHub for gdnative">
         <svg xmlns="http://www.w3.org/2000/svg" class="text-black dark:text-white social-icon" viewBox="0 0 24 24">
           <title>GitHub for gdnative</title>
           <path d="M10.9,2.1c-4.6,0.5-8.3,4.2-8.8,8.7c-0.5,4.7,2.2,8.9,6.3,10.5C8.7,21.4,9,21.2,9,20.8v-1.6c0,0-0.4,0.1-0.9,0.1 c-1.4,0-2-1.2-2.1-1.9c-0.1-0.4-0.3-0.7-0.6-1C5.1,16.3,5,16.3,5,16.2C5,16,5.3,16,5.4,16c0.6,0,1.1,0.7,1.3,1c0.5,0.8,1.1,1,1.4,1 c0.4,0,0.7-0.1,0.9-0.2c0.1-0.7,0.4-1.4,1-1.8c-2.3-0.5-4-1.8-4-4c0-1.1,0.5-2.2,1.2-3C7.1,8.8,7,8.3,7,7.6c0-0.4,0-0.9,0.2-1.3 C7.2,6.1,7.4,6,7.5,6c0,0,0.1,0,0.1,0C8.1,6.1,9.1,6.4,10,7.3C10.6,7.1,11.3,7,12,7s1.4,0.1,2,0.3c0.9-0.9,2-1.2,2.5-1.3 c0,0,0.1,0,0.1,0c0.2,0,0.3,0.1,0.4,0.3C17,6.7,17,7.2,17,7.6c0,0.8-0.1,1.2-0.2,1.4c0.7,0.8,1.2,1.8,1.2,3c0,2.2-1.7,3.5-4,4 c0.6,0.5,1,1.4,1,2.3v2.6c0,0.3,0.3,0.6,0.7,0.5c3.7-1.5,6.3-5.1,6.3-9.3C22,6.1,16.9,1.4,10.9,2.1z"></path>
@@ -47,7 +47,7 @@
     </div>
 
     <div class="flex flex-col items-center">
-      <a href="{{config.extra.links.github_gdext}}" target="_blank">
+      <a href="{{config.extra.links.github_gdext}}" target="_blank" title="GitHub for gdext">
         <svg xmlns="http://www.w3.org/2000/svg" class="text-black dark:text-white social-icon" viewBox="0 0 24 24">
           <title>GitHub for gdext</title>
           <path d="M10.9,2.1c-4.6,0.5-8.3,4.2-8.8,8.7c-0.5,4.7,2.2,8.9,6.3,10.5C8.7,21.4,9,21.2,9,20.8v-1.6c0,0-0.4,0.1-0.9,0.1 c-1.4,0-2-1.2-2.1-1.9c-0.1-0.4-0.3-0.7-0.6-1C5.1,16.3,5,16.3,5,16.2C5,16,5.3,16,5.4,16c0.6,0,1.1,0.7,1.3,1c0.5,0.8,1.1,1,1.4,1 c0.4,0,0.7-0.1,0.9-0.2c0.1-0.7,0.4-1.4,1-1.8c-2.3-0.5-4-1.8-4-4c0-1.1,0.5-2.2,1.2-3C7.1,8.8,7,8.3,7,7.6c0-0.4,0-0.9,0.2-1.3 C7.2,6.1,7.4,6,7.5,6c0,0,0.1,0,0.1,0C8.1,6.1,9.1,6.4,10,7.3C10.6,7.1,11.3,7,12,7s1.4,0.1,2,0.3c0.9-0.9,2-1.2,2.5-1.3 c0,0,0.1,0,0.1,0c0.2,0,0.3,0.1,0.4,0.3C17,6.7,17,7.2,17,7.6c0,0.8-0.1,1.2-0.2,1.4c0.7,0.8,1.2,1.8,1.2,3c0,2.2-1.7,3.5-4,4 c0.6,0.5,1,1.4,1,2.3v2.6c0,0.3,0.3,0.6,0.7,0.5c3.7-1.5,6.3-5.1,6.3-9.3C22,6.1,16.9,1.4,10.9,2.1z"></path>
@@ -57,7 +57,7 @@
     </div>
 
     <div class="flex flex-col items-center">
-      <a href="docs" target="_blank">
+      <a href="docs" target="_blank" title="latest API docs">
         <svg xmlns="http://www.w3.org/2000/svg" class="text-black dark:text-white social-icon social-icon-thin" viewBox="-2 -2 20 20">
           <title>latest API docs</title>
           <path fill-rule="evenodd" d="M2 15.5V2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v13.5a.5.5 0 0 1-.74.439L8 13.069l-5.26 2.87A.5.5 0 0 1 2 15.5zM8.16 4.1a.178.178 0 0 0-.32 0l-.634 1.285a.178.178 0 0 1-.134.098l-1.42.206a.178.178 0 0 0-.098.303L6.58 6.993c.042.041.061.1.051.158L6.39 8.565a.178.178 0 0 0 .258.187l1.27-.668a.178.178 0 0 1 .165 0l1.27.668a.178.178 0 0 0 .257-.187L9.368 7.15a.178.178 0 0 1 .05-.158l1.028-1.001a.178.178 0 0 0-.098-.303l-1.42-.206a.178.178 0 0 1-.134-.098L8.16 4.1z"/>
@@ -86,7 +86,7 @@ <h2>Community</h2>
 
     {% if config.extra.social.discord %}
     <div class="flex flex-col items-center">
-      <a href="{{config.extra.social.discord}}" target="_blank">
+      <a href="{{config.extra.social.discord}}" target="_blank" title="Discord">
         <svg xmlns="http://www.w3.org/2000/svg" class="text-black dark:text-white social-icon social-icon-thin" viewBox="-2 -2 20 20">
           <title>Discord</title>
           <path d="M13.545 2.907a13.227 13.227 0 0 0-3.257-1.011.05.05 0 0 0-.052.025c-.141.25-.297.577-.406.833a12.19 12.19 0 0 0-3.658 0 8.258 8.258 0 0 0-.412-.833.051.051 0 0 0-.052-.025c-1.125.194-2.22.534-3.257 1.011a.041.041 0 0 0-.021.018C.356 6.024-.213 9.047.066 12.032c.001.014.01.028.021.037a13.276 13.276 0 0 0 3.995 2.02.05.05 0 0 0 .056-.019c.308-.42.582-.863.818-1.329a.05.05 0 0 0-.01-.059.051.051 0 0 0-.018-.011 8.875 8.875 0 0 1-1.248-.595.05.05 0 0 1-.02-.066.051.051 0 0 1 .015-.019c.084-.063.168-.129.248-.195a.05.05 0 0 1 .051-.007c2.619 1.196 5.454 1.196 8.041 0a.052.052 0 0 1 .053.007c.08.066.164.132.248.195a.051.051 0 0 1-.004.085 8.254 8.254 0 0 1-1.249.594.05.05 0 0 0-.03.03.052.052 0 0 0 .003.041c.24.465.515.909.817 1.329a.05.05 0 0 0 .056.019 13.235 13.235 0 0 0 4.001-2.02.049.049 0 0 0 .021-.037c.334-3.451-.559-6.449-2.366-9.106a.034.034 0 0 0-.02-.019Zm-8.198 7.307c-.789 0-1.438-.724-1.438-1.612 0-.889.637-1.613 1.438-1.613.807 0 1.45.73 1.438 1.613 0 .888-.637 1.612-1.438 1.612Zm5.316 0c-.788 0-1.438-.724-1.438-1.612 0-.889.637-1.613 1.438-1.613.807 0 1.451.73 1.438 1.613 0 .888-.631 1.612-1.438 1.612Z"/>
@@ -97,7 +97,7 @@ <h2>Community</h2>
     {% endif %}
     {% if config.extra.social.mastodon %}
     <div class="flex flex-col items-center">
-      <a href="{{config.extra.social.mastodon}}" target="_blank">
+      <a href="{{config.extra.social.mastodon}}" target="_blank" title="Mastodon">
         <svg xmlns="http://www.w3.org/2000/svg" class="text-black dark:text-white social-icon social-icon-thin" viewBox="-2 -2 20 20">
           <title>Mastodon</title>
           <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"/>
@@ -109,7 +109,7 @@ <h2>Community</h2>
 
     {% if config.extra.social.twitter %}
     <div class="flex flex-col items-center">
-      <a href="{{config.extra.social.twitter}}" target="_blank">
+      <a href="{{config.extra.social.twitter}}" target="_blank" title="Twitter">
         <svg xmlns="http://www.w3.org/2000/svg" class="text-black dark:text-white social-icon" viewBox="0 0 30 30">
           <title>Twitter</title>
           <path d="M28,6.937c-0.957,0.425-1.985,0.711-3.064,0.84c1.102-0.66,1.947-1.705,2.345-2.951c-1.03,0.611-2.172,1.055-3.388,1.295 c-0.973-1.037-2.359-1.685-3.893-1.685c-2.946,0-5.334,2.389-5.334,5.334c0,0.418,0.048,0.826,0.138,1.215 c-4.433-0.222-8.363-2.346-10.995-5.574C3.351,6.199,3.088,7.115,3.088,8.094c0,1.85,0.941,3.483,2.372,4.439 c-0.874-0.028-1.697-0.268-2.416-0.667c0,0.023,0,0.044,0,0.067c0,2.585,1.838,4.741,4.279,5.23 c-0.447,0.122-0.919,0.187-1.406,0.187c-0.343,0-0.678-0.034-1.003-0.095c0.679,2.119,2.649,3.662,4.983,3.705 c-1.825,1.431-4.125,2.284-6.625,2.284c-0.43,0-0.855-0.025-1.273-0.075c2.361,1.513,5.164,2.396,8.177,2.396 c9.812,0,15.176-8.128,15.176-15.177c0-0.231-0.005-0.461-0.015-0.69C26.38,8.945,27.285,8.006,28,6.937z"></path>
@@ -120,7 +120,7 @@ <h2>Community</h2>
     {% endif %}
 
     {% if config.extra.social.email %}
-      <a href="mailto:{{config.extra.social.email}}" target="_blank">
+      <a href="mailto:{{config.extra.social.email}}" target="_blank" title="Email">
         <svg xmlns="http://www.w3.org/2000/svg"  class="text-black dark:text-white social-icon" viewBox="0 0 24 24">
           <title>E-Mail</title>
           <path d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
diff --git a/website/templates/layout.html b/website/templates/layout.html
index 682ce3a4f1a8..5c1148aa35d2 100644
--- a/website/templates/layout.html
+++ b/website/templates/layout.html
@@ -15,22 +15,22 @@
       <link href="{{ config.extra.favicon.manifest }}" rel="manifest" />
       {% endif %}
       {% if config.extra.favicon.favicon_16x16 %}
-      <link href='{{ config.extra.favicon.favicon_16x16 }}' rel="icon" sizes="16x16" type="image/png" />
+      <link href='{{ config.extra.favicon.favicon_16x16 }}' rel="icon" sizes="16x16" type="image/png"/>
       {% endif %}
       {% if config.extra.favicon.favicon_32x32 %}
-      <link href='{{ config.extra.favicon.favicon_32x32 }}' rel="icon" sizes="32x32" type="image/png" />
+      <link href='{{ config.extra.favicon.favicon_32x32 }}' rel="icon" sizes="32x32" type="image/png"/>
       {% endif %}
       {% if config.extra.favicon.android_chrome_512 %}
-      <link href='{{ config.extra.favicon.android_chrome_512 }}' rel="android-chrome" sizes="512x512" />
+      <link href='{{ config.extra.favicon.android_chrome_512 }}' rel="android-chrome" sizes="512x512"/>
       {% endif %}
       {% if config.extra.favicon.android_chrome_192 %}
-      <link href='{{ config.extra.favicon.android_chrome_192 }}' rel="android-chrome" sizes="192x192" />
+      <link href='{{ config.extra.favicon.android_chrome_192 }}' rel="android-chrome" sizes="192x192"/>
       {% endif %}
       {% if config.extra.favicon.apple_touch_icon %}
-      <link href='{{ config.extra.favicon.apple_touch_icon }}' rel="apple-touch-icon" sizes="180x180" />
+      <link href='{{ config.extra.favicon.apple_touch_icon }}' rel="apple-touch-icon" sizes="180x180"/>
       {% endif %}
       {% if config.extra.favicon.apple_touch_icon %}
-      <link href='{{ config.extra.favicon.apple_touch_icon }}' rel="apple-touch-icon" sizes="180x180" />
+      <link href='{{ config.extra.favicon.apple_touch_icon }}' rel="apple-touch-icon" sizes="180x180"/>
       {% endif %}
 
       <link href="/css/main.css" rel="stylesheet">
@@ -78,8 +78,8 @@
         </div>
         <div class="flex-1 flex items-center">
           <div class="flex-shrink-0 flex items-center ml-2">
-            <a href="/" class="logo dark:logo text-xl">
-              <img src="{{ get_url(path='godot-ferris.svg') }}" class="h-10 w-auto">
+            <a href="/" class="logo dark:logo text-xl" title="home">
+              <img src="{{ get_url(path='godot-ferris.svg') }}" class="h-10 w-auto" alt="godot-rust logo">
               <div class="ml-3 mr-2 relative top-px">
                 {{config.extra.navbar.title}}
               </div>
@@ -201,14 +201,14 @@
 
         <!-- Theme switch button -->
         <div class="flex flex-right">
-          <button id="switch-theme" type="button" class="body-background dark:body-background text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white p-1 rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white">
+          <button id="switch-theme" aria-label="Switch theme" type="button" class="body-background dark:body-background text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white p-1 rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white">
             <span class="sr-only">Switch Theme</span>
             <!-- Heroicon name: outline/light -->
-            <svg id="light" class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+            <svg id="light" aria-label="switch to light theme" class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
               <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"></path>
             </svg>
             <!-- Heroicon name: outline/dark -->
-            <svg id="dark" class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+            <svg id="dark" aria-label="switch to dark theme" class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
               <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"></path>
             </svg>
           </button>

From 3a02b65db4ec2338f2a2ed7c11a88cbf70194665 Mon Sep 17 00:00:00 2001
From: Jan Haller <bromeon@gmail.com>
Date: Sun, 7 May 2023 21:58:48 +0200
Subject: [PATCH 2/2] CSS Accessibility improvements

---
 website/src/css/main.css    | 11 ++++++-----
 website/static/css/main.css | 11 ++++++-----
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/website/src/css/main.css b/website/src/css/main.css
index 913cf8377998..f089731900b6 100644
--- a/website/src/css/main.css
+++ b/website/src/css/main.css
@@ -27,7 +27,7 @@
     --brown-body: rgb(217, 198, 190);
     --brown-hover: rgb(148, 122, 112);
     --brown-nav-current: rgb(140, 142, 143);
-    --brown-caption: rgb(117, 96, 78);
+    --brown-caption: rgb(107, 79, 51);
 
     --brown-nav-dark: rgb(61, 58, 55);
     --brown-body-dark: rgb(82, 79, 76);
@@ -85,11 +85,11 @@ html {
 }
 
 .markdown-content a {
-    color: var(--blue-hover);
+    color: var(--blue-hover-dark);
 }
 
 .markdown-content a:hover {
-    color: var(--blue-hover-dark);
+    color: var(--blue-hover);
 }
 
 :is(.dark .markdown-content a) {
@@ -248,8 +248,9 @@ html {
 }
 
 .text-footer {
-    --tw-text-opacity: .5;
-    color: rgb(0 0 0 / var(--tw-text-opacity));
+    /*--tw-text-opacity: .5;*/
+    /*color: rgb(0 0 0 / var(--tw-text-opacity));*/
+    color: var(--brown-caption);
 }
 
 /* --------------------------------------------------------------- */
diff --git a/website/static/css/main.css b/website/static/css/main.css
index b440e29a7407..61a6770fe186 100644
--- a/website/static/css/main.css
+++ b/website/static/css/main.css
@@ -24,7 +24,7 @@
   --brown-body: rgb(217, 198, 190);
   --brown-hover: rgb(148, 122, 112);
   --brown-nav-current: rgb(140, 142, 143);
-  --brown-caption: rgb(117, 96, 78);
+  --brown-caption: rgb(107, 79, 51);
   --brown-nav-dark: rgb(61, 58, 55);
   --brown-body-dark: rgb(82, 79, 76);
   --brown-hover-dark: rgb(117, 103, 91);
@@ -1495,11 +1495,11 @@ html {
 }
 
 .markdown-content a {
-  color: var(--blue-hover);
+  color: var(--blue-hover-dark);
 }
 
 .markdown-content a:hover {
-  color: var(--blue-hover-dark);
+  color: var(--blue-hover);
 }
 
 :is(.dark .markdown-content a) {
@@ -1673,8 +1673,9 @@ html {
 }
 
 .text-footer {
-  --tw-text-opacity: .5;
-  color: rgb(0 0 0 / var(--tw-text-opacity));
+  /*--tw-text-opacity: .5;*/
+  /*color: rgb(0 0 0 / var(--tw-text-opacity));*/
+  color: var(--brown-caption);
 }
 
 /* --------------------------------------------------------------- */