diff --git a/.changeset/fix-striped-table-custom-backgrounds.md b/.changeset/fix-striped-table-custom-backgrounds.md
new file mode 100644
index 000000000..fc4b956ec
--- /dev/null
+++ b/.changeset/fix-striped-table-custom-backgrounds.md
@@ -0,0 +1,5 @@
+---
+"@tabler/core": patch
+---
+
+Fixed `.table-striped` and `.table-striped-columns` overriding a row or cell that sets its own background. A `
` or `| ` carrying `.bg-*`, `.table-*`, `.text-bg-*` or an inline `background` now keeps that background instead of being repainted by the stripe.
diff --git a/core/scss/_variables.scss b/core/scss/_variables.scss
index d9d427d03..f24b85594 100644
--- a/core/scss/_variables.scss
+++ b/core/scss/_variables.scss
@@ -1808,6 +1808,8 @@ $table-striped-bg-factor: 0.05 !default;
$table-striped-order: even !default;
$table-striped-bg: var(--bg-surface-tertiary) !default;
$table-striped-columns-order: even !default;
+// Rows and cells matching this selector keep their own background instead of the stripe.
+$table-striped-exclude-selector: '[class^="bg-"], [class*=" bg-"], [class^="table-"], [class*=" table-"], [class^="text-bg-"], [class*=" text-bg-"], [style*="background"]' !default;
$table-group-separator-color: var(--border-color-translucent) !default;
diff --git a/core/scss/bootstrap/_tables.scss b/core/scss/bootstrap/_tables.scss
index 31de7e304..0f9eee480 100644
--- a/core/scss/bootstrap/_tables.scss
+++ b/core/scss/bootstrap/_tables.scss
@@ -109,10 +109,13 @@
// Zebra-striping
//
// Default zebra-stripe styles (alternating gray and transparent backgrounds)
+//
+// A row or cell that declares its own background wins over the stripe, so
+// `.bg-*`, `.table-*`, `.text-bg-*` and inline backgrounds stay visible.
// For rows
.table-striped {
- > tbody > tr:nth-of-type(#{$table-striped-order}) > * {
+ > tbody > tr:nth-of-type(#{$table-striped-order}):not(:is(#{$table-striped-exclude-selector})) > *:not(:is(#{$table-striped-exclude-selector})) {
--table-color-type: var(--table-striped-color);
--table-bg-type: var(--table-striped-bg);
}
@@ -120,7 +123,7 @@
// For columns
.table-striped-columns {
- > :not(caption) > tr > :nth-child(#{$table-striped-columns-order}) {
+ > :not(caption) > tr:not(:is(#{$table-striped-exclude-selector})) > :nth-child(#{$table-striped-columns-order}):not(:is(#{$table-striped-exclude-selector})) {
--table-color-type: var(--table-striped-color);
--table-bg-type: var(--table-striped-bg);
}
diff --git a/core/scss/ui/_tables.scss b/core/scss/ui/_tables.scss
index 0716693bf..f518bc33c 100644
--- a/core/scss/ui/_tables.scss
+++ b/core/scss/ui/_tables.scss
@@ -32,6 +32,10 @@
.table {
margin-bottom: 0;
}
+
+ + .card-footer {
+ border-top: 0;
+ }
}
.table-transparent {
|