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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/cjs/ds-lilly.css +82 -68
  2. package/ds-lilly.css +82 -68
  3. package/package.json +1 -1
  4. /package/assets/{2f053ab0e128df691f94.svg → 0c5d4b539aa9918307c8.svg} +0 -0
  5. /package/assets/{363209d6cf942c41f596.eot → 1ba1eff575e4b8934232.eot} +0 -0
  6. /package/assets/{8de13b85460e89be43c6.svg → 35458b4660cee33a016b.svg} +0 -0
  7. /package/assets/{1d95eb279cc9b44eb269.ttf → 4e676859437e20b3d78a.ttf} +0 -0
  8. /package/assets/{3eca5ef480c76325540d.gif → 7c5d7c26d45ddf549029.gif} +0 -0
  9. /package/assets/{e0c0769e303ae6aa201d.ttf → 834c5000cdc1b9730077.ttf} +0 -0
  10. /package/assets/{2dce70066c6fc24dfe5b.woff → 95bf0128466250deb764.woff} +0 -0
  11. /package/assets/{4514baae928d0379ee2d.eot → ad48d57394cc5600912c.eot} +0 -0
  12. /package/assets/{a273bcea4863bee8bdbe.gif → d247282430e0cba4961c.gif} +0 -0
  13. /package/assets/{a46264bae19a0e88a5e4.eot → ec3f183067a8fb675887.eot} +0 -0
  14. /package/assets/{ea268e20084258e2a5c0.eot → ecbb1c0fff07f5d10611.eot} +0 -0
  15. /package/assets/{a23e266c2fc9bb9c8205.woff → fd675eae14cc1ca4a046.woff} +0 -0
