fix(board): spacing error in chrome 56 (#1183)

* fix(styling): using margin when gap is not supported by browser * fix(styling): changed one of the duplicate classnames * fix(styling): added minimum height to table header * fix(board): CSS restructuring
entur · Aug 28, 2023 · f2da2f1 · f2da2f1
1 parent da2d760
commit f2da2f1
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 2 deletions.
diff --git a/next-tavla/src/Board/scenarios/Board/styles.module.css b/next-tavla/src/Board/scenarios/Board/styles.module.css
@@ -18,4 +18,7 @@
     .board {
         display: flex;
     }
+    .board > * {
+        margin: 10px;
+    }
 }
diff --git a/next-tavla/src/Board/scenarios/Table/components/TableHeader/index.tsx b/next-tavla/src/Board/scenarios/Table/components/TableHeader/index.tsx
@@ -10,7 +10,7 @@ function TableHeader({
     transportModes: (TTransportMode | null)[] | null
 }) {
     return (
-        <div className={classes.headerWrapper}>
+        <div className={classes.tableHeaderWrapper}>
             <h1 className={classes.heading}>{heading}</h1>
             {transportModes && (
                 <div>

diff --git a/next-tavla/src/Board/scenarios/Table/components/TableHeader/styles.module.css b/next-tavla/src/Board/scenarios/Table/components/TableHeader/styles.module.css
@@ -1,6 +1,7 @@
-.headerWrapper {
+.tableHeaderWrapper {
     display: flex;
     align-items: center;
+    min-height: 2em;
 }
 
 .heading {

diff --git a/next-tavla/src/Shared/styles/pages/board.module.css b/next-tavla/src/Shared/styles/pages/board.module.css
@@ -17,3 +17,9 @@
     overflow: hidden;
     padding: 1em 0;
 }
+
+@supports not (gap: 0.75em) {
+    .rootContainer > * {
+        margin: 0.75em;
+    }
+}