couleurs sombre NoK et hidden mal mis

This commit is contained in:
Thierry Fenasse 2024-04-02 17:37:09 +02:00
parent bc0e9ad644
commit aaf65e6a3c
Signed by: tfenasse
GPG Key ID: 56BF2A3A07DDEB1F
2 changed files with 33 additions and 37 deletions

View File

@ -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.
* Mais le menu sera moche en
* Si tous les Jeux de couleurs sont mis en commentaire, le site sera en noir&blanc.
* 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;
--primaire: #EEE;
--liens: #96D321;
--deco: #fe1976;
--fond: #EEE;
--primaire: #222;
--liens: #fe1976;
--deco: #96D321;
}
*/
/* Jeu de couleurs « Belgique »
* Commentez les autres jeux de couleur sauf celui-ci pour l'utiliser.
:root {
--fond: black;
--primaire: white;
--liens: gold;
--deco: red;
}
*/
:root {
--fond: white;
--primaire: black;
--liens: gold;
--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);
--deco: #FC0;
}
--liens: rgb(18, 116, 207);
--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);
color: var(--fond);
padding: .3em;
background-color: color-mix(in srgb, var(--primaire) 10%, var(--fond));
border: solid var(--deco);
border-width: .1em;
border-radius: .3em;
padding: .2em .4em;
font-weight: bold;
}

View File

@ -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 %}