diff options
Diffstat (limited to 'css/variables.css')
-rw-r--r-- | css/variables.css | 36 |
1 files changed, 33 insertions, 3 deletions
diff --git a/css/variables.css b/css/variables.css index 0da55e8..12d1db7 100644 --- a/css/variables.css +++ b/css/variables.css @@ -56,6 +56,11 @@ --search-mark-bg: #e3b171; --color-scheme: dark; + + /* Same as `--icons` */ + --copy-button-filter: invert(45%) sepia(6%) saturate(621%) hue-rotate(198deg) brightness(99%) contrast(85%); + /* Same as `--sidebar-active` */ + --copy-button-filter-hover: invert(68%) sepia(55%) saturate(531%) hue-rotate(341deg) brightness(104%) contrast(101%); } .coal { @@ -100,9 +105,14 @@ --search-mark-bg: #355c7d; --color-scheme: dark; + + /* Same as `--icons` */ + --copy-button-filter: invert(26%) sepia(8%) saturate(575%) hue-rotate(169deg) brightness(87%) contrast(82%); + /* Same as `--sidebar-active` */ + --copy-button-filter-hover: invert(36%) sepia(70%) saturate(503%) hue-rotate(167deg) brightness(98%) contrast(89%); } -.light { +.light, html:not(.js) { --bg: hsl(0, 0%, 100%); --fg: hsl(0, 0%, 0%); @@ -144,6 +154,11 @@ --search-mark-bg: #a2cff5; --color-scheme: light; + + /* Same as `--icons` */ + --copy-button-filter: invert(45.49%); + /* Same as `--sidebar-active` */ + --copy-button-filter-hover: invert(14%) sepia(93%) saturate(4250%) hue-rotate(243deg) brightness(99%) contrast(130%); } .navy { @@ -188,6 +203,11 @@ --search-mark-bg: #a2cff5; --color-scheme: dark; + + /* Same as `--icons` */ + --copy-button-filter: invert(51%) sepia(10%) saturate(393%) hue-rotate(198deg) brightness(86%) contrast(87%); + /* Same as `--sidebar-active` */ + --copy-button-filter-hover: invert(46%) sepia(20%) saturate(1537%) hue-rotate(156deg) brightness(85%) contrast(90%); } .rust { @@ -231,11 +251,14 @@ --searchresults-li-bg: #dec2a2; --search-mark-bg: #e69f67; - --color-scheme: light; + /* Same as `--icons` */ + --copy-button-filter: invert(51%) sepia(10%) saturate(393%) hue-rotate(198deg) brightness(86%) contrast(87%); + /* Same as `--sidebar-active` */ + --copy-button-filter-hover: invert(77%) sepia(16%) saturate(1798%) hue-rotate(328deg) brightness(98%) contrast(83%); } @media (prefers-color-scheme: dark) { - .light.no-js { + html:not(.js) { --bg: hsl(200, 7%, 8%); --fg: #98a3ad; @@ -275,5 +298,12 @@ --searchresults-border-color: #98a3ad; --searchresults-li-bg: #2b2b2f; --search-mark-bg: #355c7d; + + --color-scheme: dark; + + /* Same as `--icons` */ + --copy-button-filter: invert(26%) sepia(8%) saturate(575%) hue-rotate(169deg) brightness(87%) contrast(82%); + /* Same as `--sidebar-active` */ + --copy-button-filter-hover: invert(36%) sepia(70%) saturate(503%) hue-rotate(167deg) brightness(98%) contrast(89%); } } |