Fix the specificity of table mobile card styles

canonical · Mar 26, 2024 · 404367d · 404367d
1 parent 46e0306
commit 404367d
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/scss/_base_tables.scss b/scss/_base_tables.scss
@@ -71,6 +71,6 @@
   // stylelint-enable selector-max-type
 
   %table-row-border {
-    border-top: 1px solid $colors--theme--border-default;
+    border-top: 1px solid $colors--theme--border-low-contrast;
   }
 }
diff --git a/scss/_patterns_table-mobile-card.scss b/scss/_patterns_table-mobile-card.scss
@@ -24,7 +24,8 @@
           width: 100%;
         }
 
-        tr {
+        // tbody selector needed to override the default table styles
+        tbody tr {
           border: 1px solid $colors--theme--border-default;
           display: block;
           margin-bottom: $spv--x-large;
@@ -64,7 +65,7 @@
           }
 
           &:not(:first-child)::after {
-            background-color: $colors--theme--border-default;
+            background-color: $colors--theme--border-low-contrast;
             content: '';
             height: 1px;
             left: 0;