From af51cc921eb0271bf82183b31ca54e91dbf045aa Mon Sep 17 00:00:00 2001
From: ericb <eric@hotsdesign.ch>
Date: Mon, 25 Nov 2024 17:51:50 +0100
Subject: [PATCH 1/2] Added WCAG buttons roles

---
 profile.html     |  8 ++++----
 tandem-list.html | 28 ++++++++++++++--------------
 2 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/profile.html b/profile.html
index f7f87c0..eccb334 100644
--- a/profile.html
+++ b/profile.html
@@ -19,12 +19,12 @@
                     <a class="navbar-brand" href="home.html">
                         <img src="static/img/logo/logo_e-tandem-Bilinguisme_FR.svg">
                     </a>
-                    <button id="menu-toggle" class="navbar-toggler border-0" type="button" data-bs-toggle="offcanvas" data-bs-target="#mainNav" aria-controls="mainNav" aria-label="Toggle main menu">
+                    <button type="button" id="menu-toggle" class="navbar-toggler border-0" type="button" data-bs-toggle="offcanvas" data-bs-target="#mainNav" aria-controls="mainNav" aria-label="Toggle main menu">
                         <span class="navbar-toggler-icon"></span>
                     </button>
                     <div class="offcanvas offcanvas-end" tabindex="-1" id="mainNav" aria-label="Main menu">
                         <div class="offcanvas-header">
-                            <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close main menu"></button>
+                            <button type="button" type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close main menu"></button>
                         </div>
                         <div class="offcanvas-body">
                             <ul class="navbar-nav">
@@ -78,7 +78,7 @@
                                 <div class="user-avatar">
                                     <img src="static/img/avatars/default-avatar.svg" class="img-fluid">
                                 </div>
-                                <button class="btn btn-cta">Télécharger une image</button>
+                                <button type="button" class="btn btn-cta">Télécharger une image</button>
                             </div>
                             <div id="user-profile-activation" class="col-auto rounded">
                                 <div class="form-check form-switch form-check-reverse">
@@ -400,7 +400,7 @@
                         </div>
                     </div>
                 </section>
-                <button class="btn btn-cta rounded w-100 py-3" type="submit">Sauvegarder les modifications</button>
+                <button type="button" class="btn btn-cta rounded w-100 py-3" type="submit">Sauvegarder les modifications</button>
             </form>
         </section>
     </main>
diff --git a/tandem-list.html b/tandem-list.html
index 459ef0b..924f857 100644
--- a/tandem-list.html
+++ b/tandem-list.html
@@ -19,12 +19,12 @@
                     <a class="navbar-brand" href="home.html">
                         <img src="static/img/logo/logo_e-tandem-Bilinguisme_FR.svg">
                     </a>
-                    <button id="menu-toggle" class="navbar-toggler border-0" type="button" data-bs-toggle="offcanvas" data-bs-target="#mainNav" aria-controls="mainNav" aria-label="Toggle main menu">
+                    <button type="button" id="menu-toggle" class="navbar-toggler border-0" type="button" data-bs-toggle="offcanvas" data-bs-target="#mainNav" aria-controls="mainNav" aria-label="Toggle main menu">
                         <span class="navbar-toggler-icon"></span>
                     </button>
                     <div class="offcanvas offcanvas-end" tabindex="-1" id="mainNav" aria-label="Main menu">
                         <div class="offcanvas-header">
-                            <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close main menu"></button>
+                            <button type="button" type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close main menu"></button>
                         </div>
                         <div class="offcanvas-body">
                             <div class="d-flex align-items-center gap-2 ms-auto">
@@ -63,37 +63,37 @@
                     <nav class="side-menu">
                         <ul class="nav flex-column mb-auto">
                             <li class="nav-item">
-                                <a href="#" class="nav-link active" aria-current="page">
+                                <a href="#" role="menuitem" class="nav-link active" aria-current="page">
                                     Rechercher des TANDEMs
                                 </a>
                             </li>
                             <li>
