@madgex/design-system 1.15.2 → 1.15.5

package/dist/_tokens/css/_tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 11 Jul 2019 15:30:24 GMT
+ * Generated on Fri, 12 Jul 2019 10:03:40 GMT
  */
 
 :root {
@@ -10,7 +10,7 @@
  --mds-color-brand-1-dark: #15598e;
  --mds-color-brand-1-darkest: #082135;
  --mds-color-brand-2-base: #f0af11;
- --mds-color-brand-2-light: #f0af11;
+ --mds-color-brand-2-light: #f3c03f;
  --mds-color-brand-2-lightest: #fdf7e7;
  --mds-color-brand-2-dark: #c28d0c;
  --mds-color-brand-2-darkest: #3a2a04;
@@ -126,6 +126,6 @@
  --mds-size-container-max-width: 100%;
  --mds-size-wrapper-width: 100%;
  --mds-size-wrapper-max-width: 1280px;
- --mds-size-wrapper-padding: 2.5%;
+ --mds-size-wrapper-padding: 1.5%;
  --mds-size-surface-padding: 28px 32px;
 }

package/dist/_tokens/js/_tokens-module.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 11 Jul 2019 15:30:24 GMT
+ * Generated on Fri, 12 Jul 2019 10:03:40 GMT
  */
 
 module.exports = {
@@ -132,11 +132,11 @@ module.exports = {
           ]
         },
         "light": {
+          "value": "#f3c03f",
           "scssColorFunction": "lighten($mds-color-brand-2-base,10%)",
-          "value": "#f0af11",
           "original": {
-            "scssColorFunction": "lighten($mds-color-brand-2-base,10%)",
-            "value": "{color.brand.2.base.value}"
+            "value": "#f3c03f",
+            "scssColorFunction": "lighten($mds-color-brand-2-base,10%)"
           },
           "name": "MdsColorBrand2Light",
           "attributes": {
@@ -2579,9 +2579,9 @@ module.exports = {
         ]
       },
       "padding": {
-        "value": "2.5rem",
+        "value": "1.5rem",
         "original": {
-          "value": "2.5%"
+          "value": "1.5%"
         },
         "name": "MdsSizeWrapperPadding",
         "attributes": {

package/dist/_tokens/scss/_tokens.scss

@@ -1,7 +1,7 @@
 
 /*
   Do not edit directly
-  Generated on Thu, 11 Jul 2019 15:30:24 GMT
+  Generated on Fri, 12 Jul 2019 10:03:40 GMT
 */
 
 $mds-color-brand-1-base: #1b75bb !default;
@@ -10,7 +10,7 @@ $mds-color-brand-1-lightest: lighten($mds-color-brand-1-base,(95% - lightness($m
 $mds-color-brand-1-dark: darken($mds-color-brand-1-base,10%) !default;
 $mds-color-brand-1-darkest: darken($mds-color-brand-1-base,(lightness($mds-color-brand-1-base) - 12%)) !default;
 $mds-color-brand-2-base: #f0af11 !default;
-$mds-color-brand-2-light: #f0af11 !default;
+$mds-color-brand-2-light: lighten($mds-color-brand-2-base,10%) !default;
 $mds-color-brand-2-lightest: lighten($mds-color-brand-2-base,(95% - lightness($mds-color-brand-2-base))) !default;
 $mds-color-brand-2-dark: darken($mds-color-brand-2-base,10%) !default;
 $mds-color-brand-2-darkest: darken($mds-color-brand-2-base,(lightness($mds-color-brand-2-base) - 12%)) !default;
@@ -126,7 +126,7 @@ $mds-size-container-min-width: 0 !default;
 $mds-size-container-max-width: 100% !default;
 $mds-size-wrapper-width: 100% !default;
 $mds-size-wrapper-max-width: 1280px !default;
-$mds-size-wrapper-padding: 2.5% !default;
+$mds-size-wrapper-padding: 1.5% !default;
 $mds-size-surface-padding: 28px 32px !default;
 
 $tokens: (

package/dist/css/index.css

@@ -1,6 +1,6 @@
 /*
   Do not edit directly
-  Generated on Thu, 11 Jul 2019 15:30:24 GMT
+  Generated on Fri, 12 Jul 2019 10:03:40 GMT
 */
 html,
 body,
@@ -3565,16 +3565,10 @@ body {
 }
 
 .mds-wrapper {
-  width: 100%;
+  width: calc(100% - 20px);
   max-width: 1280px;
   margin: 0 auto;
-  padding: 0 2.5%;
-}
-
-@media (min-width: 80em) {
-  .mds-wrapper {
-    padding: 0;
-  }
+  padding: 0 1.5%;
 }
 
 .mds-surface {
@@ -4502,7 +4496,7 @@ body {
 }
 
 .mds-button:hover, .mds-button:focus {
-  background-color: #f0af11;
+  background-color: #f3bf41;
   text-decoration: none;
   color: #222222;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@madgex/design-system",
-  "version": "1.15.2",
+  "version": "1.15.5",
   "scripts": {
     "clean": "rimraf dist public tokens/build",
     "commit": "commit",

package/src/layout/containers/containers.njk

@@ -5,7 +5,7 @@
         <div class="mds-surface__inner">
           <h2>Content inside the site-container and wrapper</h2>
           <p>site-container is 100%</p>
-          <p>wrapper is 100% and max-width 1280px (2.5% left and right padding)</p>
+          <p>wrapper is 100% - 20px (gutter width) and max-width 1280px (1.5% left and right padding)</p>
         </div>
       </div>
     </div>

package/src/scss/core/_containers.scss

@@ -11,13 +11,10 @@ body {
   // box-shadow: $mds-color-container-box-shadow;
 }
 .mds-wrapper {
-  width: $mds-size-wrapper-width;
+  width: calc(#{$mds-size-wrapper-width} - #{$mds-size-gutter-width});
   max-width: $mds-size-wrapper-max-width;
   margin: 0 auto;
   padding: 0 $mds-size-wrapper-padding;
-  @include mq($from: xl) {
-    padding: 0;
-  }
 }
 
 .mds-surface {

package/src/tokens/color.json

@@ -23,8 +23,8 @@
       "2": {
         "base": { "value": "#f0af11" },
         "light": {
-          "scssColorFunction": "lighten($mds-color-brand-2-base,10%)",
-          "value": "{color.brand.2.base.value}"
+          "value": "#f3c03f",
+          "scssColorFunction": "lighten($mds-color-brand-2-base,10%)"
         },
         "lightest": {
           "value": "#fdf7e7",

package/src/tokens/size.json

@@ -35,7 +35,7 @@
         "value": "1280px"
       },
       "padding": {
-        "value": "2.5%"
+        "value": "1.5%"
       }
     },
     "surface": {