Merge pull request #595 from scania/feature/4px_base_site

Feature - 4px base unit
scania · Nov 12, 2020 · 97dc5ea · 97dc5ea
2 parents ad99a2b + aa54328
commit 97dc5ea
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 14 deletions.
diff --git a/src/components/code-sample/code-sample.scss b/src/components/code-sample/code-sample.scss
@@ -20,7 +20,8 @@ pre {
 
 pre,
 pre code {
-  font-size: 1.3rem;
+  //FIXME: Add correct rem
+  font-size: 3.25rem;
   white-space: pre-wrap;
   margin: 0;
 }

diff --git a/src/components/cookie/cookie.scss b/src/components/cookie/cookie.scss
@@ -25,7 +25,8 @@
 
 ::slotted(a) {
   font-weight: bold;
-  padding: 1.7rem;
+  //FIXME: Add correct rem
+  padding: 4.25rem;
 }
 
 slot[name=config],
@@ -39,7 +40,8 @@ nav {
 
   c-icon {
     transform: rotate(-90deg);
-    font-size: 4rem;
+    //FIXME: Add correct rem
+    font-size: 10rem;
     margin: -12px;
   }
 }
@@ -82,7 +84,8 @@ footer {
 
   c-icon {
     transform: rotate(90deg);
-    font-size: 4rem;
+    //FIXME: Add correct rem
+    font-size: 10rem;
     margin: -12px;
   }
 }
@@ -96,8 +99,9 @@ footer {
 @media (min-width: 992px) {
 
   .tab-content {
-    padding-right: 4.5rem;
-    padding-left: 4.5rem;
+    //FIXME: Add correct rem
+    padding-right: 11.25rem;
+    padding-left: 11.25rem;
   }
 }
 
@@ -163,7 +167,8 @@ footer {
       opacity: 0;
       z-index: 100;
       transition: left 500ms;
-      padding: 3rem;
+      //FIXME: Add correct rem
+      padding: 7.5rem;
 
       .active & {
         left: 0;

diff --git a/src/components/footer/footer.scss b/src/components/footer/footer.scss
@@ -14,7 +14,8 @@
   display: inline-block;
   border: 2px solid black;
   margin-right: 10px;
-  font-size: 2.6rem;
+  //FIXME: Add correct rem
+  font-size: 6.5rem;
 }
 
 ::slotted(a[slot="social-items"]) {

diff --git a/src/components/table/table.scss b/src/components/table/table.scss
@@ -15,9 +15,11 @@
     display: flex;
     flex-flow: row wrap;
     align-items: center;
-    margin-bottom: 1rem;
+    //FIXME: Add correct rem
+    margin-bottom: 2.5rem;
     > div:first-child {
-      padding-right: 1rem;
+        //FIXME: Add correct rem
+      padding-right: 2.5rem;
     }
     > div:nth-child(2) {
       display: flex;
@@ -42,7 +44,7 @@
     width: 25px;
     height: 25px;
   }
-  
+
   .input-icon-cross {
     background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxMiIgdmlld0JveD0iMCAwIDEyIDEyIj48ZGVmcz48c3R5bGU+LmF7ZmlsbDojNTM1NjVhO308L3N0eWxlPjwvZGVmcz48cGF0aCBjbGFzcz0iYSIgZD0iTTkwLjUsNzkuMzc0bC0uODU3LS44NTdMODQuNSw4My42NTlsLTUuMTQyLTUuMTQzLS44NTcuODU3LDUuMTQyLDUuMTQzTDc4LjUsODkuNjU4bC44NTcuODU3TDg0LjUsODUuMzczbDUuMTQyLDUuMTQzLjg1Ny0uODU3LTUuMTQyLTUuMTQzWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTc4LjQ5NiAtNzguNTE2KSIvPjwvc3ZnPg==") no-repeat !important;
     position: absolute;
@@ -56,5 +58,4 @@
   .form-control {
     padding-right: 25px !important;
   }
-}
-
+}
diff --git a/src/components/theme/theme.scss b/src/components/theme/theme.scss
@@ -3,7 +3,7 @@
 // @import 'node_modules/bootstrap/scss/mixins';
 
 :root {
-  font-size: 62.5%;
+  font-size: 4px;
 
   --blue: #007bff;
   --indigo: #6610f2;