fix: bruk fontstiler for riktig størrelse i kompakt

fremtind · Feb 2, 2023 · 825b1cd · 825b1cd
1 parent ad3bf4e
commit 825b1cd
Show file tree

Hide file tree

Showing 8 changed files with 16 additions and 15 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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;