qdouze-bludit-theme/scss/utils/_colorize.scss
2024-04-10 20:54:20 +02:00

98 lines
No EOL
1.6 KiB
SCSS
Executable file

/* 1.2 - Colorization classes
* Colorize some aspect of a class
**/
.c {
@each $name,
$color in list-colors() {
&-#{$name} {
@include accent-color(get-color($name), get-color-light($name));
}
}
}
@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 {
background-color: get-color("dark");
}
.bg {
background-color: $color-background;
}
.bg-alt {
background-color: $color-background-alt;
}
.bg-soft {
background-color: var(--accent-color-soft);
}
// .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));
// }
// }
// }
// .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)};
}