feat: add aria-labels to mobile menu for accessibility.

Author: Nde-Code

js/app.js

@@ -97,7 +97,7 @@ function getNotesTemplate() {
 
                 <h2>Licence:</h2>
 
-                <p class="modalbox-description">Bien que je ne voie pas trop l'intérêt de reprendre l'intégralité du code de mon site pour le réutiliser tel quel, j'ai tout de même décidé de le placer sous <span class="color-green">une licence permissive</span> mais <span class="color-red">pas trop non plus</span> (ça reste à la base un site personnel, entièrement codé à la main, sans aucun outil). Si vous souhaitez simplement <span class="color-green">reprendre quelques morceaux de code ou des éléments de style</span>, pas de souci. En revanche, pour <span class="color-red">une réutilisation plus large ou complète</span>, merci de me contacter au préalable pour qu'on en discute. Voici la licence: </p>
+                <p class="modalbox-description">Bien que je ne voie pas trop l'intérêt de reprendre l'intégralité du code de mon site pour le réutiliser tel quel, j'ai tout de même décidé de le placer sous <span class="color-green alone-bold">une licence permissive</span> mais <span class="color-red alone-bold">pas trop non plus</span> (ça reste à la base un site personnel, entièrement codé à la main, sans aucun outil). Si vous souhaitez simplement <span class="color-green alone-bold">reprendre quelques morceaux de code ou des éléments de style</span>, pas de souci. En revanche, pour <span class="color-red alone-bold">une réutilisation plus large ou complète</span>, merci de me contacter au préalable pour qu'on en discute. Voici la licence: </p>
                     
                 <p class="modalbox-description"><i class="fa-solid fa-square point"></i> <strong>GNU General Public License v3.0:</strong> consultez le dépôt GitHub du projet pour en savoir plus sur cette licence.</p>
                 
@@ -180,6 +180,10 @@ $(document).ready(function () {
 
             $this.html('<i class="fa-solid fa-xmark"></i>');
 
+            $this.attr('aria-label', 'Fermer le menu');
+
+            $this.attr('aria-expanded', 'true');
+
         }
 
         else {
@@ -190,6 +194,10 @@ $(document).ready(function () {
 
             $this.html('<i class="fa-solid fa-bars"></i>');
 
+            $this.attr('aria-label', 'Ouvrir le menu');
+
+            $this.attr('aria-expanded', 'false');
+
         }
 
     });

online/foucault.html

@@ -348,7 +348,7 @@ <h2>Notes:</h2>
 
 					<p class="modalbox-description"><i class="fa-solid fa-square point"></i> Le logiciel refusera les latitudes comprises entre -10 et 10 degrés, car l'installation d'un pendule de Foucault près de l'équateur est inutile. </p>
 
-					<p class="modalbox-description"><i class="fa-solid fa-square point"></i> Si la latitude saisie ne fonctionne pas, vérifiez que vous avez bien utilisé un point comme séparateur décimal, et non une virgule. Exemple: <span class="color-red">48,85</span> mais <span class="color-green">48.85</span>. </p>
+					<p class="modalbox-description"><i class="fa-solid fa-square point"></i> Si la latitude saisie ne fonctionne pas, vérifiez que vous avez bien utilisé un point comme séparateur décimal, et non une virgule. Exemple: <span class="color-red alone-bold">48,85</span> mais <span class="color-green alone-bold">48.85</span>. </p>
 
 				</div>
 

style.css

@@ -339,7 +339,7 @@ h1.website-main-panel-title {
 }
 
 div.social-media {
-    padding: 15px 30px;
+    padding: 10px 30px;
     cursor: default;
 }