From 7db78bd2b3e18cc936198a80955e235401027058 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pascal=20Eng=C3=A9libert?= <tuxmain@zettascript.org>
Date: Wed, 26 Apr 2023 18:58:04 +0200
Subject: [PATCH] mode sombre

---
 content/_index.md                   |   2 ++
 sass/css/base.scss                  |  25 +++++++++++++++++++++----
 sass/css/clients.scss               |   6 ++++++
 sass/css/defs.scss                  |   1 +
 sass/css/header.scss                |   6 ++++++
 sass/css/services.scss              |   6 ++++++
 static/img/librezo-little-white.png | Bin 0 -> 2291 bytes
 templates/base.html                 |   9 ++++++++-
 8 files changed, 50 insertions(+), 5 deletions(-)
 create mode 100644 static/img/librezo-little-white.png

diff --git a/content/_index.md b/content/_index.md
index cba7d94..ef149e8 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -71,6 +71,8 @@ leaflet = 1
 
 </div>
 
+## On est là
+
 {% map() %}
 [42.6998, 9.4518], // Bastia
 [44.4742, 1.8296], // Cajarc
diff --git a/sass/css/base.scss b/sass/css/base.scss
index 0e01b40..cb2b8d6 100644
--- a/sass/css/base.scss
+++ b/sass/css/base.scss
@@ -30,10 +30,6 @@ html, body {
 	font-family: LunaSans;
 }
 
-body {
-	background: radial-gradient(circle at 100%, rgba(2, 148, 217, 0.2) 20%, white);
-}
-
 main {
 	width: 100%;
 	font-size: 18px;
@@ -162,3 +158,24 @@ h3 {
 	height: 600px;
 	max-height: calc(100vh - 64px);
 }
+
+@media (prefers-color-scheme: light), (prefers-color-scheme: no-preference) {
+	html {
+		background: radial-gradient(circle at 100%, rgba(2, 148, 217, 0.2) 20%, white);
+	}
+}
+
+@media (prefers-color-scheme: dark) {
+	html {
+		background-color: black;
+		color: white;
+	}
+	
+	#dev-warning {
+		color: black;
+	}
+	
+	.cities {
+		color: $grey2;
+	}
+}
diff --git a/sass/css/clients.scss b/sass/css/clients.scss
index 2cd3a87..0478fe5 100644
--- a/sass/css/clients.scss
+++ b/sass/css/clients.scss
@@ -59,3 +59,9 @@
 	color: $grey1;
 	float: right;
 }
+
+@media (prefers-color-scheme: dark) {
+	.client_box-sign {
+		color: $grey2;
+	}
+}
diff --git a/sass/css/defs.scss b/sass/css/defs.scss
index 6a5e513..1b62b51 100644
--- a/sass/css/defs.scss
+++ b/sass/css/defs.scss
@@ -1,6 +1,7 @@
 $blue: #0294d9;
 $violet: #ac44ff;
 $grey1: #444;
+$grey2: #bbb;
 
 $grad1_3tr: rgba(2, 148, 217, 0.2);
 $grad2_3tr: rgba(87, 108, 236, 0.2);
diff --git a/sass/css/header.scss b/sass/css/header.scss
index 62ce088..e8b8d78 100644
--- a/sass/css/header.scss
+++ b/sass/css/header.scss
@@ -37,3 +37,9 @@ header {
 	text-shadow: 1px 2px 1px $violet;
 	text-decoration: none;
 }
+
+@media (prefers-color-scheme: dark) {
+	#header-menu a {
+		color: white;
+	}
+}
diff --git a/sass/css/services.scss b/sass/css/services.scss
index 9c8b70a..114151d 100644
--- a/sass/css/services.scss
+++ b/sass/css/services.scss
@@ -68,3 +68,9 @@
 	padding-bottom: 14px;
 	font-size: 24px;
 }
+
+@media (prefers-color-scheme: dark) {
+	.service_box-link, .service_box-link:visited {
+		color: white;
+	}
+}
diff --git a/static/img/librezo-little-white.png b/static/img/librezo-little-white.png
new file mode 100644
index 0000000000000000000000000000000000000000..c75fcf8c4589c51658ca22bd8103d441144da639
GIT binary patch
literal 2291
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
N002ovPDHLkV1lh*EWH2#

literal 0
HcmV?d00001

diff --git a/templates/base.html b/templates/base.html
index aaae616..797ac39 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -19,7 +19,14 @@
 			<a href="#" onclick="document.getElementById('dev-warning').remove()">fermer</a>
 		</div>
 		<header>
-			<a href="/"><img id="header-logo" src="/img/librezo-little-black.png" alt="Logo Librezo" aria-hidden/><h1 class="sr-only">Librezo</h1></a>
+			<a href="/">
+				<picture>
+					<source srcset="/img/librezo-little-white.png" media="(prefers-color-scheme: dark)" />
+					<source srcset="/img/librezo-little-black.png" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" />
+					<img decoding="async" id="header-logo" src="/img/librezo-little-black.png" alt="Librezo" aria-hidden/>
+			  </picture>
+			  <h1 class="sr-only">Librezo</h1>
+			</a>
 			<nav id="header-menu">
 				<ul>
 					<li><a href="/fonctionnement">Fonctionnement</a></li>