feat: adds th null var (#30781)

Inherit `font-weight: bold` that comes from user agent stylesheets.

2 files changed, 8 insertions, 4 deletions

diff --git a/scss/_reboot.scss b/scss/_reboot.scss
index b3763d05a..b6e8a79a5 100644
--- a/scss/_reboot.scss
+++ b/scss/_reboot.scss
@@ -369,12 +369,14 @@ caption {
   text-align: left;
 }
 
-// 1. Matches default `<td>` alignment by inheriting `text-align`.
-// 2. Fix alignment for Safari
+// 1. Removes font-weight bold by inheriting
+// 2. Matches default `<td>` alignment by inheriting `text-align`.
+// 3. Fix alignment for Safari
 
 th {
-  text-align: inherit; // 1
-  text-align: -webkit-match-parent; // 2
+  font-weight: $table-th-font-weight; // 1
+  text-align: inherit; // 2
+  text-align: -webkit-match-parent; // 3
 }
 
 thead,
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 2e0d0cef6..9e8fd622e 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -487,6 +487,8 @@ $table-cell-vertical-align:   top !default;
 $table-color:                 $body-color !default;
 $table-bg:                    transparent !default;
 
+$table-th-font-weight:        null !default;
+
 $table-striped-color:         $table-color !default;
 $table-striped-bg-factor:     .05 !default;
 $table-striped-bg:            rgba($black, $table-striped-bg-factor) !default;