From 87959c31de8f3fda58c1b54a4468619c3d6462a1 Mon Sep 17 00:00:00 2001 From: Marco Janotta Date: Sun, 28 Mar 2021 15:38:24 +0200 Subject: [PATCH] Add dark color scheme --- static/grapheneos.css | 36 ++++++++++++++++++++++++++++++++++++ 1 file changed, 36 insertions(+) diff --git a/static/grapheneos.css b/static/grapheneos.css index 8d5ec16a..dec5f69d 100644 --- a/static/grapheneos.css +++ b/static/grapheneos.css @@ -204,3 +204,39 @@ footer a, footer a:visited { src: local('Roboto Mono Bold'), local('RobotoMono-Bold'), url(/fonts/robotomono-v13-bold-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } + +@media (prefers-color-scheme: dark) { + body { + background: #121212; + color: rgba(255, 255, 255, 0.87); /* 87% white */ + } + + a { + color: #90caf9; /* blue200 */ + } + + a:visited { + color: #ce93d8; /* purple200 */ + } + + h1 a, h1 a:visited, h2 a, h2 a:visited, h3 a, h3 a:visited, h4 a, h4 a:visited, h5 a, h5 a:visited, h6 a, h6 a:visited { + color: rgba(255, 255, 255, 0.87); /* 87% white */ + } + + code, pre { + background-color: #424242; /* grey800 */ + } + + footer a, footer a:visited { + color: #9f9f9f; + } + + footer img { + filter: invert(87%); + } + + .error-text { + /* Baseline Material dark error color */ + color: #cf6679; + } +}