homepage/sass/skins/lowcontrast_orange.scss
Fabian Montero 8be91ee3d9 Squashed 'themes/tabi-lean/' content from commit efb4246
git-subtree-dir: themes/tabi-lean
git-subtree-split: efb42461fde7ee5b0c140d27f2789fdf9c98b100
2025-09-14 16:00:14 -06:00

26 lines
853 B
SCSS

// WARNING! This skin, in light theme, may not provide optimal contrast for readability
// and might not be suitable for users with certain types of visual impairment.
// Furthermore, low contrast will affect your Google Lighthouse rating.
// For more information on web accessibility: https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html
@mixin theme-variables($theme) {
@if $theme =='light' {
--primary-color: #f56a00; // Contrast ratio: 3.02:1. Not very accessible.
}
@else if $theme == 'dark' {
--primary-color: #ec984f; // Contrast ratio: 7.19:1. Accessible.
}
}
:root {
@include theme-variables('light');
}
[data-theme='dark'] {
@include theme-variables('dark');
}
@media (prefers-color-scheme: dark) {
:root:not([data-theme='light']) {
@include theme-variables('dark');
}
}