-                                <a href="#" class="nav-link">
+                                <a href="#" role="menuitem" class="nav-link">
                                     Mes TANDEMs
                                 </a>
                             </li>
                             <li>
-                                <a href="profile.html" class="nav-link">
+                                <a href="profile.html" role="menuitem" class="nav-link">
                                     Modifier mon profil
                                 </a>
                             </li>
                             <li>
-                                <a href="#" class="nav-link">
+                                <a href="#" role="menuitem" class="nav-link">
                                     Demandes reçues <span class="badge text-bg-secondary rounded-pill">101</span>
                                 </a>
                             </li>
                             <li>
-                                <a href="#" class="nav-link">
+                                <a href="#" role="menuitem" class="nav-link">
                                     Demandes envoyées
                                 </a>
                             </li>
                             <li>
-                                <a href="#" class="nav-link">
+                                <a href="#" role="menuitem" class="nav-link">
                                     Statistiques
                                 </a>
                             </li>
                             <li>
-                                <a href="#" class="nav-link">
+                                <a href="#" role="menuitem" class="nav-link">
                                     Espace documentaire
                                 </a>
                             </li>
@@ -152,7 +152,7 @@
                     </nav> -->
                 </div>
 
-                <section id="tandem-list" class="col-md-9 my-5">
+                <section id="tandem-list" class="col-md-8 my-5">
 
                     <form id="search-filters">
                         <!-- Ajax form submit -->
@@ -282,8 +282,8 @@
                                     </div>
                                 </div>
                                 <div class="profile-options">
-                                    <button class="btn btn-cta rounded">Proposer un TANDEM</button>
-                                    <button class="btn btn-link">Signaler ce profil inapproprié</button>
+                                    <button type="button" class="btn btn-cta rounded">Proposer un TANDEM</button>
+                                    <button type="button" class="btn btn-link">Signaler ce profil inapproprié</button>
                                 </div>
                             </div>
                         </div>
@@ -343,8 +343,8 @@
                                     </div>
                                 </div>
                                 <div class="profile-options">
-                                    <button class="btn btn-cta rounded">Proposer un TANDEM</button>
-                                    <button class="btn btn-link">Signaler ce profil inapproprié</button>
+                                    <button type="button" class="btn btn-cta rounded">Proposer un TANDEM</button>
+                                    <button type="button" class="btn btn-link">Signaler ce profil inapproprié</button>
                                 </div>
                             </div>
                         </div>

From 1cbde50ab8e1667ca1b174b860c31e6523c4a9eb Mon Sep 17 00:00:00 2001
From: ericb <eric@hotsdesign.ch>
Date: Mon, 25 Nov 2024 17:52:08 +0100
Subject: [PATCH 2/2] Minor color tweaks

---
 static/css/main.css | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/static/css/main.css b/static/css/main.css
index 0ce80fd..2b5abd5 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -30,6 +30,7 @@ body {
   --accent-light: hsl(var(--accent), 75%);
   --bs-btn-active-color: var(--grau);
   --bs-btn-active-border-color: var(--grau);
+  --bs-btn-hover-bg: #f28705;
   --bs-link-color: #f28705;
   --top-bar: 98px;
   --bottom-bar: 5em;
@@ -73,9 +74,9 @@ body {
 }
 .side-menu .nav-link{
   color: black;
+  padding: 0.725rem 1rem;
 }
 .side-menu .nav-link:active, .side-menu .nav-link.active{
-  color: white;
   background-color: #f28705;
   font-weight: 700;
 }
@@ -220,6 +221,7 @@ article li:not(:first-of-type){
   margin-top: 2em;
   justify-content: end;
   display: flex;
+  gap: 1rem;
 }
 
 /* search filters */
@@ -375,10 +377,10 @@ footer a img{
     text-align: center;
   }
   .profile-options{
-    display:grid;
-    gap: 0 1rem;
+    display: grid;
+    gap: 0 .5rem;
 	  width: fit-content;
-	  margin: calc(var(--div-padding) / 2) auto 0;
+	  margin: calc(var(--div-padding) / 1.25) auto 0;
   }
 }
 @media (576px <= width <= 992px) {