couleurs sombre NoK et hidden mal mis

static/css/bidouille.css

@@ -13,55 +13,49 @@
  *
  * Les couleurs sont définies en tant que variables sous la forme
    --nom: contenu;
- * Elles sont appelables dans les régles css sous la forme 
+ * Elles sont appelables dans les règles css sous la forme 
    var(--nom)
  *
  * Cela facilite le changement de couleur pour « tout le site » en quelques corrections.
  * Merci de préférer travailler avec des couleurs sous forme de variable telles que les 4 ci-dessous.
  *
  * Quelques Jeux de couleurs sont proposer pour … jouer avec :).
- * Si tous les Jeux de coudeurs mis en commentaire, le site sera en noir&blanc.
+ * Si tous les Jeux de couleurs sont mis en commentaire, le site sera en noir&blanc.
- * Mais le menu sera moche en 
+ * Mais le menu sera moche lorsqu'on fait défiler le contenu parce qu'il n'aura pas de couleur de fond.
+ *
+ * La fonction color-mix, qui est utilisée dans ce CSS est récente (2023). 
+ * Elle pourrait ne pas fonctionner sur des anciens navigateurs web.
+ *
 */
 
 /* Jeu de couleur de base
 * Celui-ci n'étant pas commenté, c'est le jeu de base utilisé pour le site.
 */
- :root {
-     --fond: #EEE;
-     --primaire: #222;
-     --liens: #fe1976;
-     --deco: #96D321;
-    }
-    
-/* Jeu de couleur de base mais inversé
- * Commentez les autres jeux de couleur sauf celui-ci pour l'utiliser.
 :root {
-    --fond: #222;
+    --fond: #EEE;
-    --primaire: #EEE;
+    --primaire: #222;
-    --liens: #96D321;
+    --liens: #fe1976;
-    --deco: #fe1976;
+    --deco: #96D321;
 }
-*/
+    
-
 /* Jeu de couleurs « Belgique »
  * Commentez les autres jeux de couleur sauf celui-ci pour l'utiliser.
-:root {
+ :root {
-    --fond: black;
+     --fond: white;
-    --primaire: white;
+     --primaire: black;
-    --liens: gold;
+     --liens: gold;
-    --deco: red;
+     --deco: red;
-}
+    }
-*/
+    */
 
 /* Jeu de couleurs « Europe »
  * Commentez les autres jeux de couleur sauf celui-ci pour l'utiliser.
  :root {
      --fond: white;
      --primaire: #039;
-    --liens: rgb(18, 116, 207);
+     --liens: rgb(18, 116, 207);
-    --deco: #FC0;
+     --deco: #FC0;
-}
+    }
 */
 
 /* Expériences
@@ -395,7 +389,6 @@ th {
 
 tr:nth-child(even) {
     /* Pour colorer différemment une ligne sur deux (even)
-     * La fonction color-mix est récente (2023) en CSS et pourrait ne pas fonctionner sur des anciens navigateurs web.
     */
     background-color: color-mix(in srgb, var(--primaire) 20%, var(--fond));
 }
@@ -403,14 +396,17 @@ tr:nth-child(even) {
 /* Coloration du code (highlight)
  * voir aussi le fichier highlight.css
 */
-article p code {
+code:not(div.highlight code) {
     /* Pour que, dans le texte, le code soit de couleur et de fond différent.
      * Mais PAS pour la class .highlight qui contiendra du code sur plusieurs lignes,
      * et qui utilise la coloration syntaxique définie dans le fichier highlight.css.
     */
-    background-color: var(--primaire);
+    background-color: color-mix(in srgb, var(--primaire) 10%, var(--fond));
-    color: var(--fond);
+    border: solid var(--deco);
-    padding: .3em;
+    border-width: .1em;
+    border-radius: .3em;
+    padding: .2em .4em;
+    font-weight: bold;
 }
 
 

templates/listing.html

@@ -23,20 +23,20 @@
 <nav class="pagination">
   <a href="{{ SITEURL }}/{{ first_page.url }}" 
     {%- if articles_page.has_previous() %}
-    {%- else %}class="hidden"{% endif %}>
+    {%- else %} class="hidden"{% endif %}>
     <i class="fa fa-angle-double-left"></i></a>
   <a href="{{ SITEURL }}/{{ articles_previous_page.url }}"
     {%- if articles_page.has_previous() %}
-    {%- else %}class="hidden"{% endif %}>
+    {%- else %} class="hidden"{% endif %}>
     <i class="fa fa-angle-left"></i></a>
   <p><strong>{{ category }}{{ tag }}</strong> | {{ articles_page.number }} de {{ articles_paginator.num_pages }}</p>
   <a href="{{ SITEURL }}/{{ articles_next_page.url }}"
   {%- if articles_page.has_next() %}
-  {%- else %}class="hidden"{% endif %}>
+  {%- else %} class="hidden"{% endif %}>
   <i class="fa fa-angle-right"></i></a>
   <a href="{{ SITEURL }}/{{ last_page.url }}"
   {%- if articles_page.has_next() %}
-  {%- else %}class="hidden"{% endif %}>
+  {%- else %} class="hidden"{% endif %}>
   <i class="fa fa-angle-double-right"></i></a>
 </nav>
 {% endif %}