package/cjs/ds-lilly.css CHANGED
@@ -342,8 +342,8 @@ body {
342
342
  --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
343
343
  --bgNeutralDefault: #E8EAED;
344
344
  --bgNeutralDefault-rgb: hex-to-rgb(#E8EAED);
345
- --bgNeutralDefaultHover: #D5D7DD;
346
- --bgNeutralDefaultHover-rgb: hex-to-rgb(#D5D7DD);
345
+ --bgNeutralDefaultHover: #DFE1E5;
346
+ --bgNeutralDefaultHover-rgb: hex-to-rgb(#DFE1E5);
347
347
  --bgNeutralDefaultActive: #A0A5B1;
348
348
  --bgNeutralDefaultActive-rgb: hex-to-rgb(#A0A5B1);
349
349
  --bgNeutralSubtle: #F3F4F5;
@@ -495,7 +495,7 @@ body {
495
495
  --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
496
496
  --thirdPartyTwitter: #1da1f2;
497
497
  --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
498
- --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
498
+ --boxShadowXXXSmall: 0px 1px 2px 0px rgba(25, 25, 25, 0.08);
499
499
  --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.1), 0 0 4px rgba(25, 25, 25, 0.05);
500
500
  --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.05), 0 0 8px rgba(25, 25, 25, 0.05);
501
501
  --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 0.2), 0 0 8px rgba(25, 25, 25, 0.05);
@@ -531,26 +531,26 @@ body.dark {
531
531
  --fgSuccessDefault-rgb: hex-to-rgb(#4DD47A);
532
532
  --fgInverseDefault: #17181C;
533
533
  --fgInverseDefault-rgb: hex-to-rgb(#17181C);
534
- --fgDisabledDefault: #32363E;
535
- --fgDisabledDefault-rgb: hex-to-rgb(#32363E);
534
+ --fgDisabledDefault: #606773;
535
+ --fgDisabledDefault-rgb: hex-to-rgb(#606773);
536
536
  --fgWhiteDefault: #ffffff;
537
537
  --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
538
538
  --bgNeutralDefault: #101114;
539
539
  --bgNeutralDefault-rgb: hex-to-rgb(#101114);
540
- --bgNeutralDefaultHover: #17181C;
541
- --bgNeutralDefaultHover-rgb: hex-to-rgb(#17181C);
540
+ --bgNeutralDefaultHover: #131417;
541
+ --bgNeutralDefaultHover-rgb: hex-to-rgb(#131417);
542
542
  --bgNeutralDefaultActive: #1D1F24;
543
543
  --bgNeutralDefaultActive-rgb: hex-to-rgb(#1D1F24);
544
544
  --bgNeutralSubtle: #17181C;
545
545
  --bgNeutralSubtle-rgb: hex-to-rgb(#17181C);
546
- --bgNeutralSubtleHover: #1D1F24;
547
- --bgNeutralSubtleHover-rgb: hex-to-rgb(#1D1F24);
546
+ --bgNeutralSubtleHover: #1B1C21;
547
+ --bgNeutralSubtleHover-rgb: hex-to-rgb(#1B1C21);
548
548
  --bgNeutralSubtleActive: #27292E;
549
549
  --bgNeutralSubtleActive-rgb: hex-to-rgb(#27292E);
550
550
  --bgNeutralSubtlest: #1D1F24;
551
551
  --bgNeutralSubtlest-rgb: hex-to-rgb(#1D1F24);
552
- --bgNeutralSubtlestHover: #27292E;
553
- --bgNeutralSubtlestHover-rgb: hex-to-rgb(#27292E);
552
+ --bgNeutralSubtlestHover: #222429;
553
+ --bgNeutralSubtlestHover-rgb: hex-to-rgb(#222429);
554
554
  --bgNeutralSubtlestActive: #35373D;
555
555
  --bgNeutralSubtlestActive-rgb: hex-to-rgb(#35373D);
556
556
  --bgBrandDefault: #524326;
@@ -690,12 +690,12 @@ body.dark {
690
690
  --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
691
691
  --thirdPartyTwitter: #1da1f2;
692
692
  --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
693
- --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
694
- --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.1), 0 0 4px rgba(25, 25, 25, 0.05);
695
- --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.05), 0 0 8px rgba(25, 25, 25, 0.05);
696
- --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 0.2), 0 0 8px rgba(25, 25, 25, 0.05);
697
- --boxShadowLarge: 0 2px 8px rgba(25, 25, 25, 0.1), 0 0 16px rgba(25, 25, 25, 0.1);
698
- --boxShadowXLarge: 0 8px 16px rgba(25, 25, 25, 0.1), 0 0 24px rgba(25, 25, 25, 0.2);
693
+ --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.8);
694
+ --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.9), 0 0 4px rgba(25, 25, 25, 0.8);
695
+ --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.8), 0 0 8px rgba(25, 25, 25, 0.8);
696
+ --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 1), 0 0 8px rgba(25, 25, 25, 0.8);
697
+ --boxShadowLarge: 0 2px 8px rgba(25, 25, 25, 0.9), 0 0 16px rgba(25, 25, 25, 0.9);
698
+ --boxShadowXLarge: 0 8px 16px rgba(25, 25, 25, 0.9), 0 0 24px rgba(25, 25, 25, 1);
699
699
  }
700
700
 
701
701
  /* Styles for users who prefer dark mode at the OS level */
@@ -728,26 +728,26 @@ body.dark {
728
728
  --fgSuccessDefault-rgb: hex-to-rgb(#4DD47A);
729
729
  --fgInverseDefault: #17181C;
730
730
  --fgInverseDefault-rgb: hex-to-rgb(#17181C);
731
- --fgDisabledDefault: #32363E;
732
- --fgDisabledDefault-rgb: hex-to-rgb(#32363E);
731
+ --fgDisabledDefault: #606773;
732
+ --fgDisabledDefault-rgb: hex-to-rgb(#606773);
733
733
  --fgWhiteDefault: #ffffff;
734
734
  --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
735
735
  --bgNeutralDefault: #101114;
736
736
  --bgNeutralDefault-rgb: hex-to-rgb(#101114);
737
- --bgNeutralDefaultHover: #17181C;
738
- --bgNeutralDefaultHover-rgb: hex-to-rgb(#17181C);
737
+ --bgNeutralDefaultHover: #131417;
738
+ --bgNeutralDefaultHover-rgb: hex-to-rgb(#131417);
739
739
  --bgNeutralDefaultActive: #1D1F24;
740
740
  --bgNeutralDefaultActive-rgb: hex-to-rgb(#1D1F24);
741
741
  --bgNeutralSubtle: #17181C;
742
742
  --bgNeutralSubtle-rgb: hex-to-rgb(#17181C);
743
- --bgNeutralSubtleHover: #1D1F24;
744
- --bgNeutralSubtleHover-rgb: hex-to-rgb(#1D1F24);
743
+ --bgNeutralSubtleHover: #1B1C21;
744
+ --bgNeutralSubtleHover-rgb: hex-to-rgb(#1B1C21);
745
745
  --bgNeutralSubtleActive: #27292E;
746
746
  --bgNeutralSubtleActive-rgb: hex-to-rgb(#27292E);
747
747
  --bgNeutralSubtlest: #1D1F24;
748
748
  --bgNeutralSubtlest-rgb: hex-to-rgb(#1D1F24);
749
- --bgNeutralSubtlestHover: #27292E;
750
- --bgNeutralSubtlestHover-rgb: hex-to-rgb(#27292E);
749
+ --bgNeutralSubtlestHover: #222429;
750
+ --bgNeutralSubtlestHover-rgb: hex-to-rgb(#222429);
751
751
  --bgNeutralSubtlestActive: #35373D;
752
752
  --bgNeutralSubtlestActive-rgb: hex-to-rgb(#35373D);
753
753
  --bgBrandDefault: #524326;
@@ -887,12 +887,12 @@ body.dark {
887
887
  --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
888
888
  --thirdPartyTwitter: #1da1f2;
889
889
  --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
890
- --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
891
- --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.1), 0 0 4px rgba(25, 25, 25, 0.05);
892
- --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.05), 0 0 8px rgba(25, 25, 25, 0.05);
893
- --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 0.2), 0 0 8px rgba(25, 25, 25, 0.05);
894
- --boxShadowLarge: 0 2px 8px rgba(25, 25, 25, 0.1), 0 0 16px rgba(25, 25, 25, 0.1);
895
- --boxShadowXLarge: 0 8px 16px rgba(25, 25, 25, 0.1), 0 0 24px rgba(25, 25, 25, 0.2);
890
+ --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.8);
891
+ --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.9), 0 0 4px rgba(25, 25, 25, 0.8);
892
+ --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.8), 0 0 8px rgba(25, 25, 25, 0.8);
893
+ --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 1), 0 0 8px rgba(25, 25, 25, 0.8);
894
+ --boxShadowLarge: 0 2px 8px rgba(25, 25, 25, 0.9), 0 0 16px rgba(25, 25, 25, 0.9);
895
+ --boxShadowXLarge: 0 8px 16px rgba(25, 25, 25, 0.9), 0 0 24px rgba(25, 25, 25, 1);
896
896
  }
897
897
  /* Override dark mode with light mode styles if the user decides to swap */
898
898
  body.light {
@@ -928,8 +928,8 @@ body.dark {
928
928
  --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
929
929
  --bgNeutralDefault: #E8EAED;
930
930
  --bgNeutralDefault-rgb: hex-to-rgb(#E8EAED);
931
- --bgNeutralDefaultHover: #D5D7DD;
932
- --bgNeutralDefaultHover-rgb: hex-to-rgb(#D5D7DD);
931
+ --bgNeutralDefaultHover: #DFE1E5;
932
+ --bgNeutralDefaultHover-rgb: hex-to-rgb(#DFE1E5);
933
933
  --bgNeutralDefaultActive: #A0A5B1;
934
934
  --bgNeutralDefaultActive-rgb: hex-to-rgb(#A0A5B1);
935
935
  --bgNeutralSubtle: #F3F4F5;
@@ -1081,7 +1081,7 @@ body.dark {
1081
1081
  --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
1082
1082
  --thirdPartyTwitter: #1da1f2;
1083
1083
  --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
1084
- --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
1084
+ --boxShadowXXXSmall: 0px 1px 2px 0px rgba(25, 25, 25, 0.08);
1085
1085
  --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.1), 0 0 4px rgba(25, 25, 25, 0.05);
1086
1086
  --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.05), 0 0 8px rgba(25, 25, 25, 0.05);
1087
1087
  --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 0.2), 0 0 8px rgba(25, 25, 25, 0.05);
@@ -1603,7 +1603,7 @@ body {
1603
1603
  --paddingAvatarListFileUpload: var(--spaceMedium);
1604
1604
  --backgroundBody: var(--surfaceDefault);
1605
1605
  --minWidthBody: 320px;
1606
- --maxWidthCenterMain: 740px + 2 * var(--spaceXLarge);
1606
+ --maxWidthCenterMain: 800px + 2 * var(--spaceXLarge);
1607
1607
  --backgroundHeader: var(--surfaceRisen);
1608
1608
  --boxShadowHeader: var(--boxShadowXXXSmall);
1609
1609
  --colorHeader: var(--fgNeutralDefault);
@@ -1618,12 +1618,12 @@ body {
1618
1618
  --paddingMobileHeader: 0 var(--spaceMedium);
1619
1619
  --backgroundMobilePanel: var(--surfaceRisen);
1620
1620
  --widthMobilePanel: 320px;
1621
- --paddingBodyMobilePanel: var(--spaceLarge);
1622
- --backgroundSecondaryMobilePanel: var(--bgNeutralDefault);
1621
+ --paddingBodyMobilePanel: var(--spaceSmall);
1622
+ --backgroundSecondaryMobilePanel: var(--surfaceDefault);
1623
1623
  --paddingBodySecondaryMobilePanel: var(--spaceLarge) var(--spaceXSmall);
1624
- --backgroundHeaderMobilePanel: var(--gradientBlueRedDark);
1625
- --colorHeaderMobilePanel: var(--fgInverseDefault);
1626
- --paddingHeaderMobilePanel: var(--spaceLarge) var(--spaceXSmall) var(--spaceLarge) var(--spaceLarge);
1624
+ --backgroundHeaderMobilePanel: transparent;
1625
+ --colorHeaderMobilePanel: var(--fgWhiteDefault);
1626
+ --paddingHeaderMobilePanel: var(--spaceSmall) var(--spaceXSmall) var(--spaceXSmall) var(--spaceSmall);
1627
1627
  --colorHeaderImageMobilePanel: var(--fgBrandDefault);
1628
1628
  --backgroundHeaderSecondaryMobilePanel: transparent;
1629
1629
  --colorHeaderSecondaryMobilePanel: var(--fgNeutralDefault);
@@ -1660,13 +1660,14 @@ body {
1660
1660
  --widthSelectedMenuItem: calc(100% - 4px);
1661
1661
  --marginSelectedMenuItem: 2px;
1662
1662
  --backgroundSubmenu: var(--bgNeutralDefault);
1663
- --colorLinkMobileMenu: var(--fgBrandDefault);
1664
- --colorLinkHoverMobileMenu: var(--fgLinkDefaultHover);
1665
- --colorLinkActiveMobileMenu: var(--fgLinkDefaultPressed);
1666
- --colorLinkSelectedMobileMenu: var(--fgBrandDefault);
1663
+ --colorLinkMobileMenu: var(--fgWhiteDefault);
1664
+ --colorLinkHoverMobileMenu: var(--fgWhiteDefault);
1665
+ --colorLinkActiveMobileMenu: var(--fgWhiteDefault);
1666
+ --colorLinkSelectedMobileMenu: var(--fgWhiteDefault);
1667
1667
  --fontSizeListMobileMenu: var(--fontSizeSmall);
1668
1668
  --marginTopItemMobileMenu: 0;
1669
- --paddingLinkMobileMenu: var(--spaceMedium) var(--spaceXSmall);
1669
+ --paddingLinkMobileMenu: var(--spaceSmall) var(--spaceSmall);
1670
+ --colorIconLinkMobileMenu: var(--fgWhiteDefault);
1670
1671
  --fontSizeTitleStepper: var(--fontSizeXSmall);
1671
1672
  --fontSizeIconStepper: var(--fontSizeSmall);
1672
1673
  --fontWeightIconStepper: var(--fontWeightBold);
@@ -1893,7 +1894,7 @@ body:not(.user-is-tabbing) *:focus {
1893
1894
  .l-app--fixedHeader {
1894
1895
  padding-top: var(--heightMobileHeader);
1895
1896
  }
1896
- @media screen and (min-width: 992px) {
1897
+ @media screen and (min-width: 1200px) {
1897
1898
  .l-app--fixedHeader {
1898
1899
  padding-top: var(--heightHeader);
1899
1900
  }
@@ -1915,7 +1916,7 @@ body:not(.user-is-tabbing) *:focus {
1915
1916
  position: fixed;
1916
1917
  top: var(--heightMobileHeader);
1917
1918
  }
1918
- @media screen and (min-width: 992px) {
1919
+ @media screen and (min-width: 1200px) {
1919
1920
  .l-app--fixedMenuMain .l-content > .m-menu--main {
1920
1921
  top: var(--heightHeader);
1921
1922
  }
@@ -1943,7 +1944,7 @@ body {
1943
1944
  display: flex;
1944
1945
  min-height: calc(100vh - var(--heightMobileHeader));
1945
1946
  }
1946
- @media screen and (min-width: 992px) {
1947
+ @media screen and (min-width: 1200px) {
1947
1948
  .l-content {
1948
1949
  min-height: calc(100vh - var(--heightHeader));
1949
1950
  }
@@ -3164,7 +3165,7 @@ body {
3164
3165
  margin-right: var(--spaceXSmall);
3165
3166
  }
3166
3167
 
3167
- @media screen and (max-width: 991px) {
3168
+ @media screen and (max-width: 1199px) {
3168
3169
  .l-header .m-menu .m-menu__text {
3169
3170
  border: 0;
3170
3171
  clip: rect(0 0 0 0);
@@ -3180,7 +3181,7 @@ body {
3180
3181
  margin-left: calc(var(--spaceXSmall) / 2);
3181
3182
  }
3182
3183
  }
3183
- @media screen and (min-width: 992px) {
3184
+ @media screen and (min-width: 1200px) {
3184
3185
  .l-header {
3185
3186
  height: var(--heightHeader);
3186
3187
  padding: var(--paddingHeader);
@@ -3256,6 +3257,7 @@ body.dark .l-header .c-logo__img--dark {
3256
3257
  }
3257
3258
  }
3258
3259
  .l-mobilePanel--main {
3260
+ background: var(--backgroundMainMenu);
3259
3261
  z-index: 1600;
3260
3262
  }
3261
3263
  .l-mobilePanel .m-menu + .m-menu {
@@ -3274,6 +3276,14 @@ body.dark .l-header .c-logo__img--dark {
3274
3276
  width: var(--widthMobilePanel);
3275
3277
  }
3276
3278
  }
3279
+ @media screen and (min-width: 480px) {
3280
+ .l-mobilePanel .m-menu__list {
3281
+ display: block;
3282
+ }
3283
+ .l-mobilePanel .m-menu__list .m-menu__item {
3284
+ margin-left: 0;
3285
+ }
3286
+ }
3277
3287
 
3278
3288
  .l-mobilePanel--secondary {
3279
3289
  background: var(--backgroundSecondaryMobilePanel);
@@ -3310,12 +3320,8 @@ body.dark .l-header .c-logo__img--dark {
3310
3320
  order: 1;
3311
3321
  }
3312
3322
  .l-mobilePanel__header .l-mobilePanel__close {
3313
- color: var(--fgInverseDefault);
3314
3323
  order: 2;
3315
3324
  }
3316
- .l-mobilePanel__header .l-mobilePanel__close:hover, .l-mobilePanel__header .l-mobilePanel__close:focus {
3317
- color: var(--fgInverseDefault);
3318
- }
3319
3325
 
3320
3326
  .l-mobilePanel__headerImage {
3321
3327
  margin-right: var(--spaceMedium);
@@ -6626,7 +6632,7 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
6626
6632
  display: none;
6627
6633
  }
6628
6634
  .custom-datepicker .react-datepicker-header {
6629
- background: var(--bgBrandDefaultHover);
6635
+ background: var(--bgNeutralDefault);
6630
6636
  padding-top: 0.25rem;
6631
6637
  padding-bottom: 0.25rem;
6632
6638
  align-items: center;
@@ -6643,11 +6649,11 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
6643
6649
  border-bottom: none;
6644
6650
  }
6645
6651
  .custom-datepicker .react-datepicker__day-names {
6646
- background: var(--bgBrandBold);
6652
+ background: var(--bgNeutralSubtle);
6647
6653
  margin-bottom: 8px;
6648
6654
  }
6649
6655
  .custom-datepicker .react-datepicker__day-names > * {
6650
- color: var(--fgInverseDefault) !important;
6656
+ color: var(--fgNeutralDefault) !important;
6651
6657
  }
6652
6658
  .custom-datepicker .react-datepicker__month-text, .custom-datepicker .react-datepicker__year-text, .custom-datepicker .react-datepicker__day {
6653
6659
  width: 2.25rem;
@@ -6679,13 +6685,14 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
6679
6685
  .custom-datepicker .react-datepicker__month-text--keyboard-selected, .custom-datepicker .react-datepicker__year-text--keyboard-selected, .custom-datepicker .react-datepicker__day--keyboard-selected {
6680
6686
  background-color: unset;
6681
6687
  }
6682
- .custom-datepicker .react-datepicker__month-text--selected, .custom-datepicker .react-datepicker__year-text--selected, .custom-datepicker .react-datepicker__day--selected {
6683
- background: var(--bgBrandBold);
6684
- border-color: var(--borderBrandDefault);
6685
- color: var(--fgInverseDefault);
6686
- }
6687
6688
  .custom-datepicker .react-datepicker__month-text--today, .custom-datepicker .react-datepicker__year-text--today, .custom-datepicker .react-datepicker__day--today {
6688
6689
  font-weight: normal;
6690
+ border-radius: 50% !important;
6691
+ }
6692
+ .custom-datepicker .react-datepicker__month-text--today.react-datepicker__day--selected, .custom-datepicker .react-datepicker__year-text--today.react-datepicker__day--selected, .custom-datepicker .react-datepicker__day--today.react-datepicker__day--selected {
6693
+ background: var(--bgBrandBold) !important;
6694
+ border-color: var(--borderBrandDefault) !important;
6695
+ color: var(--fgInverseDefault) !important;
6689
6696
  }
6690
6697
  .custom-datepicker .react-datepicker__month-text--today:not(.react-datepicker__month-text--disabled,
6691
6698
  .react-datepicker__year-text--disabled,
@@ -6714,6 +6721,11 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
6714
6721
  background: var(--bgBrandDefaultHover);
6715
6722
  border-color: var(--borderNeutralDefault);
6716
6723
  }
6724
+ .custom-datepicker .react-datepicker__month-text--selected, .custom-datepicker .react-datepicker__year-text--selected, .custom-datepicker .react-datepicker__day--selected {
6725
+ background: var(--bgBrandBold);
6726
+ border-color: var(--borderBrandDefault);
6727
+ color: var(--fgInverseDefault);
6728
+ }
6717
6729
  .custom-datepicker .react-datepicker__year-text, .custom-datepicker .react-datepicker__month-text {
6718
6730
  text-transform: capitalize;
6719
6731
  border-radius: 20px !important;
@@ -7489,7 +7501,7 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
7489
7501
  .m-menu--main .m-menu__link .c-avatar {
7490
7502
  color: var(--colorIconLinkMainMenu);
7491
7503
  }
7492
- @media screen and (max-width: 991px) {
7504
+ @media screen and (max-width: 1199px) {
7493
7505
  .m-menu--main .m-menu {
7494
7506
  display: none;
7495
7507
  }
@@ -7513,7 +7525,7 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
7513
7525
  .m-menu--secondary .m-menu__item--open .m-menu__subMenu {
7514
7526
  padding-top: var(--marginTopItemSecondaryMenu);
7515
7527
  }
7516
- @media screen and (max-width: 991px) {
7528
+ @media screen and (max-width: 1199px) {
7517
7529
  .m-menu--secondary .m-menu {
7518
7530
  display: none;
7519
7531
  }
@@ -7564,6 +7576,7 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
7564
7576
  margin-top: var(--marginTopItemMobileMenu);
7565
7577
  }
7566
7578
  .m-menu--mobile .m-menu__item--selected .m-menu__link {
7579
+ background: var(--backgroundLinkSelectedMainMenu);
7567
7580
  color: var(--colorLinkSelectedMobileMenu);
7568
7581
  font-weight: var(--fontWeightBold);
7569
7582
  }
@@ -7577,8 +7590,9 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
7577
7590
  .m-menu--mobile .m-menu__link:active {
7578
7591
  color: var(--colorLinkActiveMobileMenu);
7579
7592
  }
7580
- .m-menu--mobile .c-avatar {
7593
+ .m-menu--mobile .m-menu__link .c-avatar {
7581
7594
  flex: 0 0 24px;
7595
+ color: var(--colorIconLinkMobileMenu);
7582
7596
  }
7583
7597
 
7584
7598
  .m-stepper__list {
@@ -9347,7 +9361,7 @@ body.dark .u-fg--fgWhiteDefault {
9347
9361
  /* Slider */
9348
9362
  .slick-loading .slick-list
9349
9363
  {
9350
- background: #fff url('assets/a273bcea4863bee8bdbe.gif') center center no-repeat;
9364
+ background: #fff url('assets/d247282430e0cba4961c.gif') center center no-repeat;
9351
9365
  }
9352
9366
 
9353
9367
  /* Icons */
@@ -9357,8 +9371,8 @@ body.dark .u-fg--fgWhiteDefault {
9357
9371
  font-weight: normal;
9358
9372
  font-style: normal;
9359
9373
 
9360
- src: url('assets/4514baae928d0379ee2d.eot');
9361
- src: url('assets/ea268e20084258e2a5c0.eot') format('embedded-opentype'), url('assets/2dce70066c6fc24dfe5b.woff') format('woff'), url('assets/e0c0769e303ae6aa201d.ttf') format('truetype'), url('assets/8de13b85460e89be43c6.svg') format('svg');
9374
+ src: url('assets/ecbb1c0fff07f5d10611.eot');
9375
+ 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');
9362
9376
  }
9363
9377
  /* Arrows */
9364
9378
  .slick-prev,
package/ds-lilly.css CHANGED
@@ -342,8 +342,8 @@ body {
342
342
  --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
343
343
  --bgNeutralDefault: #E8EAED;
344
344
  --bgNeutralDefault-rgb: hex-to-rgb(#E8EAED);
345
- --bgNeutralDefaultHover: #D5D7DD;
346
- --bgNeutralDefaultHover-rgb: hex-to-rgb(#D5D7DD);
345
+ --bgNeutralDefaultHover: #DFE1E5;
346
+ --bgNeutralDefaultHover-rgb: hex-to-rgb(#DFE1E5);
347
347
  --bgNeutralDefaultActive: #A0A5B1;
348
348
  --bgNeutralDefaultActive-rgb: hex-to-rgb(#A0A5B1);
349
349
  --bgNeutralSubtle: #F3F4F5;
@@ -495,7 +495,7 @@ body {
495
495
  --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
496
496
  --thirdPartyTwitter: #1da1f2;
497
497
  --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
498
- --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
498
+ --boxShadowXXXSmall: 0px 1px 2px 0px rgba(25, 25, 25, 0.08);
499
499
  --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.1), 0 0 4px rgba(25, 25, 25, 0.05);
500
500
  --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.05), 0 0 8px rgba(25, 25, 25, 0.05);
501
501
  --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 0.2), 0 0 8px rgba(25, 25, 25, 0.05);
@@ -531,26 +531,26 @@ body.dark {
531
531
  --fgSuccessDefault-rgb: hex-to-rgb(#4DD47A);
532
532
  --fgInverseDefault: #17181C;
533
533
  --fgInverseDefault-rgb: hex-to-rgb(#17181C);
534
- --fgDisabledDefault: #32363E;
535
- --fgDisabledDefault-rgb: hex-to-rgb(#32363E);
534
+ --fgDisabledDefault: #606773;
535
+ --fgDisabledDefault-rgb: hex-to-rgb(#606773);
536
536
  --fgWhiteDefault: #ffffff;
537
537
  --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
538
538
  --bgNeutralDefault: #101114;
539
539
  --bgNeutralDefault-rgb: hex-to-rgb(#101114);
540
- --bgNeutralDefaultHover: #17181C;
541
- --bgNeutralDefaultHover-rgb: hex-to-rgb(#17181C);
540
+ --bgNeutralDefaultHover: #131417;
541
+ --bgNeutralDefaultHover-rgb: hex-to-rgb(#131417);
542
542
  --bgNeutralDefaultActive: #1D1F24;
543
543
  --bgNeutralDefaultActive-rgb: hex-to-rgb(#1D1F24);
544
544
  --bgNeutralSubtle: #17181C;
545
545
  --bgNeutralSubtle-rgb: hex-to-rgb(#17181C);
546
- --bgNeutralSubtleHover: #1D1F24;
547
- --bgNeutralSubtleHover-rgb: hex-to-rgb(#1D1F24);
546
+ --bgNeutralSubtleHover: #1B1C21;
547
+ --bgNeutralSubtleHover-rgb: hex-to-rgb(#1B1C21);
548
548
  --bgNeutralSubtleActive: #27292E;
549
549
  --bgNeutralSubtleActive-rgb: hex-to-rgb(#27292E);
550
550
  --bgNeutralSubtlest: #1D1F24;
551
551
  --bgNeutralSubtlest-rgb: hex-to-rgb(#1D1F24);
552
- --bgNeutralSubtlestHover: #27292E;
553
- --bgNeutralSubtlestHover-rgb: hex-to-rgb(#27292E);
552
+ --bgNeutralSubtlestHover: #222429;
553
+ --bgNeutralSubtlestHover-rgb: hex-to-rgb(#222429);
554
554
  --bgNeutralSubtlestActive: #35373D;
555
555
  --bgNeutralSubtlestActive-rgb: hex-to-rgb(#35373D);
556
556
  --bgBrandDefault: #524326;
@@ -690,12 +690,12 @@ body.dark {
690
690
  --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
691
691
  --thirdPartyTwitter: #1da1f2;
692
692
  --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
693
- --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
694
- --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.1), 0 0 4px rgba(25, 25, 25, 0.05);
695
- --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.05), 0 0 8px rgba(25, 25, 25, 0.05);
696
- --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 0.2), 0 0 8px rgba(25, 25, 25, 0.05);
697
- --boxShadowLarge: 0 2px 8px rgba(25, 25, 25, 0.1), 0 0 16px rgba(25, 25, 25, 0.1);
698
- --boxShadowXLarge: 0 8px 16px rgba(25, 25, 25, 0.1), 0 0 24px rgba(25, 25, 25, 0.2);
693
+ --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.8);
694
+ --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.9), 0 0 4px rgba(25, 25, 25, 0.8);
695
+ --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.8), 0 0 8px rgba(25, 25, 25, 0.8);
696
+ --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 1), 0 0 8px rgba(25, 25, 25, 0.8);
697
+ --boxShadowLarge: 0 2px 8px rgba(25, 25, 25, 0.9), 0 0 16px rgba(25, 25, 25, 0.9);
698
+ --boxShadowXLarge: 0 8px 16px rgba(25, 25, 25, 0.9), 0 0 24px rgba(25, 25, 25, 1);
699
699
  }
700
700
 
701
701
  /* Styles for users who prefer dark mode at the OS level */
@@ -728,26 +728,26 @@ body.dark {
728
728
  --fgSuccessDefault-rgb: hex-to-rgb(#4DD47A);
729
729
  --fgInverseDefault: #17181C;
730
730
  --fgInverseDefault-rgb: hex-to-rgb(#17181C);
731
- --fgDisabledDefault: #32363E;
732
- --fgDisabledDefault-rgb: hex-to-rgb(#32363E);
731
+ --fgDisabledDefault: #606773;
732
+ --fgDisabledDefault-rgb: hex-to-rgb(#606773);
733
733
  --fgWhiteDefault: #ffffff;
734
734
  --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
735
735
  --bgNeutralDefault: #101114;
736
736
  --bgNeutralDefault-rgb: hex-to-rgb(#101114);
737
- --bgNeutralDefaultHover: #17181C;
738
- --bgNeutralDefaultHover-rgb: hex-to-rgb(#17181C);
737
+ --bgNeutralDefaultHover: #131417;
738
+ --bgNeutralDefaultHover-rgb: hex-to-rgb(#131417);
739
739
  --bgNeutralDefaultActive: #1D1F24;
740
740
  --bgNeutralDefaultActive-rgb: hex-to-rgb(#1D1F24);
741
741
  --bgNeutralSubtle: #17181C;
742
742
  --bgNeutralSubtle-rgb: hex-to-rgb(#17181C);
743
- --bgNeutralSubtleHover: #1D1F24;
744
- --bgNeutralSubtleHover-rgb: hex-to-rgb(#1D1F24);
743
+ --bgNeutralSubtleHover: #1B1C21;
744
+ --bgNeutralSubtleHover-rgb: hex-to-rgb(#1B1C21);
745
745
  --bgNeutralSubtleActive: #27292E;
746
746
  --bgNeutralSubtleActive-rgb: hex-to-rgb(#27292E);
747
747
  --bgNeutralSubtlest: #1D1F24;
748
748
  --bgNeutralSubtlest-rgb: hex-to-rgb(#1D1F24);
749
- --bgNeutralSubtlestHover: #27292E;
750
- --bgNeutralSubtlestHover-rgb: hex-to-rgb(#27292E);
749
+ --bgNeutralSubtlestHover: #222429;
750
+ --bgNeutralSubtlestHover-rgb: hex-to-rgb(#222429);
751
751
  --bgNeutralSubtlestActive: #35373D;
752
752
  --bgNeutralSubtlestActive-rgb: hex-to-rgb(#35373D);
753
753
  --bgBrandDefault: #524326;
@@ -887,12 +887,12 @@ body.dark {
887
887
  --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
888
888
  --thirdPartyTwitter: #1da1f2;
889
889
  --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
890
- --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
891
- --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.1), 0 0 4px rgba(25, 25, 25, 0.05);
892
- --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.05), 0 0 8px rgba(25, 25, 25, 0.05);
893
- --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 0.2), 0 0 8px rgba(25, 25, 25, 0.05);
894
- --boxShadowLarge: 0 2px 8px rgba(25, 25, 25, 0.1), 0 0 16px rgba(25, 25, 25, 0.1);
895
- --boxShadowXLarge: 0 8px 16px rgba(25, 25, 25, 0.1), 0 0 24px rgba(25, 25, 25, 0.2);
890
+ --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.8);
891
+ --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.9), 0 0 4px rgba(25, 25, 25, 0.8);
892
+ --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.8), 0 0 8px rgba(25, 25, 25, 0.8);
893
+ --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 1), 0 0 8px rgba(25, 25, 25, 0.8);
894
+ --boxShadowLarge: 0 2px 8px rgba(25, 25, 25, 0.9), 0 0 16px rgba(25, 25, 25, 0.9);
895
+ --boxShadowXLarge: 0 8px 16px rgba(25, 25, 25, 0.9), 0 0 24px rgba(25, 25, 25, 1);
896
896
  }
897
897
  /* Override dark mode with light mode styles if the user decides to swap */
898
898
  body.light {
@@ -928,8 +928,8 @@ body.dark {
928
928
  --fgWhiteDefault-rgb: hex-to-rgb(#ffffff);
929
929
  --bgNeutralDefault: #E8EAED;
930
930
  --bgNeutralDefault-rgb: hex-to-rgb(#E8EAED);
931
- --bgNeutralDefaultHover: #D5D7DD;
932
- --bgNeutralDefaultHover-rgb: hex-to-rgb(#D5D7DD);
931
+ --bgNeutralDefaultHover: #DFE1E5;
932
+ --bgNeutralDefaultHover-rgb: hex-to-rgb(#DFE1E5);
933
933
  --bgNeutralDefaultActive: #A0A5B1;
934
934
  --bgNeutralDefaultActive-rgb: hex-to-rgb(#A0A5B1);
935
935
  --bgNeutralSubtle: #F3F4F5;
@@ -1081,7 +1081,7 @@ body.dark {
1081
1081
  --thirdPartyFacebook-rgb: hex-to-rgb(#4267b2);
1082
1082
  --thirdPartyTwitter: #1da1f2;
1083
1083
  --thirdPartyTwitter-rgb: hex-to-rgb(#1da1f2);
1084
- --boxShadowXXXSmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
1084
+ --boxShadowXXXSmall: 0px 1px 2px 0px rgba(25, 25, 25, 0.08);
1085
1085
  --boxShadowXXSmall: 0 2px 4px rgba(25, 25, 25, 0.1), 0 0 4px rgba(25, 25, 25, 0.05);
1086
1086
  --boxShadowSmall: 0 2px 4px rgba(25, 25, 25, 0.05), 0 0 8px rgba(25, 25, 25, 0.05);
1087
1087
  --boxShadowMedium: 0 2px 8px rgba(25, 25, 25, 0.2), 0 0 8px rgba(25, 25, 25, 0.05);
@@ -1603,7 +1603,7 @@ body {
1603
1603
  --paddingAvatarListFileUpload: var(--spaceMedium);
1604
1604
  --backgroundBody: var(--surfaceDefault);
1605
1605
  --minWidthBody: 320px;
1606
- --maxWidthCenterMain: 740px + 2 * var(--spaceXLarge);
1606
+ --maxWidthCenterMain: 800px + 2 * var(--spaceXLarge);
1607
1607
  --backgroundHeader: var(--surfaceRisen);
1608
1608
  --boxShadowHeader: var(--boxShadowXXXSmall);
1609
1609
  --colorHeader: var(--fgNeutralDefault);
@@ -1618,12 +1618,12 @@ body {
1618
1618
  --paddingMobileHeader: 0 var(--spaceMedium);
1619
1619
  --backgroundMobilePanel: var(--surfaceRisen);
1620
1620
  --widthMobilePanel: 320px;
1621
- --paddingBodyMobilePanel: var(--spaceLarge);
1622
- --backgroundSecondaryMobilePanel: var(--bgNeutralDefault);
1621
+ --paddingBodyMobilePanel: var(--spaceSmall);
1622
+ --backgroundSecondaryMobilePanel: var(--surfaceDefault);
1623
1623
  --paddingBodySecondaryMobilePanel: var(--spaceLarge) var(--spaceXSmall);
1624
- --backgroundHeaderMobilePanel: var(--gradientBlueRedDark);
1625
- --colorHeaderMobilePanel: var(--fgInverseDefault);
1626
- --paddingHeaderMobilePanel: var(--spaceLarge) var(--spaceXSmall) var(--spaceLarge) var(--spaceLarge);
1624
+ --backgroundHeaderMobilePanel: transparent;
1625
+ --colorHeaderMobilePanel: var(--fgWhiteDefault);
1626
+ --paddingHeaderMobilePanel: var(--spaceSmall) var(--spaceXSmall) var(--spaceXSmall) var(--spaceSmall);
1627
1627
  --colorHeaderImageMobilePanel: var(--fgBrandDefault);
1628
1628
  --backgroundHeaderSecondaryMobilePanel: transparent;
1629
1629
  --colorHeaderSecondaryMobilePanel: var(--fgNeutralDefault);
@@ -1660,13 +1660,14 @@ body {
1660
1660
  --widthSelectedMenuItem: calc(100% - 4px);
1661
1661
  --marginSelectedMenuItem: 2px;
1662
1662
  --backgroundSubmenu: var(--bgNeutralDefault);
1663
- --colorLinkMobileMenu: var(--fgBrandDefault);
1664
- --colorLinkHoverMobileMenu: var(--fgLinkDefaultHover);
1665
- --colorLinkActiveMobileMenu: var(--fgLinkDefaultPressed);
1666
- --colorLinkSelectedMobileMenu: var(--fgBrandDefault);
1663
+ --colorLinkMobileMenu: var(--fgWhiteDefault);
1664
+ --colorLinkHoverMobileMenu: var(--fgWhiteDefault);
1665
+ --colorLinkActiveMobileMenu: var(--fgWhiteDefault);
1666
+ --colorLinkSelectedMobileMenu: var(--fgWhiteDefault);
1667
1667
  --fontSizeListMobileMenu: var(--fontSizeSmall);
1668
1668
  --marginTopItemMobileMenu: 0;
1669
- --paddingLinkMobileMenu: var(--spaceMedium) var(--spaceXSmall);
1669
+ --paddingLinkMobileMenu: var(--spaceSmall) var(--spaceSmall);
1670
+ --colorIconLinkMobileMenu: var(--fgWhiteDefault);
1670
1671
  --fontSizeTitleStepper: var(--fontSizeXSmall);
1671
1672
  --fontSizeIconStepper: var(--fontSizeSmall);
1672
1673
  --fontWeightIconStepper: var(--fontWeightBold);
@@ -1893,7 +1894,7 @@ body:not(.user-is-tabbing) *:focus {
1893
1894
  .l-app--fixedHeader {
1894
1895
  padding-top: var(--heightMobileHeader);
1895
1896
  }
1896
- @media screen and (min-width: 992px) {
1897
+ @media screen and (min-width: 1200px) {
1897
1898
  .l-app--fixedHeader {
1898
1899
  padding-top: var(--heightHeader);
1899
1900
  }
@@ -1915,7 +1916,7 @@ body:not(.user-is-tabbing) *:focus {
1915
1916
  position: fixed;
1916
1917
  top: var(--heightMobileHeader);
1917
1918
  }
1918
- @media screen and (min-width: 992px) {
1919
+ @media screen and (min-width: 1200px) {
1919
1920
  .l-app--fixedMenuMain .l-content > .m-menu--main {
1920
1921
  top: var(--heightHeader);
1921
1922
  }
@@ -1943,7 +1944,7 @@ body {
1943
1944
  display: flex;
1944
1945
  min-height: calc(100vh - var(--heightMobileHeader));
1945
1946
  }
1946
- @media screen and (min-width: 992px) {
1947
+ @media screen and (min-width: 1200px) {
1947
1948
  .l-content {
1948
1949
  min-height: calc(100vh - var(--heightHeader));
1949
1950
  }
@@ -3164,7 +3165,7 @@ body {
3164
3165
  margin-right: var(--spaceXSmall);
3165
3166
  }
3166
3167
 
3167
- @media screen and (max-width: 991px) {
3168
+ @media screen and (max-width: 1199px) {
3168
3169
  .l-header .m-menu .m-menu__text {
3169
3170
  border: 0;
3170
3171
  clip: rect(0 0 0 0);
@@ -3180,7 +3181,7 @@ body {
3180
3181
  margin-left: calc(var(--spaceXSmall) / 2);
3181
3182
  }
3182
3183
  }
3183
- @media screen and (min-width: 992px) {
3184
+ @media screen and (min-width: 1200px) {
3184
3185
  .l-header {
3185
3186
  height: var(--heightHeader);
3186
3187
  padding: var(--paddingHeader);
@@ -3256,6 +3257,7 @@ body.dark .l-header .c-logo__img--dark {
3256
3257
  }
3257
3258
  }
3258
3259
  .l-mobilePanel--main {
3260
+ background: var(--backgroundMainMenu);
3259
3261
  z-index: 1600;
3260
3262
  }
3261
3263
  .l-mobilePanel .m-menu + .m-menu {
@@ -3274,6 +3276,14 @@ body.dark .l-header .c-logo__img--dark {
3274
3276
  width: var(--widthMobilePanel);
3275
3277
  }
3276
3278
  }
3279
+ @media screen and (min-width: 480px) {
3280
+ .l-mobilePanel .m-menu__list {
3281
+ display: block;
3282
+ }
3283
+ .l-mobilePanel .m-menu__list .m-menu__item {
3284
+ margin-left: 0;
3285
+ }
3286
+ }
3277
3287
 
3278
3288
  .l-mobilePanel--secondary {
3279
3289
  background: var(--backgroundSecondaryMobilePanel);
@@ -3310,12 +3320,8 @@ body.dark .l-header .c-logo__img--dark {
3310
3320
  order: 1;
3311
3321
  }
3312
3322
  .l-mobilePanel__header .l-mobilePanel__close {
3313
- color: var(--fgInverseDefault);
3314
3323
  order: 2;
3315
3324
  }
3316
- .l-mobilePanel__header .l-mobilePanel__close:hover, .l-mobilePanel__header .l-mobilePanel__close:focus {
3317
- color: var(--fgInverseDefault);
3318
- }
3319
3325
 
3320
3326
  .l-mobilePanel__headerImage {
3321
3327
  margin-right: var(--spaceMedium);
@@ -6626,7 +6632,7 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
6626
6632
  display: none;
6627
6633
  }
6628
6634
  .custom-datepicker .react-datepicker-header {
6629
- background: var(--bgBrandDefaultHover);
6635
+ background: var(--bgNeutralDefault);
6630
6636
  padding-top: 0.25rem;
6631
6637
  padding-bottom: 0.25rem;
6632
6638
  align-items: center;
@@ -6643,11 +6649,11 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
6643
6649
  border-bottom: none;
6644
6650
  }
6645
6651
  .custom-datepicker .react-datepicker__day-names {
6646
- background: var(--bgBrandBold);
6652
+ background: var(--bgNeutralSubtle);
6647
6653
  margin-bottom: 8px;
6648
6654
  }
6649
6655
  .custom-datepicker .react-datepicker__day-names > * {
6650
- color: var(--fgInverseDefault) !important;
6656
+ color: var(--fgNeutralDefault) !important;
6651
6657
  }
6652
6658
  .custom-datepicker .react-datepicker__month-text, .custom-datepicker .react-datepicker__year-text, .custom-datepicker .react-datepicker__day {
6653
6659
  width: 2.25rem;
@@ -6679,13 +6685,14 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
6679
6685
  .custom-datepicker .react-datepicker__month-text--keyboard-selected, .custom-datepicker .react-datepicker__year-text--keyboard-selected, .custom-datepicker .react-datepicker__day--keyboard-selected {
6680
6686
  background-color: unset;
6681
6687
  }
6682
- .custom-datepicker .react-datepicker__month-text--selected, .custom-datepicker .react-datepicker__year-text--selected, .custom-datepicker .react-datepicker__day--selected {
6683
- background: var(--bgBrandBold);
6684
- border-color: var(--borderBrandDefault);
6685
- color: var(--fgInverseDefault);
6686
- }
6687
6688
  .custom-datepicker .react-datepicker__month-text--today, .custom-datepicker .react-datepicker__year-text--today, .custom-datepicker .react-datepicker__day--today {
6688
6689
  font-weight: normal;
6690
+ border-radius: 50% !important;
6691
+ }
6692
+ .custom-datepicker .react-datepicker__month-text--today.react-datepicker__day--selected, .custom-datepicker .react-datepicker__year-text--today.react-datepicker__day--selected, .custom-datepicker .react-datepicker__day--today.react-datepicker__day--selected {
6693
+ background: var(--bgBrandBold) !important;
6694
+ border-color: var(--borderBrandDefault) !important;
6695
+ color: var(--fgInverseDefault) !important;
6689
6696
  }
6690
6697
  .custom-datepicker .react-datepicker__month-text--today:not(.react-datepicker__month-text--disabled,
6691
6698
  .react-datepicker__year-text--disabled,
@@ -6714,6 +6721,11 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
6714
6721
  background: var(--bgBrandDefaultHover);
6715
6722
  border-color: var(--borderNeutralDefault);
6716
6723
  }
6724
+ .custom-datepicker .react-datepicker__month-text--selected, .custom-datepicker .react-datepicker__year-text--selected, .custom-datepicker .react-datepicker__day--selected {
6725
+ background: var(--bgBrandBold);
6726
+ border-color: var(--borderBrandDefault);
6727
+ color: var(--fgInverseDefault);
6728
+ }
6717
6729
  .custom-datepicker .react-datepicker__year-text, .custom-datepicker .react-datepicker__month-text {
6718
6730
  text-transform: capitalize;
6719
6731
  border-radius: 20px !important;
@@ -7489,7 +7501,7 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
7489
7501
  .m-menu--main .m-menu__link .c-avatar {
7490
7502
  color: var(--colorIconLinkMainMenu);
7491
7503
  }
7492
- @media screen and (max-width: 991px) {
7504
+ @media screen and (max-width: 1199px) {
7493
7505
  .m-menu--main .m-menu {
7494
7506
  display: none;
7495
7507
  }
@@ -7513,7 +7525,7 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
7513
7525
  .m-menu--secondary .m-menu__item--open .m-menu__subMenu {
7514
7526
  padding-top: var(--marginTopItemSecondaryMenu);
7515
7527
  }
7516
- @media screen and (max-width: 991px) {
7528
+ @media screen and (max-width: 1199px) {
7517
7529
  .m-menu--secondary .m-menu {
7518
7530
  display: none;
7519
7531
  }
@@ -7564,6 +7576,7 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
7564
7576
  margin-top: var(--marginTopItemMobileMenu);
7565
7577
  }
7566
7578
  .m-menu--mobile .m-menu__item--selected .m-menu__link {
7579
+ background: var(--backgroundLinkSelectedMainMenu);
7567
7580
  color: var(--colorLinkSelectedMobileMenu);
7568
7581
  font-weight: var(--fontWeightBold);
7569
7582
  }
@@ -7577,8 +7590,9 @@ body.dark .l-mobilePanel--secondary .l-mobilePanel__close {
7577
7590
  .m-menu--mobile .m-menu__link:active {
7578
7591
  color: var(--colorLinkActiveMobileMenu);
7579
7592
  }
7580
- .m-menu--mobile .c-avatar {
7593
+ .m-menu--mobile .m-menu__link .c-avatar {
7581
7594
  flex: 0 0 24px;
7595
+ color: var(--colorIconLinkMobileMenu);
7582
7596
  }
7583
7597
 
7584
7598
  .m-stepper__list {
@@ -9347,7 +9361,7 @@ body.dark .u-fg--fgWhiteDefault {
9347
9361
  /* Slider */
9348
9362
  .slick-loading .slick-list
9349
9363
  {
9350
- background: #fff url('assets/3eca5ef480c76325540d.gif') center center no-repeat;
9364
+ background: #fff url('assets/7c5d7c26d45ddf549029.gif') center center no-repeat;
9351
9365
  }
9352
9366
 
9353
9367
  /* Icons */
@@ -9357,8 +9371,8 @@ body.dark .u-fg--fgWhiteDefault {
9357
9371
  font-weight: normal;
9358
9372
  font-style: normal;
9359
9373
 
9360
- src: url('assets/a46264bae19a0e88a5e4.eot');
9361
- src: url('assets/363209d6cf942c41f596.eot') format('embedded-opentype'), url('assets/a23e266c2fc9bb9c8205.woff') format('woff'), url('assets/1d95eb279cc9b44eb269.ttf') format('truetype'), url('assets/2f053ab0e128df691f94.svg') format('svg');
9374
+ src: url('assets/ec3f183067a8fb675887.eot');
9375
+ 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');
9362
9376
  }
9363
9377
  /* Arrows */
9364
9378
  .slick-prev,
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "module": "./index.js",
4
4
  "typings": "./index.d.ts",
5
5
  "name": "@mmb-digital/ds-lilly",
6
- "version": "1.0.0-alpha.70",
6
+ "version": "1.0.0-alpha.72",
7
7
  "description": "MMB LILLY design system",
8
8
  "license": "UNLICENSED",
9
9
  "sideEffects": [