93 lines
1.6 KiB
SCSS
93 lines
1.6 KiB
SCSS
|
@mixin heading-color($background-color) {
|
||
|
|
|
||
|
|
& .card-header,
|
||
|
|
& .menu-header,
|
||
|
|
&.header-bg th {
|
||
|
|
@include colorize-shape($background-color);
|
||
|
|
color: getTextColorFromBackground($background-color);
|
||
|
|
}
|
||
|
|
|
||
|
|
th {
|
||
|
|
color: $background-color;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@mixin bg-color($background-color) {
|
||
|
|
@include background-color($background-color);
|
||
|
|
|
||
|
|
a {
|
||
|
|
color:currentColor;
|
||
|
|
outline-color: currentColor;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.bg-accent {
|
||
|
|
$background-color: var(--accent-color);
|
||
|
|
}
|
||
|
|
|
||
|
|
.bg-dark {
|
||
|
|
@include bg-color(get-color("dark"));
|
||
|
|
}
|
||
|
|
|
||
|
|
// .bg {
|
||
|
|
|
||
|
|
// @each $name,
|
||
|
|
// $color in list-colors() {
|
||
|
|
// &-#{$name} {
|
||
|
|
// @include bg-color(get-color($name));
|
||
|
|
// &:hover {
|
||
|
|
// @include bg-color(get-color($name));
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .text {
|
||
|
|
|
||
|
|
// @each $name,
|
||
|
|
// $color in list-colors() {
|
||
|
|
// &-#{$name} {
|
||
|
|
// @include text-color(get-color($name));
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .btn {
|
||
|
|
|
||
|
|
// @each $name,
|
||
|
|
// $color in list-colors() {
|
||
|
|
// &-#{$name} {
|
||
|
|
// @include button-color(get-color($name));
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
|
||
|
|
.c, .btn, .head, .text {
|
||
|
|
@each $name,
|
||
|
|
$color in list-colors() {
|
||
|
|
&-#{$name} {
|
||
|
|
@include accent-color(get-color($name));
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// .head {
|
||
|
|
|
||
|
|
// @each $name,
|
||
|
|
// $color in list-colors() {
|
||
|
|
// &-#{$name} {
|
||
|
|
// @include heading-color(get-color($name));
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
|
||
|
|
.fg-light {
|
||
|
|
--text-color:#{$color-font-light};
|
||
|
|
--link-color-hover:#{transparentize($color-font-light, 0.7)};
|
||
|
|
}
|
||
|
|
|
||
|
|
.fg-dark {
|
||
|
|
color: $color-font;
|
||
|
|
--text-color:#{$color-font};
|
||
|
|
--link-color-hover:#{transparentize($color-font, 0.85)};
|
||
|
|
}
|