philomena/assets/css/themes/light-blue.css
2024-07-02 21:32:39 +02:00

38 lines
1.3 KiB
CSS

@import "themes/base/light";
$background-color: #f7f7f7;
$primary-color: #4b9ad3;
$secondary-color: #62a7d9;
:root {
/* Main colors */
--background-color: $background-color;
--text-light-color: $background-color;
/* Link colors */
--link-color: hsl(from $primary-color h calc(s + 25) calc(l - 25));
/* Primary color (block backgrounds and such) */
--primary-color: $primary-color;
--primary-border-color: hsl(from $primary-color h calc(s + 5) calc(l - 5));
--primary-muted-color: hsl(from $primary-color h calc(s + 7) calc(l + 20));
--primary-dark-color: hsl(from $primary-color h calc(s + 20) calc(l + 35));
--primary-link-color: var(--link-color); /* for consistency */
/* Secondary color (most buttons) */
--secondary-color: $secondary-color;
--secondary-border-color: hsl(from $secondary-color h s calc(l - 45));
--secondary-muted-color: hsl(from $secondary-color h calc(s + 5) calc(l + 18));
--secondary-dark-color: hsl(from $secondary-color h calc(s - 5) calc(l + 25));
--secondary-link-color: hsl(from $secondary-color h s calc(l - 55));
}
nav.header__secondary {
/* Apparently people will put me on a cross if
I don't use Trixie colors, so here you go! */
background-color: #e2ebf2;
}
nav.header__secondary .header__link {
color: var(--text-color) !important;
}