0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-23 20:54:22 +01:00
Bootstrap/scss/mixins/_table-variants.scss
Mark Otto 7915584fa4 lol
2024-07-29 22:04:11 -07:00

30 lines
1.4 KiB
SCSS

@use "sass:color";
@use "sass:math";
@use "../functions";
@use "../variables";
// scss-docs-start table-variant
@mixin table-variant($state, $background) {
.table-#{$state} {
$color: functions.color-contrast(functions.opaque(variables.$body-bg, $background));
$hover-bg: color.mix($color, $background, math.percentage(variables.$table-hover-bg-factor));
$striped-bg: color.mix($color, $background, math.percentage(variables.$table-striped-bg-factor));
$active-bg: color.mix($color, $background, math.percentage(variables.$table-active-bg-factor));
$table-border-color: color.mix($color, $background, math.percentage(variables.$table-border-factor));
--#{variables.$prefix}table-color: #{$color};
--#{variables.$prefix}table-bg: #{$background};
--#{variables.$prefix}table-border-color: #{$table-border-color};
--#{variables.$prefix}table-striped-bg: #{$striped-bg};
--#{variables.$prefix}table-striped-color: #{functions.color-contrast($striped-bg)};
--#{variables.$prefix}table-active-bg: #{$active-bg};
--#{variables.$prefix}table-active-color: #{functions.color-contrast($active-bg)};
--#{variables.$prefix}table-hover-bg: #{$hover-bg};
--#{variables.$prefix}table-hover-color: #{functions.color-contrast($hover-bg)};
color: var(--#{variables.$prefix}table-color);
border-color: var(--#{variables.$prefix}table-border-color);
}
}
// scss-docs-end table-variant