}\r
\r
&:after {\r
- background-color: transparentize(_palette(bg), 0.75);\r
+ background-color: transparentize(_palette_light(bg), 0.75);\r
content: '';\r
display: block;\r
height: 100%;\r
top: 0;\r
width: 100%;\r
z-index: 1;\r
+ @media screen and (prefers-color-scheme: dark) {\r
+ background-color: transparentize(_palette_dark(bg), 0.75);\r
+ }\r
}\r
\r
&:hover {\r
\r
&:nth-child(6n - 5) {\r
&:before {\r
- background-color: _palette(accent1);\r
+ background-color: _palette_light(accent1);\r
+ @media screen and (prefers-color-scheme: dark) {\r
+ background-color: _palette_dark(accent1);\r
+ }\r
}\r
}\r
\r
&:nth-child(6n - 4) {\r
&:before {\r
- background-color: _palette(accent2);\r
+ background-color: _palette_light(accent2);\r
+ @media screen and (prefers-color-scheme: dark) {\r
+ background-color: _palette_dark(accent2);\r
+ }\r
}\r
}\r
\r
&:nth-child(6n - 3) {\r
&:before {\r
- background-color: _palette(accent3);\r
+ background-color: _palette_light(accent3);\r
+ @media screen and (prefers-color-scheme: dark) {\r
+ background-color: _palette_dark(accent3);\r
+ }\r
}\r
}\r
\r
&:nth-child(6n - 2) {\r
&:before {\r
- background-color: _palette(accent4);\r
+ background-color: _palette_light(accent4);\r
+ @media screen and (prefers-color-scheme: dark) {\r
+ background-color: _palette_dark(accent4);\r
+ }\r
}\r
}\r
\r
&:nth-child(6n - 1) {\r
&:before {\r
- background-color: _palette(accent5);\r
+ background-color: _palette_light(accent5);\r
+ @media screen and (prefers-color-scheme: dark) {\r
+ background-color: _palette_dark(accent5);\r
+ }\r
}\r
}\r
\r
&:nth-child(6n) {\r
&:before {\r
- background-color: _palette(accent6);\r
+ background-color: _palette_light(accent6);\r
+ @media screen and (prefers-color-scheme: dark) {\r
+ background-color: _palette_dark(accent6);\r
+ }\r
}\r
}\r
}\r