mode sombre

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;
+	}
+}

sass/css/clients.scss

@@ -59,3 +59,9 @@
 	color: $grey1;
 	float: right;
 }
+
+@media (prefers-color-scheme: dark) {
+	.client_box-sign {
+		color: $grey2;
+	}
+}

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);

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;
+	}
+}

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;
+	}
+}