kspace-bludit-theme/scss/utils/_colorize.scss
2024-04-10 20:58:16 +02:00

93 lines
No EOL
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)};
}