@mmb-digital/ds-lilly 1.0.0-alpha.72 → 1.0.0-alpha.74

package/cjs/ds-lilly.css

@@ -507,10 +507,10 @@ body {
 body.dark {
   --fgNeutralDefault: #F3F4F5;
   --fgNeutralDefault-rgb: hex-to-rgb(#F3F4F5);
-  --fgNeutralSubtle: #878D99;
-  --fgNeutralSubtle-rgb: hex-to-rgb(#878D99);
-  --fgNeutralSubtlest: #606773;
-  --fgNeutralSubtlest-rgb: hex-to-rgb(#606773);
+  --fgNeutralSubtle: #B2B6BF;
+  --fgNeutralSubtle-rgb: hex-to-rgb(#B2B6BF);
+  --fgNeutralSubtlest: #878D99;
+  --fgNeutralSubtlest-rgb: hex-to-rgb(#878D99);
   --fgBrandDefault: #E2CA99;
   --fgBrandDefault-rgb: hex-to-rgb(#E2CA99);
   --fgPromoDefault: #A58B4B;
@@ -531,8 +531,8 @@ body.dark {
   --fgSuccessDefault-rgb: hex-to-rgb(#4DD47A);
   --fgInverseDefault: #17181C;
   --fgInverseDefault-rgb: hex-to-rgb(#17181C);
-  --fgDisabledDefault: #606773;
-  --fgDisabledDefault-rgb: hex-to-rgb(#606773);
+  --fgDisabledDefault: #878D99;
+  --fgDisabledDefault-rgb: hex-to-rgb(#878D99);
   --fgWhiteDefault: #ffffff;
   --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
   --bgNeutralDefault: #101114;
@@ -690,7 +690,7 @@ body.dark {
   --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
   --thirdPartyTwitter: #1da1f2;
   --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
-  --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.8);
+  --boxShadowXXXSmall: 0px 1px 2px 0px rgba(25, 25, 25, 0.8);
   --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.9), 0 0 4px rgba(25, 25, 25, 0.8);
   --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.8), 0 0 8px rgba(25, 25, 25, 0.8);
   --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 1), 0 0 8px rgba(25, 25, 25, 0.8);
@@ -704,10 +704,10 @@ body.dark {
   body {
     --fgNeutralDefault: #F3F4F5;
     --fgNeutralDefault-rgb: hex-to-rgb(#F3F4F5);
-    --fgNeutralSubtle: #878D99;
-    --fgNeutralSubtle-rgb: hex-to-rgb(#878D99);
-    --fgNeutralSubtlest: #606773;
-    --fgNeutralSubtlest-rgb: hex-to-rgb(#606773);
+    --fgNeutralSubtle: #B2B6BF;
+    --fgNeutralSubtle-rgb: hex-to-rgb(#B2B6BF);
+    --fgNeutralSubtlest: #878D99;
+    --fgNeutralSubtlest-rgb: hex-to-rgb(#878D99);
     --fgBrandDefault: #E2CA99;
     --fgBrandDefault-rgb: hex-to-rgb(#E2CA99);
     --fgPromoDefault: #A58B4B;
@@ -728,8 +728,8 @@ body.dark {
     --fgSuccessDefault-rgb: hex-to-rgb(#4DD47A);
     --fgInverseDefault: #17181C;
     --fgInverseDefault-rgb: hex-to-rgb(#17181C);
-    --fgDisabledDefault: #606773;
-    --fgDisabledDefault-rgb: hex-to-rgb(#606773);
+    --fgDisabledDefault: #878D99;
+    --fgDisabledDefault-rgb: hex-to-rgb(#878D99);
     --fgWhiteDefault: #ffffff;
     --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
     --bgNeutralDefault: #101114;
@@ -887,7 +887,7 @@ body.dark {
     --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
     --thirdPartyTwitter: #1da1f2;
     --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
-    --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.8);
+    --boxShadowXXXSmall: 0px 1px 2px 0px rgba(25, 25, 25, 0.8);
     --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.9), 0 0 4px rgba(25, 25, 25, 0.8);
     --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.8), 0 0 8px rgba(25, 25, 25, 0.8);
     --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 1), 0 0 8px rgba(25, 25, 25, 0.8);
@@ -1295,7 +1295,7 @@ body {
   --backgroundHoverCard: var(--bgNeutralSubtlestHover);
   --borderCard: none;
   --borderRadiusCard: var(--borderRadiusMedium);
-  --boxShadowCard: none;
+  --boxShadowCard: var(--boxShadowXXSmall);
   --paddingCard: var(--spaceLarge);
   --backgroundSelectedCard: var(--bgNeutralSubtlest);
   --backgroundNeutralCard: var(--bgNeutralSubtle);
@@ -1619,7 +1619,7 @@ body {
   --backgroundMobilePanel: var(--surfaceRisen);
   --widthMobilePanel: 320px;
   --paddingBodyMobilePanel: var(--spaceSmall);
-  --backgroundSecondaryMobilePanel: var(--surfaceDefault);
+  --backgroundSecondaryMobilePanel: var(--bgNeutralDefault);
   --paddingBodySecondaryMobilePanel: var(--spaceLarge) var(--spaceXSmall);
   --backgroundHeaderMobilePanel: transparent;
   --colorHeaderMobilePanel: var(--fgWhiteDefault);
@@ -3276,13 +3276,12 @@ body.dark .l-header .c-logo__img--dark {
     width: var(--widthMobilePanel);
   }
 }
-@media screen and (min-width: 480px) {
-  .l-mobilePanel .m-menu__list {
-    display: block;
-  }
-  .l-mobilePanel .m-menu__list .m-menu__item {
-    margin-left: 0;
-  }
+.l-mobilePanel .m-menu__list {
+  display: block;
+}
+.l-mobilePanel .m-menu__list .m-menu__item {
+  margin-top: var(--marginTopItemSecondaryMenu);
+  margin-left: 0;
 }
 
 .l-mobilePanel--secondary {
@@ -9361,7 +9360,7 @@ body.dark .u-fg--fgWhiteDefault {
 /* Slider */
 .slick-loading .slick-list
 {
-    background: #fff url('assets/d247282430e0cba4961c.gif') center center no-repeat;
+    background: #fff url('assets/c71f76590920e4cc22e5.gif') center center no-repeat;
 }
 
 /* Icons */
@@ -9371,8 +9370,8 @@ body.dark .u-fg--fgWhiteDefault {
     font-weight: normal;
     font-style: normal;
 
-    src: url('assets/ecbb1c0fff07f5d10611.eot');
-    src: url('assets/1ba1eff575e4b8934232.eot') format('embedded-opentype'), url('assets/95bf0128466250deb764.woff') format('woff'), url('assets/834c5000cdc1b9730077.ttf') format('truetype'), url('assets/0c5d4b539aa9918307c8.svg') format('svg');
+    src: url('assets/1875095e1db5de1384cc.eot');
+    src: url('assets/291d450ee7f5804f9f83.eot') format('embedded-opentype'), url('assets/b34b6df87c41b252df2e.woff') format('woff'), url('assets/be27c6380c4038f8c885.ttf') format('truetype'), url('assets/de988486d03b4eee98d0.svg') format('svg');
 }
 /* Arrows */
 .slick-prev,

package/ds-lilly.css

@@ -507,10 +507,10 @@ body {
 body.dark {
   --fgNeutralDefault: #F3F4F5;
   --fgNeutralDefault-rgb: hex-to-rgb(#F3F4F5);
-  --fgNeutralSubtle: #878D99;
-  --fgNeutralSubtle-rgb: hex-to-rgb(#878D99);
-  --fgNeutralSubtlest: #606773;
-  --fgNeutralSubtlest-rgb: hex-to-rgb(#606773);
+  --fgNeutralSubtle: #B2B6BF;
+  --fgNeutralSubtle-rgb: hex-to-rgb(#B2B6BF);
+  --fgNeutralSubtlest: #878D99;
+  --fgNeutralSubtlest-rgb: hex-to-rgb(#878D99);
   --fgBrandDefault: #E2CA99;
   --fgBrandDefault-rgb: hex-to-rgb(#E2CA99);
   --fgPromoDefault: #A58B4B;
@@ -531,8 +531,8 @@ body.dark {
   --fgSuccessDefault-rgb: hex-to-rgb(#4DD47A);
   --fgInverseDefault: #17181C;
   --fgInverseDefault-rgb: hex-to-rgb(#17181C);
-  --fgDisabledDefault: #606773;
-  --fgDisabledDefault-rgb: hex-to-rgb(#606773);
+  --fgDisabledDefault: #878D99;
+  --fgDisabledDefault-rgb: hex-to-rgb(#878D99);
   --fgWhiteDefault: #ffffff;
   --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
   --bgNeutralDefault: #101114;
@@ -690,7 +690,7 @@ body.dark {
   --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
   --thirdPartyTwitter: #1da1f2;
   --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
-  --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.8);
+  --boxShadowXXXSmall: 0px 1px 2px 0px rgba(25, 25, 25, 0.8);
   --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.9), 0 0 4px rgba(25, 25, 25, 0.8);
   --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.8), 0 0 8px rgba(25, 25, 25, 0.8);
   --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 1), 0 0 8px rgba(25, 25, 25, 0.8);
@@ -704,10 +704,10 @@ body.dark {
   body {
     --fgNeutralDefault: #F3F4F5;
     --fgNeutralDefault-rgb: hex-to-rgb(#F3F4F5);
-    --fgNeutralSubtle: #878D99;
-    --fgNeutralSubtle-rgb: hex-to-rgb(#878D99);
-    --fgNeutralSubtlest: #606773;
-    --fgNeutralSubtlest-rgb: hex-to-rgb(#606773);
+    --fgNeutralSubtle: #B2B6BF;
+    --fgNeutralSubtle-rgb: hex-to-rgb(#B2B6BF);
+    --fgNeutralSubtlest: #878D99;
+    --fgNeutralSubtlest-rgb: hex-to-rgb(#878D99);
     --fgBrandDefault: #E2CA99;
     --fgBrandDefault-rgb: hex-to-rgb(#E2CA99);
     --fgPromoDefault: #A58B4B;
@@ -728,8 +728,8 @@ body.dark {
     --fgSuccessDefault-rgb: hex-to-rgb(#4DD47A);
     --fgInverseDefault: #17181C;
     --fgInverseDefault-rgb: hex-to-rgb(#17181C);
-    --fgDisabledDefault: #606773;
-    --fgDisabledDefault-rgb: hex-to-rgb(#606773);
+    --fgDisabledDefault: #878D99;
+    --fgDisabledDefault-rgb: hex-to-rgb(#878D99);
     --fgWhiteDefault: #ffffff;
     --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
     --bgNeutralDefault: #101114;
@@ -887,7 +887,7 @@ body.dark {
     --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
     --thirdPartyTwitter: #1da1f2;
     --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
-    --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.8);
+    --boxShadowXXXSmall: 0px 1px 2px 0px rgba(25, 25, 25, 0.8);
     --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.9), 0 0 4px rgba(25, 25, 25, 0.8);
     --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.8), 0 0 8px rgba(25, 25, 25, 0.8);
     --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 1), 0 0 8px rgba(25, 25, 25, 0.8);
@@ -1295,7 +1295,7 @@ body {
   --backgroundHoverCard: var(--bgNeutralSubtlestHover);
   --borderCard: none;
   --borderRadiusCard: var(--borderRadiusMedium);
-  --boxShadowCard: none;
+  --boxShadowCard: var(--boxShadowXXSmall);
   --paddingCard: var(--spaceLarge);
   --backgroundSelectedCard: var(--bgNeutralSubtlest);
   --backgroundNeutralCard: var(--bgNeutralSubtle);
@@ -1619,7 +1619,7 @@ body {
   --backgroundMobilePanel: var(--surfaceRisen);
   --widthMobilePanel: 320px;
   --paddingBodyMobilePanel: var(--spaceSmall);
-  --backgroundSecondaryMobilePanel: var(--surfaceDefault);
+  --backgroundSecondaryMobilePanel: var(--bgNeutralDefault);
   --paddingBodySecondaryMobilePanel: var(--spaceLarge) var(--spaceXSmall);
   --backgroundHeaderMobilePanel: transparent;
   --colorHeaderMobilePanel: var(--fgWhiteDefault);
@@ -3276,13 +3276,12 @@ body.dark .l-header .c-logo__img--dark {
     width: var(--widthMobilePanel);
   }
 }
-@media screen and (min-width: 480px) {
-  .l-mobilePanel .m-menu__list {
-    display: block;
-  }
-  .l-mobilePanel .m-menu__list .m-menu__item {
-    margin-left: 0;
-  }
+.l-mobilePanel .m-menu__list {
+  display: block;
+}
+.l-mobilePanel .m-menu__list .m-menu__item {
+  margin-top: var(--marginTopItemSecondaryMenu);
+  margin-left: 0;
 }
 
 .l-mobilePanel--secondary {
@@ -9361,7 +9360,7 @@ body.dark .u-fg--fgWhiteDefault {
 /* Slider */
 .slick-loading .slick-list
 {
-    background: #fff url('assets/7c5d7c26d45ddf549029.gif') center center no-repeat;
+    background: #fff url('assets/caeac5d74c2900040429.gif') center center no-repeat;
 }
 
 /* Icons */
@@ -9371,8 +9370,8 @@ body.dark .u-fg--fgWhiteDefault {
     font-weight: normal;
     font-style: normal;
 
-    src: url('assets/ec3f183067a8fb675887.eot');
-    src: url('assets/ad48d57394cc5600912c.eot') format('embedded-opentype'), url('assets/fd675eae14cc1ca4a046.woff') format('woff'), url('assets/4e676859437e20b3d78a.ttf') format('truetype'), url('assets/35458b4660cee33a016b.svg') format('svg');
+    src: url('assets/9494026c260c1d92b72c.eot');
+    src: url('assets/2c79dbdb0431807460c8.eot') format('embedded-opentype'), url('assets/1b3990e704b65fba4ffd.woff') format('woff'), url('assets/3b64c3b61aa3cba4f848.ttf') format('truetype'), url('assets/038ac9d7125e6b9e945e.svg') format('svg');
 }
 /* Arrows */
 .slick-prev,

package/package.json

@@ -3,7 +3,7 @@
   "module": "./index.js",
   "typings": "./index.d.ts",
   "name": "@mmb-digital/ds-lilly",
-  "version": "1.0.0-alpha.72",
+  "version": "1.0.0-alpha.74",
   "description": "MMB LILLY design system",
   "license": "UNLICENSED",
   "sideEffects": [