diff options
| author | Bastien <[email protected]> | 2018-10-20 08:21:31 +0000 |
|---|---|---|
| committer | XhmikosR <[email protected]> | 2018-10-20 11:21:31 +0300 |
| commit | a86aef0ae0388d51c433b93cd1c25ea27e0535b9 (patch) | |
| tree | 6d6dbf2a8c96e630fac3deec27c2688e9d678859 | |
| parent | 282b77ee9c9fd382d5ed576ad5bf7a41d97ca2a5 (diff) | |
| download | bootstrap-a86aef0ae0388d51c433b93cd1c25ea27e0535b9.tar.xz bootstrap-a86aef0ae0388d51c433b93cd1c25ea27e0535b9.zip | |
table: Add border color relative to theme for accessibility (#25755)
| -rw-r--r-- | scss/_tables.scss | 2 | ||||
| -rw-r--r-- | scss/_variables.scss | 3 | ||||
| -rw-r--r-- | scss/mixins/_table-row.scss | 11 |
3 files changed, 14 insertions, 2 deletions
diff --git a/scss/_tables.scss b/scss/_tables.scss index 5fa6a8662..92d4ec9b5 100644 --- a/scss/_tables.scss +++ b/scss/_tables.scss @@ -100,7 +100,7 @@ // inheritance to nested tables. @each $color, $value in $theme-colors { - @include table-row-variant($color, theme-color-level($color, -9)); + @include table-row-variant($color, theme-color-level($color, $table-bg-level), theme-color-level($color, $table-border-level)); } @include table-row-variant(active, $table-active-bg); diff --git a/scss/_variables.scss b/scss/_variables.scss index a8fc43280..78a532b42 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -349,6 +349,9 @@ $table-striped-order: odd !default; $table-caption-color: $text-muted !default; +$table-bg-level: -9 !default; +$table-border-level: -6 !default; + // Buttons + Forms // diff --git a/scss/mixins/_table-row.scss b/scss/mixins/_table-row.scss index 84f1d305a..f8d61869a 100644 --- a/scss/mixins/_table-row.scss +++ b/scss/mixins/_table-row.scss @@ -1,6 +1,6 @@ // Tables -@mixin table-row-variant($state, $background) { +@mixin table-row-variant($state, $background, $border: null) { // Exact selectors below required to override `.table-striped` and prevent // inheritance to nested tables. .table-#{$state} { @@ -9,6 +9,15 @@ > td { background-color: $background; } + + @if $border != null { + th, + td, + thead th, + tbody + tbody { + border-color: $border; + } + } } // Hover states for `.table-hover` |