From 825b1cdefdf988d9c5c7439594a230ef8e3f1e66 Mon Sep 17 00:00:00 2001
From: William Killerud <william@killerud.com>
Date: Thu, 19 Jan 2023 09:18:22 +0100
Subject: [PATCH] =?UTF-8?q?fix:=20bruk=20fontstiler=20for=20riktig=20st?=
 =?UTF-8?q?=C3=B8rrelse=20i=20kompakt?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/table-react/documentation/ActionTableExample.tsx     | 4 ++--
 packages/table-react/documentation/ClickableTableExample.tsx  | 4 ++--
 packages/table-react/documentation/ExpandableTableExample.tsx | 4 ++--
 packages/table-react/documentation/MobileListTableExample.tsx | 4 ++--
 .../table-react/documentation/MobileScrollTableExample.tsx    | 4 ++--
 packages/table-react/documentation/StickyTableExample.tsx     | 4 ++--
 packages/table-react/documentation/TableExample.tsx           | 4 ++--
 packages/table/_table-header.scss                             | 3 ++-
 8 files changed, 16 insertions(+), 15 deletions(-)

diff --git a/packages/table-react/documentation/ActionTableExample.tsx b/packages/table-react/documentation/ActionTableExample.tsx
index 5750d4ecba0..180f6679d1d 100644
--- a/packages/table-react/documentation/ActionTableExample.tsx
+++ b/packages/table-react/documentation/ActionTableExample.tsx
@@ -33,7 +33,7 @@ const ActionTableExample: FC<ExampleComponentProps> = ({ boolValues, choiceValue
             <TableHead srOnly={headless}>
                 <TableRow>
                     {headings.map((column) => (
-                        <TableHeader key={column} density="compact" bold>
+                        <TableHeader key={column} bold>
                             {column}
                         </TableHeader>
                     ))}
@@ -71,7 +71,7 @@ export const actionTableExampleCode = ({ boolValues, choiceValues }: ExampleComp
     <TableHead srOnly={${boolValues?.["Skjul overskrift"]}}>
         <TableRow>
             {headings.map((column) => (
-                <TableHeader key={column} density="compact" bold>
+                <TableHeader key={column} bold>
                     {column}
                 </TableHeader>
             ))}
diff --git a/packages/table-react/documentation/ClickableTableExample.tsx b/packages/table-react/documentation/ClickableTableExample.tsx
index f1cf50bfabb..a0e3fbf2c70 100644
--- a/packages/table-react/documentation/ClickableTableExample.tsx
+++ b/packages/table-react/documentation/ClickableTableExample.tsx
@@ -33,7 +33,7 @@ const ClickableTableExample: FC<ExampleComponentProps> = ({ boolValues, choiceVa
             <TableHead srOnly={headless}>
                 <TableRow>
                     {headings.map((column) => (
-                        <TableHeader key={column} density="compact" bold>
+                        <TableHeader key={column} bold>
                             {column}
                         </TableHeader>
                     ))}
@@ -66,7 +66,7 @@ export const clickableTableExampleCode = ({ boolValues, choiceValues }: ExampleC
     <TableHead srOnly={${boolValues?.["Skjul overskrift"]}}>
         <TableRow>
             {headings.map((column) => (
-                <TableHeader key={column} density="compact" bold>{column}</TableHeader>
+                <TableHeader key={column} bold>{column}</TableHeader>
             ))}
         </TableRow>
     </TableHead>
diff --git a/packages/table-react/documentation/ExpandableTableExample.tsx b/packages/table-react/documentation/ExpandableTableExample.tsx
index 223755e4704..adf8f0c3ef3 100644
--- a/packages/table-react/documentation/ExpandableTableExample.tsx
+++ b/packages/table-react/documentation/ExpandableTableExample.tsx
@@ -44,7 +44,7 @@ const ExpandableTableExample: FC<ExampleComponentProps> = ({ boolValues, choiceV
             <TableHead srOnly={headless}>
                 <TableRow>
                     {headings.map((column) => (
-                        <TableHeader key={column} density="compact" bold>
+                        <TableHeader key={column} bold>
                             {column}
                         </TableHeader>
                     ))}
@@ -106,7 +106,7 @@ export const expandableTableExampleCode = ({ choiceValues, boolValues }: Example
     <TableHead srOnly={headless}>
         <TableRow>
             {headings.map((column) => (
-                <TableHeader key={column} density="compact" bold>
+                <TableHeader key={column} bold>
                     {column}
                 </TableHeader>
             ))}
diff --git a/packages/table-react/documentation/MobileListTableExample.tsx b/packages/table-react/documentation/MobileListTableExample.tsx
index 72d8e1be558..bcc8c0dc9db 100644
--- a/packages/table-react/documentation/MobileListTableExample.tsx
+++ b/packages/table-react/documentation/MobileListTableExample.tsx
@@ -29,7 +29,7 @@ const MobileListTableExample: FC<ExampleComponentProps> = ({ choiceValues }) =>
             <TableHead>
                 <TableRow>
                     {columns.map((column, index) => (
-                        <TableHeader key={index} density="compact" bold>
+                        <TableHeader key={index} bold>
                             {column}
                         </TableHeader>
                     ))}
@@ -62,7 +62,7 @@ export const mobileListTableExampleCode = ({ choiceValues }: ExampleComponentPro
     <TableHead>
         <TableRow>
             {columns.map((column, index) => (
-                <TableHeader key={index} density="compact" bold>
+                <TableHeader key={index} bold>
                     {column}
                 </TableHeader>
             ))}
diff --git a/packages/table-react/documentation/MobileScrollTableExample.tsx b/packages/table-react/documentation/MobileScrollTableExample.tsx
index 6203296d0b1..fa9d181ede7 100644
--- a/packages/table-react/documentation/MobileScrollTableExample.tsx
+++ b/packages/table-react/documentation/MobileScrollTableExample.tsx
@@ -22,7 +22,7 @@ const MobileScrollTableExample: FC = () => {
                 <TableHead>
                     <TableRow>
                         {columns.map((column, index) => (
-                            <TableHeader key={index} density="compact" bold>
+                            <TableHeader key={index} bold>
                                 {column}
                             </TableHeader>
                         ))}
@@ -62,7 +62,7 @@ export const mobileScrollTableExampleCode = `
             <TableHead>
                 <TableRow>
                     {columns.map((column, index) => (
-                        <TableHeader key={index} density="compact" bold>
+                        <TableHeader key={index} bold>
                             {column}
                         </TableHeader>
                     ))}
diff --git a/packages/table-react/documentation/StickyTableExample.tsx b/packages/table-react/documentation/StickyTableExample.tsx
index 53cfcd25789..d3b0b2e784e 100644
--- a/packages/table-react/documentation/StickyTableExample.tsx
+++ b/packages/table-react/documentation/StickyTableExample.tsx
@@ -30,7 +30,7 @@ const StickyTableExample: FC<ExampleComponentProps> = ({ boolValues, choiceValue
             <TableHead srOnly={headless} sticky>
                 <TableRow>
                     {columns.map((column, index) => (
-                        <TableHeader key={index} density="compact" bold>
+                        <TableHeader key={index} bold>
                             {column}
                         </TableHeader>
                     ))}
@@ -63,7 +63,7 @@ export const stickyTableExampleCode = ({ boolValues, choiceValues }: ExampleComp
     <TableHead srOnly={${boolValues?.["Skjul overskrift"]}} sticky>
         <TableRow>
             {columns.map((header, index) => (
-                <TableHeader key={index} density="compact" bold>
+                <TableHeader key={index} bold>
                     {header}
                 </TableHeader>
             ))}
diff --git a/packages/table-react/documentation/TableExample.tsx b/packages/table-react/documentation/TableExample.tsx
index 09ad0bd7386..7b45674ec2e 100644
--- a/packages/table-react/documentation/TableExample.tsx
+++ b/packages/table-react/documentation/TableExample.tsx
@@ -21,7 +21,7 @@ const TableExample: FC<ExampleComponentProps> = ({ boolValues, choiceValues }) =
             <TableHead srOnly={headless}>
                 <TableRow>
                     {columns.map((column, index) => (
-                        <TableHeader key={index} density="compact" bold>
+                        <TableHeader key={index} bold>
                             {column}
                         </TableHeader>
                     ))}
@@ -54,7 +54,7 @@ export const tableExampleCode = ({ boolValues, choiceValues }: ExampleComponentP
     <TableHead srOnly={${boolValues?.["Skjul overskrift"]}}>
         <TableRow>
             {columns.map((header, index) => (
-                <TableHeader key={index} density="compact" bold>
+                <TableHeader key={index} bold>
                     {header}
                 </TableHeader>
             ))}
diff --git a/packages/table/_table-header.scss b/packages/table/_table-header.scss
index f3e3d884d12..66ad22c2aef 100644
--- a/packages/table/_table-header.scss
+++ b/packages/table/_table-header.scss
@@ -13,7 +13,8 @@
 }
 
 .jkl-table-header {
-    @include jkl.text-style("body");
+    @include jkl.use-font-variables("jkl-table-header");
+
     padding: var(--jkl-table-header-padding);
     text-align: left;
     white-space: nowrap;