1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-09-01 17:32:41 +02:00

Add Sass variable for CSS variable prefix (#31684)

* Add Sass variable for CSS variable prefix

* Update other --bs-* var instances
This commit is contained in:
Mark Otto
2020-09-29 22:32:58 -07:00
committed by GitHub
parent 7e195a8d22
commit 3cf51c6ac9
9 changed files with 56 additions and 52 deletions

View File

@@ -3,14 +3,14 @@
//
.table {
--bs-table-bg: #{$table-bg};
--bs-table-accent-bg: transparent;
--bs-table-striped-color: #{$table-striped-color};
--bs-table-striped-bg: #{$table-striped-bg};
--bs-table-active-color: #{$table-active-color};
--bs-table-active-bg: #{$table-active-bg};
--bs-table-hover-color: #{$table-hover-color};
--bs-table-hover-bg: #{$table-hover-bg};
--#{$variable-prefix}table-bg: #{$table-bg};
--#{$variable-prefix}table-accent-bg: transparent;
--#{$variable-prefix}table-striped-color: #{$table-striped-color};
--#{$variable-prefix}table-striped-bg: #{$table-striped-bg};
--#{$variable-prefix}table-active-color: #{$table-active-color};
--#{$variable-prefix}table-active-bg: #{$table-active-bg};
--#{$variable-prefix}table-hover-color: #{$table-hover-color};
--#{$variable-prefix}table-hover-bg: #{$table-hover-bg};
width: 100%;
margin-bottom: $spacer;
@@ -25,8 +25,8 @@
// stylelint-disable-next-line selector-max-universal
> :not(caption) > * > * {
padding: $table-cell-padding-y $table-cell-padding-x;
background-color: var(--bs-table-bg);
background-image: linear-gradient(var(--bs-table-accent-bg), var(--bs-table-accent-bg));
background-color: var(--#{$variable-prefix}table-bg);
background-image: linear-gradient(var(--#{$variable-prefix}table-accent-bg), var(--#{$variable-prefix}table-accent-bg));
border-bottom-width: $table-border-width;
}
@@ -99,8 +99,8 @@
.table-striped {
> tbody > tr:nth-of-type(#{$table-striped-order}) {
--bs-table-accent-bg: var(--bs-table-striped-bg);
color: var(--bs-table-striped-color);
--#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-striped-bg);
color: var(--#{$variable-prefix}table-striped-color);
}
}
@@ -109,8 +109,8 @@
// The `.table-active` class can be added to highlight rows or cells
.table-active {
--bs-table-accent-bg: var(--bs-table-active-bg);
color: var(--bs-table-active-color);
--#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-active-bg);
color: var(--#{$variable-prefix}table-active-color);
}
// Hover effect
@@ -119,8 +119,8 @@
.table-hover {
> tbody > tr:hover {
--bs-table-accent-bg: var(--bs-table-hover-bg);
color: var(--bs-table-hover-color);
--#{$variable-prefix}table-accent-bg: var(--#{$variable-prefix}table-hover-bg);
color: var(--#{$variable-prefix}table-hover-color);
}
}