@stackoverflow/stacks 2.0.3 → 2.0.5

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/dist/css/stacks.css +30 -23
  2. package/dist/css/stacks.min.css +1 -1
  3. package/lib/atomic/v1/__snapshots__/border.less.test.ts.snap +1 -7
  4. package/lib/atomic/v1/__snapshots__/color.less.test.ts.snap +1 -7
  5. package/lib/atomic/v1/__snapshots__/typography.less.test.ts.snap +1 -7
  6. package/lib/components/anchor/anchor.less +3 -3
  7. package/lib/components/link/link.less +2 -2
  8. package/lib/components/modal/modal.a11y.test.ts +42 -0
  9. package/lib/components/modal/modal.less +8 -5
  10. package/lib/components/modal/modal.visual.test.ts +42 -0
  11. package/lib/exports/__snapshots__/color-mixins.less.test.ts.snap +3 -3
  12. package/lib/exports/__snapshots__/color.less.test.ts.snap +5 -5
  13. package/lib/exports/color-sets.less +5 -5
  14. package/lib/test/test-utils.ts +2 -2
  15. package/package.json +18 -18
package/dist/css/stacks.css CHANGED
@@ -471,9 +471,9 @@ body.theme-highcontrast .s-activity-indicator.s-activity-indicator__warning {
471
471
  --_an-a-fc-visited: var(--theme-link-color-visited, var(--theme-secondary-600));
472
472
  }
473
473
  .s-anchors.s-anchors__grayscale {
474
- --_an-a-fc: var(--black-400);
475
- --_an-a-fc-hover: var(--black-500);
476
- --_an-a-fc-visited: var(--black-600);
474
+ --_an-a-fc: var(--black-500);
475
+ --_an-a-fc-hover: var(--black-600);
476
+ --_an-a-fc-visited: var(--black-400);
477
477
  }
