tabindex, style :focus et bug associés pour accesibilité clavier (et visuelle au passage)

affiches/mardis/index.html

@@ -36,13 +36,14 @@
             align-items: flex-start;
             justify-content: flex-start;
             background-color: var(--mardi-main-color);
+            filter: none !important;
 
                @container( width > 650px ){
                     flex-direction: row;
                 }
         }
 
-            
+
 
                     #imgContainer{
                         display: flex;
@@ -55,7 +56,7 @@
                         box-sizing: border-box;
                         overflow: hidden;
                         gap: 3.33px;
-                        padding-top: 3.33px;
+                        padding-top: 0;
 
                         img{
                             max-width: 34%;
@@ -101,7 +102,7 @@
         }
 
 
-     
+
     </style>
 </head>
 <body>
@@ -109,16 +110,16 @@
         <div id="imgContainer">
             <img src="/affiches/mardis/IMG001.jpg" alt="une lampe d'atelier sur un grand plan de travail un peu désorganisé, quelques chaises un peu disparates, on distingue un empilement de caisses et cartons à l'arrière plan">
             <img src="/affiches/mardis/IMG002.jpg" alt="un coin atelier bien équipé et éclairé, beaucoup d'outils, une échelle au bord du cadre, et  on aperçoit un espace avec un ordinateur sur une mezzanine, éclairé d'une lumière rouge vive">
-            <img src="/affiches/mardis/IMG333.jpg" alt="un grand espace de rangement très haut et plutôt ajouré décorée d'un dessin de poulpe rose fluo, qui contient des outils divers, éclairé d'un néon bleu pâle">   
+            <img src="/affiches/mardis/IMG333.jpg" alt="un grand espace de rangement très haut et plutôt ajouré décorée d'un dessin de poulpe rose fluo, qui contient des outils divers, éclairé d'un néon bleu pâle">
         </div>
-        
+
         <div id="textContainer" property="description">
             <h4 property="name">Permanences du LOL</h1>
 
                 <p>Venez chiller avec nous, partager un thé ou une bière.</p>
 
                 <p>On échange technique et savoir-faire<br>sur tous les sujets : logiciel libre, hacking,<br> couture, bricole et bidouille en tout genre,<br> mais aussi sur nos projets personnels ou collectifs</p>
-            
+
 
             <p class="event-hours">
                 <span property="eventSchedule" typeof="Schedule">
@@ -133,4 +134,4 @@
         </div>
     </article>
 </body>
-</html>
+</html>