style: better a11y for dark mode homepage gradient

blurry-dev · Dec 31, 2024 · bec98ba · bec98ba
1 parent e5dd2ac
commit bec98ba
Showing 1 changed file with 9 additions and 1 deletion.
diff --git a/docs/templates/WebSite.html.jinja b/docs/templates/WebSite.html.jinja
@@ -36,14 +36,22 @@ h1 {
   max-width: 900px;
   font-size: 3rem;
   text-align: center;
-  background: linear-gradient(to right,rgb(201, 190, 99),rgb(168, 157, 56),rgb(172, 156, 64),rgb(130, 117, 46));
+  background: linear-gradient(to right,rgb(201, 190, 99),rgb(168, 157, 56),rgb(153, 137, 47),rgb(104, 93, 29));
   -webkit-background-clip: text;
   background-clip: text;
   color: transparent;
   margin: auto;
   padding: 0.5rem 0;
 }
 
+@media(prefers-color-scheme: dark) {
+  h1 {
+    background: linear-gradient(to right,rgb(243, 236, 176),rgb(216, 207, 130),rgb(204, 195, 112),rgb(122, 113, 30));
+    -webkit-background-clip: text;
+    background-clip: text;
+  }
+}
+
 main > pre {
   max-width: 650px;
   margin: calc(var(--pico-spacing) * 3) auto;