478
478
  .s-anchors.s-anchors__inherit {
479
479
  --_an-a-fc: inherit;
@@ -1395,8 +1395,8 @@ body.theme-highcontrast .s-btn.s-btn__link {
1395
1395
  }
1396
1396
  .s-btn.s-btn__link.s-link__grayscale {
1397
1397
  --_li-fc: var(--black-500);
1398
- --_li-fc-hover: var(--black-400);
1399
- --_li-fc-visited: var(--black-600);
1398
+ --_li-fc-hover: var(--black-600);
1399
+ --_li-fc-visited: var(--black-400);
1400
1400
  }
1401
1401
  .s-btn.s-btn__link.s-link__inherit {
1402
1402
  --_li-fc: inherit !important;
@@ -2680,8 +2680,8 @@ a.s-link__danger,
2680
2680
  a.s-link__grayscale,
2681
2681
  .s-link.s-link__grayscale {
2682
2682
  --_li-fc: var(--black-500);
2683
- --_li-fc-hover: var(--black-400);
2684
- --_li-fc-visited: var(--black-600);
2683
+ --_li-fc-hover: var(--black-600);
2684
+ --_li-fc-visited: var(--black-400);
2685
2685
  }
2686
2686
  a.s-link__inherit,
2687
2687
  .s-link.s-link__inherit {
@@ -2912,6 +2912,24 @@ body.theme-system .theme-dark__forced .s-menu {
2912
2912
  will-change: visibility, z-index, opacity;
2913
2913
  z-index: var(--zi-hide);
2914
2914
  }
2915
+ @media (prefers-color-scheme: dark) {
2916
+ body.theme-system .s-modal {
2917
+ --_mo-dialog-bg: var(--black-225);
2918
+ }
2919
+ }
2920
+ body.theme-dark .s-modal,
2921
+ .theme-dark__forced .s-modal,
2922
+ body.theme-system .theme-dark__forced .s-modal {
2923
+ --_mo-dialog-bg: var(--black-225);
2924
+ }
2925
+ @media (prefers-color-scheme: dark) {
2926
+ body.theme-highcontrast.theme-system .s-modal {
2927
+ --_mo-dialog-bg: var(--black-200);
2928
+ }
2929
+ }
2930
+ body.theme-highcontrast.theme-dark .s-modal {
2931
+ --_mo-dialog-bg: var(--black-200);
2932
+ }
2915
2933
  .s-modal[aria-hidden="false"],
2916
2934
  .s-modal[aria-hidden="false"] .s-modal--dialog {
2917
2935
  opacity: 1;
@@ -2921,7 +2939,6 @@ body.theme-system .theme-dark__forced .s-menu {
2921
2939
  z-index: var(--zi-modals);
2922
2940
  }
2923
2941
  .s-modal.s-modal__celebration {
2924
- --_mo-close-t: var(--su48);
2925
2942
  --_mo-dialog-pt: var(--su64);
2926
2943
  }
2927
2944
  .s-modal.s-modal__celebration .s-modal--dialog {
@@ -2973,16 +2990,6 @@ body.theme-system .theme-dark__forced .s-menu {
2973
2990
  will-change: visibility, z-index, opacity, transform;
2974
2991
  z-index: var(--zi-hide);
2975
2992
  }
2976
- @media (prefers-color-scheme: dark) {
2977
- body.theme-system .s-modal .s-modal--dialog {
2978
- --_mo-dialog-bg: var(--black-225);
2979
- }
2980
- }
2981
- body.theme-dark .s-modal .s-modal--dialog,
2982
- .theme-dark__forced .s-modal .s-modal--dialog,
2983
- body.theme-system .theme-dark__forced .s-modal .s-modal--dialog {
2984
- --_mo-dialog-bg: var(--black-225);
2985
- }
2986
2993
  .s-modal .s-modal--dialog::-webkit-scrollbar {
2987
2994
  width: calc(var(--su-static12) - var(--su-static2));
2988
2995
  height: calc(var(--su-static12) - var(--su-static2));
@@ -7520,12 +7527,12 @@ body:not(.theme-highcontrast).theme-system .theme-light__forced .themed {
7520
7527
  --red-400: hsl(0, 60%, 49%);
7521
7528
  --red-500: hsl(0, 65%, 37%);
7522
7529
  --red-600: hsl(0, 65%, 22%);
7523
- --yellow-100: hsl(43, 80%, 96%);
7524
- --yellow-200: hsl(43, 80%, 88%);
7530
+ --yellow-100: hsl(43, 85%, 95%);
7531
+ --yellow-200: hsl(43, 85%, 88%);
7525
7532
  --yellow-300: hsl(43, 85%, 72%);
7526
7533
  --yellow-400: hsl(43, 85%, 50%);
7527
7534
  --yellow-500: hsl(43, 85%, 33%);
7528
- --yellow-600: hsl(43, 84%, 18%);
7535
+ --yellow-600: hsl(43, 85%, 18%);
7529
7536
  --purple-100: hsl(237, 83%, 98%);
7530
7537
  --purple-200: hsl(237, 78%, 93%);
7531
7538
  --purple-300: hsl(237, 60%, 83%);
@@ -7894,8 +7901,8 @@ body.theme-highcontrast.theme-system .theme-light__forced {
7894
7901
  --red-400: hsl(0, 65%, 37%);
7895
7902
  --red-500: hsl(0, 65%, 22%);
7896
7903
  --red-600: hsl(0, 65%, 22%);
7897
- --yellow-100: hsl(41, 80%, 96%);
7898
- --yellow-200: hsl(41, 80%, 96%);
7904
+ --yellow-100: hsl(41, 85%, 95%);
7905
+ --yellow-200: hsl(41, 85%, 95%);
7899
7906
  --yellow-300: hsl(43, 85%, 50%);
7900
7907
  --yellow-400: hsl(43, 85%, 50%);
7901
7908
  --yellow-500: hsl(48, 85%, 18%);