testing variables in rgba

[gitweb-theme-danix.git] / gitweb-danixland / gitweb.css

diff --git a/gitweb-danixland/gitweb.css b/gitweb-danixland/gitweb.css
index 2e92d91..c8b4945 100644 (file)
--- a/gitweb-danixland/gitweb.css
+++ b/gitweb-danixland/gitweb.css
@@ -41,6 +41,24 @@ table {
 
 a { outline: none; }
 
+/* Colors
+------------------------------------------------------------------------- */
+:root {
+  --bg: #D8D9CF;
+  --bg-alt: #F0EEED;
+  --fg: #393E46;
+  --link: #CF4DCE;
+  --border: 34,40,49,0.035;
+}
+@media screen and (prefers-color-scheme: dark) {
+  :root {
+    --bg: #393E46;
+    --bg-alt: #222831;
+    --fg: #D8D9CF;
+    --border: 216,217,207,0.2;
+  }
+}
+
 
 /* General - light theme
 ---------------------------------------------------------------------------- */
@@ -54,8 +72,8 @@ body {
   font: 13px Helvetica,arial,freesans,clean,sans-serif;
   line-height: 1.4;
   margin: 0 0 105px;
-  background-color: #fff;
-  color: #000000;
+  background-color: var(--bg);
+  color: var(--fg);
 }
 
 /* Monospaced Fonts */
@@ -64,7 +82,7 @@ body {
 }
 
 a:link, a:visited {
-  color: #4183C4;
+  color: var(--link);
   text-decoration: none;
 }
 
@@ -121,12 +139,11 @@ td, th {
   margin-bottom: 20px;
   font-size: 20px;
   font-family: Helvetica, Arial, Freesans, Clean, sans-serif;
-  background: #FFFFFF; /* old browsers */
-  background: -moz-linear-gradient(top, #FFFFFF 0%, #F5F5F5 100%); /* firefox */
-  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(100%,#F5F5F5)); /* webkit */
-  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#F5F5F5',GradientType=0 ); /* ie */
-  background: -o-linear-gradient(top, #FFFFFF 0%, #F5F5F5 100%);
-  border-bottom: 1px solid #dfdfdf;
+  background: var(--bg); /* old browsers */
+  background: -moz-linear-gradient(top, var(--bg) 0%, var(--bg-alt) 100%); /* firefox */
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,var(--bg)), color-stop(100%,var(--bg-alt))); /* webkit */
+  background: -o-linear-gradient(top, var(--bg) 0%, var(--bg-alt) 100%);
+  border-bottom: 1px solid rgba(var(--border));
 }
 
 .page_header a:link, .page_header a:visited {
@@ -763,12 +780,3 @@ td.pre, div.pre, div.diff {
 .kwc    { color:#d4663d; }
 .kwd    { color:#2928ff; }
 
-
-@media screen and (prefers-color-scheme: dark) {
-/* General - dark theme
----------------------------------------------------------------------------- */
-  body {
-    background-color: #303030;
-    color: #e2e2e2;
-  }
-}