diff options
author | EuAndreh <eu@euandre.org> | 2021-08-20 12:32:57 -0300 |
---|---|---|
committer | EuAndreh <eu@euandre.org> | 2021-08-20 12:42:28 -0300 |
commit | 580259c41b653d72e96f6bb941565a0df5c9ac1f (patch) | |
tree | 5bcf6c4efea91ac7267adc3cf64f0e3cf559fd7d /tests/resources | |
parent | Makefile: Generate build samples before running the tests (diff) | |
download | gistatic-580259c41b653d72e96f6bb941565a0df5c9ac1f.tar.gz gistatic-580259c41b653d72e96f6bb941565a0df5c9ac1f.tar.xz |
src/gistatic.c: Add dark mode CSS media query
Diffstat (limited to 'tests/resources')
-rw-r--r-- | tests/resources/assets/repo/style.css | 44 | ||||
-rw-r--r-- | tests/resources/assets/style.css | 44 |
2 files changed, 78 insertions, 10 deletions
diff --git a/tests/resources/assets/repo/style.css b/tests/resources/assets/repo/style.css index f2cad9d..6a5a4e2 100644 --- a/tests/resources/assets/repo/style.css +++ b/tests/resources/assets/repo/style.css @@ -1,3 +1,37 @@ +:root { + --color: black; + --background-color: white; + --hover-color: hsl(0, 0%, 93%); + --nav-color: hsl(0, 0%, 87%); +} + +@media(prefers-color-scheme: dark) { + :root { + --color: white; + --background-color: black; + --hover-color: hsl(0, 0%, 7%); + --nav-color: hsl(0, 0%, 13%); + } + + body { + color: var(--color); + background-color: var(--background-color); + } + + a { + color: hsl(211, 100%, 60%); + } + + a:visited { + color: hsl(242, 100%, 80%); + } + + .logo { + color: white; + + } +} + body { font-family: monospace; max-width: 1100px; @@ -34,19 +68,19 @@ nav li { margin-left: 10px; } -nav a { +nav a, nav a:visited { padding: 2px 8px 0px 8px; - color: black; + color: var(--color); } .selected-nav-item { - background-color: hsl(0, 0%, 87%); + background-color: var(--nav-color); } hr { margin-top: 0; border: 0; - border-top: 3px solid hsl(0, 0%, 87%); + border-top: 3px solid var(--nav-color); } table { @@ -58,7 +92,7 @@ th { } tbody tr:hover { - background-color: hsl(0, 0%, 93%); + background-color: var(--hover-color); } td { diff --git a/tests/resources/assets/style.css b/tests/resources/assets/style.css index f2cad9d..6a5a4e2 100644 --- a/tests/resources/assets/style.css +++ b/tests/resources/assets/style.css @@ -1,3 +1,37 @@ +:root { + --color: black; + --background-color: white; + --hover-color: hsl(0, 0%, 93%); + --nav-color: hsl(0, 0%, 87%); +} + +@media(prefers-color-scheme: dark) { + :root { + --color: white; + --background-color: black; + --hover-color: hsl(0, 0%, 7%); + --nav-color: hsl(0, 0%, 13%); + } + + body { + color: var(--color); + background-color: var(--background-color); + } + + a { + color: hsl(211, 100%, 60%); + } + + a:visited { + color: hsl(242, 100%, 80%); + } + + .logo { + color: white; + + } +} + body { font-family: monospace; max-width: 1100px; @@ -34,19 +68,19 @@ nav li { margin-left: 10px; } -nav a { +nav a, nav a:visited { padding: 2px 8px 0px 8px; - color: black; + color: var(--color); } .selected-nav-item { - background-color: hsl(0, 0%, 87%); + background-color: var(--nav-color); } hr { margin-top: 0; border: 0; - border-top: 3px solid hsl(0, 0%, 87%); + border-top: 3px solid var(--nav-color); } table { @@ -58,7 +92,7 @@ th { } tbody tr:hover { - background-color: hsl(0, 0%, 93%); + background-color: var(--hover-color); } td { |