Added missing variables

rbouma · Aug 13, 2018 · b9a2344 · b9a2344
1 parent 4f78483
commit b9a2344
Show file tree

Hide file tree

Showing 5 changed files with 126 additions and 22 deletions.
diff --git a/src/scss/boilerplate/_buttons.scss b/src/scss/boilerplate/_buttons.scss
@@ -112,3 +112,49 @@ button {
   }
 }
 
+.modes {
+  .modes-mode {
+    background: $toolbar-modes-mode-background;
+    border-top: $toolbar-modes-mode-border;
+    border-left: $toolbar-modes-mode-border;
+    border-bottom: $toolbar-modes-mode-border;
+    color: $toolbar-modes-mode-color;
+    padding: $toolbar-modes-mode-padding;
+    &:before {
+      color: $toolbar-modes-mode-color;
+    }
+    &:last-child {
+      border-right: $toolbar-modes-mode-border;
+      &.active {
+        border-right: $toolbar-modes-mode-active-border;
+      }
+      &:hover {
+        border-right: $toolbar-modes-mode-hover-border;
+      }
+    }
+
+    &.active {
+      background: $toolbar-modes-mode-active-background;
+      border-left: $toolbar-modes-mode-active-border;
+      border-top: $toolbar-modes-mode-active-border;
+      border-bottom: $toolbar-modes-mode-active-border;
+      color: $toolbar-modes-mode-active-color;
+      padding: $toolbar-modes-mode-active-padding;
+      &:before {
+        color: $toolbar-modes-mode-active-color;
+      }
+    }
+
+    &:hover {
+      background: $toolbar-modes-mode-hover-background;
+      border-left: $toolbar-modes-mode-hover-border;
+      border-top: $toolbar-modes-mode-hover-border;
+      border-bottom: $toolbar-modes-mode-hover-border;
+      color: $toolbar-modes-mode-hover-color;
+      padding: $toolbar-modes-mode-hover-padding;
+      &:before {
+        color: $toolbar-modes-mode-hover-color;
+      }
+    }
+  }
+}
diff --git a/src/scss/boilerplate/_fonts.scss b/src/scss/boilerplate/_fonts.scss
@@ -1,11 +1,14 @@
 html, body {
   font-family: $font-family;
   color: $font-default-color;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
 
   h1, h2, h3, h4, h5, h6 {
     font-family: $font-family-heading;
     color: $font-family-heading-color;
     font-weight: $font-family-heading-font-weight;
+    text-transform: $font-family-heading-text-transform;
   }
 
   h1 {
@@ -89,13 +92,15 @@ html, body {
     margin: $font-filter-title-margin;
     color: $font-filter-title-color;
     line-height: $font-filter-title-line-height;
+    text-transform: $font-filter-title-text-transform;
 
     strong {
       font-size: $font-filter-title-font-size;
       font-weight: $font-filter-title-font-weight;
       margin: $font-filter-title-margin;
       color: $font-filter-title-color;
       line-height: $font-filter-title-line-height;
+      text-transform: $font-filter-title-text-transform;
     }
   }
 
@@ -105,6 +110,7 @@ html, body {
     margin: $font-filter-subtitle-margin;
     color: $font-filter-subtitle-color;
     line-height: $font-filter-subtitle-line-height;
+    text-transform: $font-filter-subtitle-text-transform;
   }
 
   .filter-options {
@@ -113,6 +119,7 @@ html, body {
       font-weight: $font-filter-options-title-font-weight;
       margin: $font-filter-options-title-margin;
       color: $font-filter-options-title-color;
+      text-transform: $font-filter-options-title-text-transform;
     }
   }
 
@@ -123,7 +130,7 @@ html, body {
       font-weight: $font-product-item-name-font-weight;
       line-height: $font-product-item-name-line-height;
       margin: $font-product-item-name-margin;
-
+      text-transform: $font-product-item-name-text-transform;
 
       &:visited {
         color: $font-product-item-name-color;

diff --git a/src/scss/boilerplate/_inputs.scss b/src/scss/boilerplate/_inputs.scss
@@ -192,23 +192,31 @@ input[type="checkbox"] {
   }
 }
 
-.sorter-options {
-  background-color: $input-sorter-background-color;
-  border: $input-sorter-border;
-  border-radius: $input-sorter-border-radius;
-  height: $input-sorter-height;
-  width: $input-sorter-width;
-  margin: $input-sorter-margin;
-  padding: $input-sorter-padding;
-  vertical-align: $input-sorter-vertical-align;
-  font-size: $input-sorter-font-size;
-  color: $input-sorter-color;
-  font-family: $input-sorter-font-family;
-  font-weight: $input-sorter-font-weight;
-  font-style: $input-sorter-font-style;
-  line-height: $input-sorter-line-height;
+.sorter {
+  .sorter-options {
+    background-color: $input-sorter-background-color;
+    border: $input-sorter-border;
+    border-radius: $input-sorter-border-radius;
+    height: $input-sorter-height;
+    width: $input-sorter-width;
+    margin: $input-sorter-margin;
+    padding: $input-sorter-padding;
+    vertical-align: $input-sorter-vertical-align;
+    font-size: $input-sorter-font-size;
+    color: $input-sorter-color;
+    font-family: $input-sorter-font-family;
+    font-weight: $input-sorter-font-weight;
+    font-style: $input-sorter-font-style;
+    line-height: $input-sorter-line-height;
+  }
+  .sorter-action {
+    &:before {
+      line-height: $input-sorter-line-height;
+    }
+  }
 }
 
+
 /****
 ** Sidebar input
 ****/

diff --git a/src/scss/boilerplate/_menu.scss b/src/scss/boilerplate/_menu.scss
@@ -14,16 +14,31 @@
 
         &:hover {
           color: $menu-bar-menu-item-hover-color;
+          background: $menu-bar-menu-item-hover-background;
+          border-top: $menu-bar-menu-item-hover-border-top;
+          border-bottom: $menu-bar-menu-item-hover-border-bottom;
+          border-left: $menu-bar-menu-item-hover-border-left;
+          border-right: $menu-bar-menu-item-hover-border-right;
         }
       }
 
       &.has-active {
         > a {
-          border-top: $menu-bar-menu-item-hover-border-top;
-          border-bottom: $menu-bar-menu-item-hover-border-bottom;
-          border-left: $menu-bar-menu-item-hover-border-left;
-          border-right: $menu-bar-menu-item-hover-border-right;
-          color: $menu-bar-menu-item-hover-color;
+          color: $menu-bar-menu-item-active-color;
+          background: $menu-bar-menu-item-active-background;
+          border-top: $menu-bar-menu-item-active-border-top;
+          border-bottom: $menu-bar-menu-item-active-border-bottom;
+          border-left: $menu-bar-menu-item-active-border-left;
+          border-right: $menu-bar-menu-item-active-border-right;
+
+          &:hover {
+            color: $menu-bar-menu-item-hover-color;
+            background: $menu-bar-menu-item-hover-background;
+            border-top: $menu-bar-menu-item-hover-border-top;
+            border-bottom: $menu-bar-menu-item-hover-border-bottom;
+            border-left: $menu-bar-menu-item-hover-border-left;
+            border-right: $menu-bar-menu-item-hover-border-right;
+          }
         }
       }
     }

diff --git a/src/scss/boilerplate/_variables.scss b/src/scss/boilerplate/_variables.scss
@@ -40,6 +40,7 @@ $font-family-heading: $font-default-font-family-secondary !default;
 $font-family-heading-color: $color-boilerplate-black !default;
 $font-family-heading-font-weight: 300 !default;
 $font-family-heading-line-height: 1.1 !default;
+$font-family-heading-text-transform: none !default;
 
 /* H1 */
 $font-family-heading-h1-font-size: 40px !default;
@@ -116,24 +117,28 @@ $font-filter-title-font-weight: 700 !default;
 $font-filter-title-line-height: 1.421617 !default;
 $font-filter-title-margin: 0 0 20px 0 !default;
 $font-filter-title-color: $font-default-color !default;
+$font-filter-title-text-transform: none !default;
 
 $font-filter-subtitle-font-size: $font-default-font-size !default;
 $font-filter-subtitle-font-weight: 700 !default;
 $font-filter-subtitle-line-height: 1.421617 !default;
 $font-filter-subtitle-margin: 0 0 10px 0 !default;
 $font-filter-subtitle-color: $font-default-color !default;
+$font-filter-subtitle-text-transform: none !default;
 
 $font-filter-options-title-font-size: $font-default-font-size !default;
 $font-filter-options-title-font-weight: 700 !default;
 $font-filter-options-title-line-height: 1.421617 !default;
 $font-filter-options-title-margin: 0 0 10px 0 !default;
 $font-filter-options-title-color: $font-default-color !default;
+$font-filter-options-title-text-transform: none !default;
 
 $font-product-item-name-font-size: $font-default-font-size !default;
 $font-product-item-name-font-weight: $font-default-font-weight !default;
 $font-product-item-name-line-height: $font-default-font-line-height !default;
 $font-product-item-name-margin: 5px 0px !default;
 $font-product-item-name-color: $font-default-color !default;
+$font-product-item-name-text-transform: none !default;
 
 /*
  * Buttons
@@ -449,12 +454,23 @@ $menu-bar-menu-item-font-family: $font-default-font-family-primary !default;
 $menu-bar-menu-item-font-weight: 700 !default;
 $menu-bar-menu-item-font-size: $font-default-font-size !default;
 $menu-bar-menu-item-color: $color-boilerplate-gray !default;
+
 $menu-bar-menu-item-hover-color: $color-boilerplate-black !default;
 $menu-bar-menu-item-hover-default-border: 3px solid $color-boilerplate-orange !default;
 $menu-bar-menu-item-hover-border-top: none !default;
 $menu-bar-menu-item-hover-border-bottom: $menu-bar-menu-item-hover-default-border !default;
 $menu-bar-menu-item-hover-border-left: none !default;
 $menu-bar-menu-item-hover-border-right: none !default;
+$menu-bar-menu-item-hover-background: $menu-bar-background !default;
+
+$menu-bar-menu-item-active-color: $menu-bar-menu-item-hover-color !default;
+$menu-bar-menu-item-active-default-border: $menu-bar-menu-item-hover-default-border !default;
+$menu-bar-menu-item-active-border-top: $menu-bar-menu-item-hover-border-top !default;
+$menu-bar-menu-item-active-border-bottom: $menu-bar-menu-item-hover-border-bottom !default;
+$menu-bar-menu-item-active-border-left: $menu-bar-menu-item-hover-border-left !default;
+$menu-bar-menu-item-active-border-right: $menu-bar-menu-item-hover-border-right !default;
+$menu-bar-menu-item-active-background: $menu-bar-menu-item-hover-background !default;
+
 $menu-bar-menu-item-submenu-background: #ffffff !default;
 $menu-bar-menu-item-submenu-item-color: $color-boilerplate-black !default;
 $menu-bar-menu-item-submenu-item-border-color: $color-boilerplate-orange !default;
@@ -509,7 +525,19 @@ $form-fieldset-field-control-float: none !default;
 $form-action-toolbar-margin: 20px 0 !default;
 $form-action-toolbar-padding: 0 !default;
 
-
+/* Toolbar */
+$toolbar-modes-mode-background: $color-boilerplate-light-gray !default;
+$toolbar-modes-mode-border: 1px solid $color-boilerplate-gray !default;
+$toolbar-modes-mode-color: $color-boilerplate-gray !default;
+$toolbar-modes-mode-padding: 7px 10px !default;
+$toolbar-modes-mode-hover-background: $color-boilerplate-lighter-gray !default;
+$toolbar-modes-mode-hover-border: $toolbar-modes-mode-border !default;
+$toolbar-modes-mode-hover-color: $toolbar-modes-mode-color !default;
+$toolbar-modes-mode-hover-padding: $toolbar-modes-mode-padding !default;
+$toolbar-modes-mode-active-background: $toolbar-modes-mode-background !default;
+$toolbar-modes-mode-active-border: $toolbar-modes-mode-border !default;
+$toolbar-modes-mode-active-color: $toolbar-modes-mode-color !default;
+$toolbar-modes-mode-active-padding: $toolbar-modes-mode-padding !default;
 
 
 /*