@stackoverflow/stacks 2.0.4 → 2.0.6

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 +35 -27
  2. package/dist/css/stacks.min.css +1 -1
  3. package/lib/components/anchor/anchor.less +3 -3
  4. package/lib/components/link/link.less +2 -2
  5. package/lib/components/modal/modal.a11y.test.ts +42 -0
  6. package/lib/components/modal/modal.less +8 -4
  7. package/lib/components/modal/modal.visual.test.ts +42 -0
  8. package/lib/components/navigation/navigation.a11y.test.ts +4 -0
  9. package/lib/components/pagination/pagination.a11y.test.ts +2 -0
  10. package/lib/exports/__snapshots__/color-mixins.less.test.ts.snap +6 -6
  11. package/lib/exports/__snapshots__/color.less.test.ts.snap +10 -10
  12. package/lib/exports/color-sets.less +10 -10
  13. package/lib/test/assertions.ts +29 -0
  14. package/lib/test/test-utils.ts +23 -0
  15. package/package.json +14 -12
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;
@@ -2972,16 +2990,6 @@ body.theme-system .theme-dark__forced .s-menu {
2972
2990
  will-change: visibility, z-index, opacity, transform;
2973
2991
  z-index: var(--zi-hide);
2974
2992
  }
2975
- @media (prefers-color-scheme: dark) {
2976
- body.theme-system .s-modal .s-modal--dialog {
2977
- --_mo-dialog-bg: var(--black-225);
2978
- }
2979
- }
2980
- body.theme-dark .s-modal .s-modal--dialog,
2981
- .theme-dark__forced .s-modal .s-modal--dialog,
2982
- body.theme-system .theme-dark__forced .s-modal .s-modal--dialog {
2983
- --_mo-dialog-bg: var(--black-225);
2984
- }
2985
2993
  .s-modal .s-modal--dialog::-webkit-scrollbar {
2986
2994
  width: calc(var(--su-static12) - var(--su-static2));
2987
2995
  height: calc(var(--su-static12) - var(--su-static2));
@@ -7495,12 +7503,12 @@ body:not(.theme-highcontrast).theme-system .theme-light__forced .themed {
7495
7503
  --black-500: hsl(210, 8%, 25%);
7496
7504
  --black-600: hsl(210, 8%, 5%);
7497
7505
  --black: hsl(0, 0%, 0%);
7498
- --orange-100: hsl(23, 85%, 97%);
7499
- --orange-200: hsl(27, 85%, 87%);
7500
- --orange-300: hsl(27, 85%, 72%);
7501
- --orange-400: hsl(27, 80%, 52%);
7502
- --orange-500: hsl(27, 80%, 43%);
7503
- --orange-600: hsl(27, 80%, 29%);
7506
+ --orange-100: hsl(23, 87%, 97%);
7507
+ --orange-200: hsl(27, 87%, 87%);
7508
+ --orange-300: hsl(27, 87%, 72%);
7509
+ --orange-400: hsl(27, 89%, 48%);
7510
+ --orange-500: hsl(27, 87%, 41%);
7511
+ --orange-600: hsl(27, 87%, 27%);
7504
7512
  --blue-100: hsl(210, 80%, 96%);
7505
7513
  --blue-200: hsl(210, 80%, 91%);
7506
7514
  --blue-300: hsl(210, 78%, 76%);
@@ -7871,10 +7879,10 @@ body.theme-highcontrast.theme-system .theme-light__forced {
7871
7879
  --black: hsl(0, 0%, 0%);
7872
7880
  --orange-100: hsl(23, 87%, 97%);
7873
7881
  --orange-200: hsl(23, 87%, 97%);
7874
- --orange-300: hsl(27, 90%, 55%);
7875
- --orange-400: hsl(27, 90%, 55%);
7876
- --orange-500: hsl(27, 80%, 28%);
7877
- --orange-600: hsl(27, 80%, 28%);
7882
+ --orange-300: hsl(27, 89%, 48%);
7883
+ --orange-400: hsl(27, 87%, 29%);
7884
+ --orange-500: hsl(27, 87%, 21%);
7885
+ --orange-600: hsl(27, 87%, 21%);
7878
7886
  --blue-100: hsl(210, 80%, 96%);
7879
7887
  --blue-200: hsl(210, 80%, 96%);
7880
7888
  --blue-300: hsl(210, 70%, 48%);