Merge branch 'development' into staging

kappys1 · Oct 3, 2019 · 80a0f76 · 80a0f76
2 parents 3a01abe + c9894e2
commit 80a0f76
Show file tree

Hide file tree

Showing 9 changed files with 30 additions and 8 deletions.
diff --git a/src/components/ColorsSection/Color/Color.scss b/src/components/ColorsSection/Color/Color.scss
@@ -6,6 +6,7 @@ $Color-height: 3em;
   outline: none;
   border: none;
   background: transparent;
+  font-size: 1rem;
   width: $Color-width;
   height: $Color-height;
   margin: 0;

diff --git a/src/components/ColorsSection/ColorsSection.scss b/src/components/ColorsSection/ColorsSection.scss
@@ -2,6 +2,7 @@
 
 .ColorsSection {
   padding: 0;
+
   @include flex-content(row, center, center);
   @include flex-wrap(wrap);
 

diff --git a/src/components/Header/Header.scss b/src/components/Header/Header.scss
@@ -37,14 +37,15 @@
   }
 
   button i {
-    font-size: 1.5em;
+    font-size: 2rem;
   }
 
   @include respond-to(medium) {
 
     &__menu {
       display: none;
     }
+
   }
 
 }
diff --git a/src/components/LineWidthsSection/LineWidth/LineWidth.scss b/src/components/LineWidthsSection/LineWidth/LineWidth.scss
@@ -6,6 +6,7 @@ $LineWidth-icon-backgroundColor: #000000;
   outline: none;
   border: none;
   background: transparent;
+  font-size: 1rem;
   width: 3em;
   height: 3em;
   padding: 0px;

diff --git a/src/components/LineWidthsSection/LineWidthsSection.scss b/src/components/LineWidthsSection/LineWidthsSection.scss
@@ -8,6 +8,5 @@ $LineWidthsSection-gridColumnGap: 0.4em;
   display: grid;
   grid-template-columns: repeat($LineWidthsSection-gridTemplateColumns-repeatInteger, 1fr);
   grid-column-gap: $LineWidthsSection-gridColumnGap;
-
-
+  font-size: 1rem;
 }
diff --git a/src/components/Section/Section.scss b/src/components/Section/Section.scss
@@ -1,7 +1,6 @@
 .Section {
   padding: 20px;
 
-
   h1 {
     font-size: 1.7rem;
     margin-top: 0;

diff --git a/src/components/SideBar/SideBar.scss b/src/components/SideBar/SideBar.scss
@@ -7,8 +7,7 @@
   background-color: $c-primary;
   width: 100%;
   min-width: 250px;
-  max-width: 350px;
-  padding: 1em;
+  padding: 2em;
   position: fixed;
   right: -100%;
 
@@ -24,7 +23,11 @@
   }
 
   @include respond-to(medium) {
-    position: initial;
+    // position: initial;
+    right: 0;
     width: 15%;
   }
+
+
+
 }
diff --git a/src/index.scss b/src/index.scss
@@ -20,3 +20,19 @@ body {
   width: 100%;
   height: 100%;
 }
+
+@include respond-to(large) {
+
+  body,
+  html {
+    font-size: 68.5%;
+  }
+}
+
+@include respond-to(extra-large) {
+
+  body,
+  html {
+    font-size: 130%;
+  }
+}
diff --git a/src/theme/_variables.scss b/src/theme/_variables.scss
@@ -1,6 +1,7 @@
 $breakpoints: ('small' : (min-width: 767px),
   'medium' : (min-width: 992px),
-  'large' : (min-width: 1200px));
+  'large' : (min-width: 1200px),
+  'extra-large' : (min-width: 2000px));
 
 $fz-base: 1rem !default;
 $fz-lg: $fz-base * 1.25 !default;