fmaury/seirdy.one
1
0
Fork 0
mirror of https://git.sr.ht/~seirdy/seirdy.one synced 2024-11-23 21:02:09 +00:00
Code Issues Projects Releases Wiki Activity

Dark palette: reduce excessively harsh contrast

Browse source 
Use excessively harsh colors in response to a "prefers-contrast: more"
media query, but otherwise use something a bit softer to accommodate
overstimulation.
This commit is contained in:
Rohan Kumar 2022-05-23 08:54:06 -07:00
parent e03b892166
commit 972e025aa3
No known key found for this signature in database
GPG key ID: 1E892DB2A5F84479
2 changed files with 18 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
assets/css/dark.css
View file

@ -6,17 +6,19 @@
html {
/* Pure white on black causes halation.
* "background" is short for a bunch of unnecessary CSS rules
* background-color is all I need */
background-color: #141414;
* background-color is all I need.
* This is the brightest background that still achieves an APCA
* contrast of 90 Lc.*/
background-color: #1a1919;
/* Dimming the default text color is not the same as reducing screen
* brightness, since other colors in this stylesheet have brighter
* red and blue channels than the default text. */
color: #e9e9e9;
color: #e6e6e6;
}
/* Only color <a> if it's a link; if href is empty, let it be. */
a:link {
color: #f1e7b2;
color: #eee7b2;
}
a:active {
@ -24,7 +26,13 @@
}
a:visited {
color: #ffd9ff;
color: #ffdaff;
}
@media (prefers-contrast: less) {
html {
background-color: #333;
}
}
/* Small text needs higher contrast. */
@ -38,9 +46,11 @@
}
}
@media (prefers-contrast: less) {
@media (prefers-contrast: more) {
html {
background-color: #333;
background-color: #111;
color: #eee;
}
}
}

3
assets/css/main.css
View file

@ -169,7 +169,7 @@ ul ul {
/* Step 1 to making the single-line nav: remove the bullet padding. */
nav ul {
padding: 0
padding: 0;
}
/* step 2: remove bullets and make elements inline.
@ -181,7 +181,6 @@ nav ul li {
margin-right: .375em;
}
/* narrow screens: reduce margin for blockquotes a lot, using
* a border instead. Put it on the left and right to make it
* LTR/RTL-neutral, for machine translators that change text