From ac4af4dcb4670d76d26ecf672ec011116a93c5c8 Mon Sep 17 00:00:00 2001 From: Giamir Buoncristiani Date: Wed, 29 Oct 2025 15:45:48 +0100 Subject: [PATCH 1/6] feat(activity-indicator): update to new visual language Add ActivityIndicator to Stacks Svelte --- .changeset/solid-mugs-jog.md | 10 + .../activity-indicator.less | 23 +- .../stacks-docs/_data/activity-indicator.json | 5 + .../stacks-docs/_data/site-navigation.json | 5 +- .../components/activity-indicator.html | 43 +++- .../ActivityIndicator.stories.svelte | 223 ++++++++++++++++++ .../ActivityIndicator.svelte | 72 ++++++ .../ActivityIndicator.test.ts | 81 +++++++ .../stacks-svelte/src/components/index.ts | 1 + 9 files changed, 442 insertions(+), 21 deletions(-) create mode 100644 .changeset/solid-mugs-jog.md create mode 100644 packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.stories.svelte create mode 100644 packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.svelte create mode 100644 packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.test.ts diff --git a/.changeset/solid-mugs-jog.md b/.changeset/solid-mugs-jog.md new file mode 100644 index 0000000000..18528035ca --- /dev/null +++ b/.changeset/solid-mugs-jog.md @@ -0,0 +1,10 @@ +--- +"@stackoverflow/stacks": patch +"@stackoverflow/stacks-svelte": patch +--- + +**Activity Indicator Updates:** + +- **Stacks Classic**: Updated activity indicator component to the new visual language (default 13x13). Introduced `.s-activity-indicator__sm` variant (7x7). + +- **Stacks Svelte**: Added new `ActivityIndicator` component. diff --git a/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less b/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less index 555806d93d..b38432f36f 100644 --- a/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less +++ b/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less @@ -1,7 +1,8 @@ .s-activity-indicator { - --_ai-translucent: var(--translucent-secondary); --_ai-bg: var(--theme-secondary-400); --_ai-fc: var(--white); + --_ai-min-size: calc(var(--su-static12) + var(--su-static1)); + --_ai-p: 0 calc(var(--su-static4) - var(--su-static1)); .highcontrast-mode({ --_ai-bg: var(--theme-secondary-500); @@ -10,7 +11,6 @@ // VARIANTS &&__danger { --_ai-bg: var(--red-400); - --_ai-translucent: var(--translucent-error); .highcontrast-mode({ --_ai-bg: var(--red-500); @@ -19,7 +19,6 @@ &&__success { --_ai-bg: var(--green-400); - --_ai-translucent: var(--translucent-success); .highcontrast-mode({ --_ai-bg: var(--green-500); @@ -29,7 +28,6 @@ &&__warning { --_ai-bg: var(--yellow-400); --_ai-fc: var(--_black-static); - --_ai-translucent: var(--translucent-warning); .highcontrast-mode({ --_ai-bg: var(--yellow-500); // needs to be here to override default high contrast @@ -37,17 +35,22 @@ }); } + &&__sm { + --_ai-min-size: calc(var(--su-static6) + var(--su-static1)); + --_ai-p: 0; + } + background-color: var(--_ai-bg); - box-shadow: 0 0 0 var(--su-static4) var(--_ai-translucent); color: var(--_ai-fc); + min-width: var(--_ai-min-size); + min-height: var(--_ai-min-size); + padding: var(--_ai-p); border-radius: 1000px; display: inline-block; font-size: var(--fs-fine); - font-weight: 700; - line-height: 1.1; // Custom line-height to satisfy 1x screens - min-width: var(--su-static12); - min-height: var(--su-static12); - padding: var(--su2) var(--su4); + font-weight: 600; + line-height: 1.15; + text-align: center; text-transform: uppercase; } diff --git a/packages/stacks-docs/_data/activity-indicator.json b/packages/stacks-docs/_data/activity-indicator.json index ba5482f6d1..e476674582 100644 --- a/packages/stacks-docs/_data/activity-indicator.json +++ b/packages/stacks-docs/_data/activity-indicator.json @@ -19,6 +19,11 @@ "class": ".s-activity-indicator__danger", "applies": ".s-activity-indicator", "description": "Styles the activity indicator in a danger state" + }, + { + "class": ".s-activity-indicator__sm", + "applies": ".s-activity-indicator", + "description": "Styles the activity indicator in a small size" } ] } \ No newline at end of file diff --git a/packages/stacks-docs/_data/site-navigation.json b/packages/stacks-docs/_data/site-navigation.json index 197689b49e..afabd2bf0c 100644 --- a/packages/stacks-docs/_data/site-navigation.json +++ b/packages/stacks-docs/_data/site-navigation.json @@ -198,8 +198,9 @@ "title": "Components", "links": [ { - "title": "Activity indicator", - "url": "/product/components/activity-indicator/" + "title": "Activity indicator", + "url": "/product/components/activity-indicator/", + "new": true }, { "title": "Avatars", diff --git a/packages/stacks-docs/product/components/activity-indicator.html b/packages/stacks-docs/product/components/activity-indicator.html index 747477a58e..2960fb2e14 100644 --- a/packages/stacks-docs/product/components/activity-indicator.html +++ b/packages/stacks-docs/product/components/activity-indicator.html @@ -1,6 +1,7 @@ --- layout: page title: Activity indicator +svelte: https://beta.svelte.stackoverflow.design/?path=/docs/components-activityindicator--docs description: Stacks provides a small jewel for indicating new activity. tags: components --- @@ -61,7 +62,7 @@
-
+
…
…
@@ -71,12 +72,20 @@
- @Svg.Bell + @Svg.Notification -
+
…
+ +
+ @Svg.Notification + +
+ 3
…
+
+
{% endhighlight %}
@@ -89,7 +98,7 @@
-
+
New activity
G
@@ -99,12 +108,20 @@
- {% icon "Bell" %} + {% icon "Notification" %} -
+
New activity
+ +
+ {% icon "Notification" %} + +
+ 3
New activities
+
+
@@ -137,7 +154,7 @@
-
+
New activity
G
@@ -147,12 +164,20 @@
- {% icon "Bell" %} + {% icon "Notification" %} -
+
New activity
+ +
+ {% icon "Notification" %} + +
+ 3
New activities
+
+
{% endfor %}
diff --git a/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.stories.svelte b/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.stories.svelte new file mode 100644 index 0000000000..6b399e8c9a --- /dev/null +++ b/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.stories.svelte @@ -0,0 +1,223 @@ + + + + + +
+ + + + + + + + + + {#each ActivityIndicatorVariants as variant (variant)} + + + + + {/each} + +
VariantExample
+ {variant || "default"} + + +
+
+ + + +
+ + + + + + + + + + {#each ActivityIndicatorSizes as size (size)} + + + + + {/each} + +
SizeExample
+ {size || "default"} + + +
+
+ + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + +
ContentExample
Number (3) + +
Number (12) + +
Number (370) + +
Text ("new") + +
+
+ + + +
+ + + + + + + + + + + + + + +
ContentExample
Notifications + + + + +
+
+ diff --git a/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.svelte b/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.svelte new file mode 100644 index 0000000000..e458c3e2b7 --- /dev/null +++ b/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.svelte @@ -0,0 +1,72 @@ + + + + +
+ {#if content && size !== "sm"}{content}{/if} +
{label}
+
diff --git a/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.test.ts b/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.test.ts new file mode 100644 index 0000000000..eb031ae0d9 --- /dev/null +++ b/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.test.ts @@ -0,0 +1,81 @@ +import { expect } from "@open-wc/testing"; +import { render, screen } from "@testing-library/svelte"; + +import ActivityIndicator from "./ActivityIndicator.svelte"; + +describe("ActivityIndicator", () => { + it("should render the indicator with the required label as screen reader text", () => { + render(ActivityIndicator, { label: "test activity" }); + expect(screen.getByText("test activity")).to.exist; + }); + + it("should render the content when provided", () => { + render(ActivityIndicator, { label: "test activity", content: 3 }); + expect(screen.getByText("3")).to.exist; + }); + + it("should render text content when provided", () => { + render(ActivityIndicator, { + label: "test activity", + content: "new", + }); + expect(screen.getByText("new")).to.exist; + }); + + it("should apply the success variant class", () => { + render(ActivityIndicator, { + label: "test activity", + variant: "success", + }); + expect(screen.getByText("test activity").parentElement).to.have.class( + "s-activity-indicator__success" + ); + }); + + it("should apply the warning variant class", () => { + render(ActivityIndicator, { + label: "test activity", + variant: "warning", + }); + expect(screen.getByText("test activity").parentElement).to.have.class( + "s-activity-indicator__warning" + ); + }); + + it("should apply the danger variant class", () => { + render(ActivityIndicator, { + label: "test activity", + variant: "danger", + }); + expect(screen.getByText("test activity").parentElement).to.have.class( + "s-activity-indicator__danger" + ); + }); + + it("should apply the small size class", () => { + render(ActivityIndicator, { label: "test activity", size: "sm" }); + expect(screen.getByText("test activity").parentElement).to.have.class( + "s-activity-indicator__sm" + ); + }); + + it("should not render content when size is sm", () => { + render(ActivityIndicator, { + label: "test activity", + size: "sm", + content: 3, + }); + expect(screen.queryByText("3")).to.not.exist; + expect(screen.getByText("test activity")).to.exist; + }); + + it("should render the indicator with arbitrary classes", () => { + render(ActivityIndicator, { + label: "test activity", + class: "custom-class", + }); + expect(screen.getByText("test activity").parentElement).to.have.class( + "custom-class" + ); + }); +}); diff --git a/packages/stacks-svelte/src/components/index.ts b/packages/stacks-svelte/src/components/index.ts index 7e1b5ebf2d..04a6a216a4 100644 --- a/packages/stacks-svelte/src/components/index.ts +++ b/packages/stacks-svelte/src/components/index.ts @@ -1,3 +1,4 @@ +export { default as ActivityIndicator } from "./ActivityIndicator/ActivityIndicator.svelte"; export { default as AwardBling } from "./AwardBling/AwardBling.svelte"; export { default as Avatar } from "./Avatar/Avatar.svelte"; export { default as Button } from "./Button/Button.svelte"; From 6615cfc245651812087b7f5c3ec040b3bc2ec666 Mon Sep 17 00:00:00 2001 From: Giamir Buoncristiani Date: Wed, 29 Oct 2025 15:48:23 +0100 Subject: [PATCH 2/6] add figma link --- packages/stacks-docs/product/components/activity-indicator.html | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/stacks-docs/product/components/activity-indicator.html b/packages/stacks-docs/product/components/activity-indicator.html index 2960fb2e14..26cc69b5de 100644 --- a/packages/stacks-docs/product/components/activity-indicator.html +++ b/packages/stacks-docs/product/components/activity-indicator.html @@ -2,6 +2,7 @@ layout: page title: Activity indicator svelte: https://beta.svelte.stackoverflow.design/?path=/docs/components-activityindicator--docs +figma: https://www.figma.com/design/do4Ug0Yws8xCfRjHe9cJfZ/Project-SHINE---Product-UI?node-id=610-18796 description: Stacks provides a small jewel for indicating new activity. tags: components --- From f0200fc0fadc345b98ed53e4327613fad52d22c7 Mon Sep 17 00:00:00 2001 From: Giamir Buoncristiani Date: Wed, 29 Oct 2025 19:16:52 +0100 Subject: [PATCH 3/6] mark stacks svelte changeset as minor --- .changeset/solid-mugs-jog.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.changeset/solid-mugs-jog.md b/.changeset/solid-mugs-jog.md index 18528035ca..7a0d745f81 100644 --- a/.changeset/solid-mugs-jog.md +++ b/.changeset/solid-mugs-jog.md @@ -1,6 +1,6 @@ --- "@stackoverflow/stacks": patch -"@stackoverflow/stacks-svelte": patch +"@stackoverflow/stacks-svelte": minor --- **Activity Indicator Updates:** From f4f75cd3d8fda0b5d535b9e4a553bb899876f39e Mon Sep 17 00:00:00 2001 From: Giamir Buoncristiani Date: Thu, 30 Oct 2025 08:46:07 +0100 Subject: [PATCH 4/6] make activity indicator content play nice across browser and os --- .../components/activity-indicator/activity-indicator.less | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less b/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less index b38432f36f..e179a2cf0b 100644 --- a/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less +++ b/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less @@ -47,10 +47,12 @@ padding: var(--_ai-p); border-radius: 1000px; - display: inline-block; + display: inline-flex; font-size: var(--fs-fine); font-weight: 600; - line-height: 1.15; + line-height: 1.1; text-align: center; + align-items: center; + justify-content: center; text-transform: uppercase; } From 7c4c81b1352e9d332cd53e9a90a37157f24a53a8 Mon Sep 17 00:00:00 2001 From: Giamir Buoncristiani Date: Thu, 30 Oct 2025 09:15:58 +0100 Subject: [PATCH 5/6] scale activity indicator to 16x16 and 10x10 respectively --- .changeset/solid-mugs-jog.md | 2 +- .../activity-indicator.less | 4 ++-- .../components/activity-indicator.html | 12 +++++------ .../ActivityIndicator.stories.svelte | 20 +++---------------- 4 files changed, 12 insertions(+), 26 deletions(-) diff --git a/.changeset/solid-mugs-jog.md b/.changeset/solid-mugs-jog.md index 7a0d745f81..12a642a7c5 100644 --- a/.changeset/solid-mugs-jog.md +++ b/.changeset/solid-mugs-jog.md @@ -5,6 +5,6 @@ **Activity Indicator Updates:** -- **Stacks Classic**: Updated activity indicator component to the new visual language (default 13x13). Introduced `.s-activity-indicator__sm` variant (7x7). +- **Stacks Classic**: Updated activity indicator component to the new visual language (default 16x16). Introduced `.s-activity-indicator__sm` variant (10x10). - **Stacks Svelte**: Added new `ActivityIndicator` component. diff --git a/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less b/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less index e179a2cf0b..42967b4779 100644 --- a/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less +++ b/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.less @@ -1,7 +1,7 @@ .s-activity-indicator { --_ai-bg: var(--theme-secondary-400); --_ai-fc: var(--white); - --_ai-min-size: calc(var(--su-static12) + var(--su-static1)); + --_ai-min-size: var(--su-static16); --_ai-p: 0 calc(var(--su-static4) - var(--su-static1)); .highcontrast-mode({ @@ -36,7 +36,7 @@ } &&__sm { - --_ai-min-size: calc(var(--su-static6) + var(--su-static1)); + --_ai-min-size: calc(var(--su-static8) + var(--su-static2)); --_ai-p: 0; } diff --git a/packages/stacks-docs/product/components/activity-indicator.html b/packages/stacks-docs/product/components/activity-indicator.html index 26cc69b5de..eb2dcd3126 100644 --- a/packages/stacks-docs/product/components/activity-indicator.html +++ b/packages/stacks-docs/product/components/activity-indicator.html @@ -75,7 +75,7 @@
@Svg.Notification -
+
…
@@ -83,7 +83,7 @@
@Svg.Notification -
+
3
…
@@ -111,7 +111,7 @@
{% icon "Notification" %} -
+
New activity
@@ -119,7 +119,7 @@
{% icon "Notification" %} -
+
3
New activities
@@ -167,7 +167,7 @@
{% icon "Notification" %} -
+
New activity
@@ -175,7 +175,7 @@
{% icon "Notification" %} -
+
3
New activities
diff --git a/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.stories.svelte b/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.stories.svelte index 6b399e8c9a..038ed1e1c6 100644 --- a/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.stories.svelte +++ b/packages/stacks-svelte/src/components/ActivityIndicator/ActivityIndicator.stories.svelte @@ -167,21 +167,7 @@ label="New notifications" variant="danger" size="sm" - class="ps-absolute tn2 r0 ba baw2 bc-white box-content" - /> -
- - @@ -196,7 +182,7 @@ label="New notifications" variant="danger" content="1" - class="ps-absolute tn4 rn12 ba baw2 bc-white box-content" + class="ps-absolute tn8 rn16 ba baw2 bc-white box-content" />
@@ -211,7 +197,7 @@ label="New notifications" variant="danger" content="99" - class="ps-absolute tn4 rn12 ba baw2 bc-white box-content" + class="ps-absolute tn8 rn16 ba baw2 bc-white box-content" />
From cfd00d4fddc41421954cee78dc1ecb0db0531267 Mon Sep 17 00:00:00 2001 From: Giamir Buoncristiani Date: Thu, 30 Oct 2025 15:24:40 +0100 Subject: [PATCH 6/6] regenerate baseline images --- .../activity-indicator/activity-indicator.a11y.test.ts | 6 ++++++ .../activity-indicator/activity-indicator.visual.test.ts | 6 ++++++ .../baseline/s-activity-indicator-dark-danger-new.ico | 4 ++-- .../baseline/s-activity-indicator-dark-danger-sm.ico | 3 +++ .../Chromium/baseline/s-activity-indicator-dark-danger.ico | 4 ++-- .../Chromium/baseline/s-activity-indicator-dark-new.ico | 4 ++-- .../Chromium/baseline/s-activity-indicator-dark-sm.ico | 3 +++ .../baseline/s-activity-indicator-dark-success-new.ico | 4 ++-- .../baseline/s-activity-indicator-dark-success-sm.ico | 3 +++ .../Chromium/baseline/s-activity-indicator-dark-success.ico | 4 ++-- .../baseline/s-activity-indicator-dark-warning-new.ico | 4 ++-- .../baseline/s-activity-indicator-dark-warning-sm.ico | 3 +++ .../Chromium/baseline/s-activity-indicator-dark-warning.ico | 4 ++-- .../Chromium/baseline/s-activity-indicator-dark.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-danger-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-danger-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-danger.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-dark-new.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-dark-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-success-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-success-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-success.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-warning-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-warning-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-warning.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-dark.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-danger-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-danger-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-danger.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-new.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-light-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-success-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-success-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-success.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-warning-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-warning-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-warning.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-light.ico | 4 ++-- .../baseline/s-activity-indicator-light-danger-new.ico | 4 ++-- .../baseline/s-activity-indicator-light-danger-sm.ico | 3 +++ .../Chromium/baseline/s-activity-indicator-light-danger.ico | 4 ++-- .../Chromium/baseline/s-activity-indicator-light-new.ico | 4 ++-- .../Chromium/baseline/s-activity-indicator-light-sm.ico | 3 +++ .../baseline/s-activity-indicator-light-success-new.ico | 4 ++-- .../baseline/s-activity-indicator-light-success-sm.ico | 3 +++ .../baseline/s-activity-indicator-light-success.ico | 4 ++-- .../baseline/s-activity-indicator-light-warning-new.ico | 4 ++-- .../baseline/s-activity-indicator-light-warning-sm.ico | 3 +++ .../baseline/s-activity-indicator-light-warning.ico | 4 ++-- .../Chromium/baseline/s-activity-indicator-light.ico | 4 ++-- .../Chromium/baseline/s-topbar-dark-advanced.ico | 4 ++-- .../screenshots/Chromium/baseline/s-topbar-dark-alt.ico | 4 ++-- .../baseline/s-topbar-dark-dark-variant-advanced.ico | 4 ++-- .../Chromium/baseline/s-topbar-dark-dark-variant-alt.ico | 4 ++-- .../Chromium/baseline/s-topbar-dark-dark-variant-input.ico | 4 ++-- .../Chromium/baseline/s-topbar-dark-dark-variant.ico | 4 ++-- .../screenshots/Chromium/baseline/s-topbar-dark-input.ico | 4 ++-- .../baseline/s-topbar-dark-light-variant-advanced.ico | 4 ++-- .../Chromium/baseline/s-topbar-dark-light-variant-alt.ico | 4 ++-- .../Chromium/baseline/s-topbar-dark-light-variant-input.ico | 4 ++-- .../Chromium/baseline/s-topbar-dark-light-variant.ico | 4 ++-- .../screenshots/Chromium/baseline/s-topbar-dark-themed.ico | 4 ++-- .../screenshots/Chromium/baseline/s-topbar-dark.ico | 4 ++-- .../baseline/s-topbar-highcontrast-dark-advanced.ico | 4 ++-- .../Chromium/baseline/s-topbar-highcontrast-dark-alt.ico | 4 ++-- .../s-topbar-highcontrast-dark-dark-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-dark-dark-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-dark-dark-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-dark-dark-variant.ico | 4 ++-- .../Chromium/baseline/s-topbar-highcontrast-dark-input.ico | 4 ++-- .../s-topbar-highcontrast-dark-light-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-dark-light-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-dark-light-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-dark-light-variant.ico | 4 ++-- .../Chromium/baseline/s-topbar-highcontrast-dark-themed.ico | 4 ++-- .../Chromium/baseline/s-topbar-highcontrast-dark.ico | 4 ++-- .../baseline/s-topbar-highcontrast-light-advanced.ico | 4 ++-- .../Chromium/baseline/s-topbar-highcontrast-light-alt.ico | 4 ++-- .../s-topbar-highcontrast-light-dark-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-light-dark-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-light-dark-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-light-dark-variant.ico | 4 ++-- .../Chromium/baseline/s-topbar-highcontrast-light-input.ico | 4 ++-- .../s-topbar-highcontrast-light-light-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-light-light-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-light-light-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-light-light-variant.ico | 4 ++-- .../baseline/s-topbar-highcontrast-light-themed.ico | 4 ++-- .../Chromium/baseline/s-topbar-highcontrast-light.ico | 4 ++-- .../Chromium/baseline/s-topbar-light-advanced.ico | 4 ++-- .../screenshots/Chromium/baseline/s-topbar-light-alt.ico | 4 ++-- .../baseline/s-topbar-light-dark-variant-advanced.ico | 4 ++-- .../Chromium/baseline/s-topbar-light-dark-variant-alt.ico | 4 ++-- .../Chromium/baseline/s-topbar-light-dark-variant-input.ico | 4 ++-- .../Chromium/baseline/s-topbar-light-dark-variant.ico | 4 ++-- .../screenshots/Chromium/baseline/s-topbar-light-input.ico | 4 ++-- .../baseline/s-topbar-light-light-variant-advanced.ico | 4 ++-- .../Chromium/baseline/s-topbar-light-light-variant-alt.ico | 4 ++-- .../baseline/s-topbar-light-light-variant-input.ico | 4 ++-- .../Chromium/baseline/s-topbar-light-light-variant.ico | 4 ++-- .../screenshots/Chromium/baseline/s-topbar-light-themed.ico | 4 ++-- .../screenshots/Chromium/baseline/s-topbar-light.ico | 4 ++-- .../baseline/s-activity-indicator-dark-danger-new.ico | 4 ++-- .../baseline/s-activity-indicator-dark-danger-sm.ico | 3 +++ .../Firefox/baseline/s-activity-indicator-dark-danger.ico | 4 ++-- .../Firefox/baseline/s-activity-indicator-dark-new.ico | 4 ++-- .../Firefox/baseline/s-activity-indicator-dark-sm.ico | 3 +++ .../baseline/s-activity-indicator-dark-success-new.ico | 4 ++-- .../baseline/s-activity-indicator-dark-success-sm.ico | 3 +++ .../Firefox/baseline/s-activity-indicator-dark-success.ico | 4 ++-- .../baseline/s-activity-indicator-dark-warning-new.ico | 4 ++-- .../baseline/s-activity-indicator-dark-warning-sm.ico | 3 +++ .../Firefox/baseline/s-activity-indicator-dark-warning.ico | 4 ++-- .../Firefox/baseline/s-activity-indicator-dark.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-danger-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-danger-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-danger.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-dark-new.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-dark-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-success-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-success-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-success.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-warning-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-warning-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-warning.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-dark.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-danger-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-danger-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-danger.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-new.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-light-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-success-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-success-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-success.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-warning-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-warning-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-warning.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-light.ico | 4 ++-- .../baseline/s-activity-indicator-light-danger-new.ico | 4 ++-- .../baseline/s-activity-indicator-light-danger-sm.ico | 3 +++ .../Firefox/baseline/s-activity-indicator-light-danger.ico | 4 ++-- .../Firefox/baseline/s-activity-indicator-light-new.ico | 4 ++-- .../Firefox/baseline/s-activity-indicator-light-sm.ico | 3 +++ .../baseline/s-activity-indicator-light-success-new.ico | 4 ++-- .../baseline/s-activity-indicator-light-success-sm.ico | 3 +++ .../Firefox/baseline/s-activity-indicator-light-success.ico | 4 ++-- .../baseline/s-activity-indicator-light-warning-new.ico | 4 ++-- .../baseline/s-activity-indicator-light-warning-sm.ico | 3 +++ .../Firefox/baseline/s-activity-indicator-light-warning.ico | 4 ++-- .../Firefox/baseline/s-activity-indicator-light.ico | 4 ++-- .../screenshots/Firefox/baseline/s-topbar-dark-advanced.ico | 4 ++-- .../screenshots/Firefox/baseline/s-topbar-dark-alt.ico | 4 ++-- .../baseline/s-topbar-dark-dark-variant-advanced.ico | 4 ++-- .../Firefox/baseline/s-topbar-dark-dark-variant-alt.ico | 4 ++-- .../Firefox/baseline/s-topbar-dark-dark-variant-input.ico | 4 ++-- .../Firefox/baseline/s-topbar-dark-dark-variant.ico | 4 ++-- .../screenshots/Firefox/baseline/s-topbar-dark-input.ico | 4 ++-- .../baseline/s-topbar-dark-light-variant-advanced.ico | 4 ++-- .../Firefox/baseline/s-topbar-dark-light-variant-alt.ico | 4 ++-- .../Firefox/baseline/s-topbar-dark-light-variant-input.ico | 4 ++-- .../Firefox/baseline/s-topbar-dark-light-variant.ico | 4 ++-- .../screenshots/Firefox/baseline/s-topbar-dark-themed.ico | 4 ++-- .../screenshots/Firefox/baseline/s-topbar-dark.ico | 4 ++-- .../baseline/s-topbar-highcontrast-dark-advanced.ico | 4 ++-- .../Firefox/baseline/s-topbar-highcontrast-dark-alt.ico | 4 ++-- .../s-topbar-highcontrast-dark-dark-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-dark-dark-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-dark-dark-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-dark-dark-variant.ico | 4 ++-- .../Firefox/baseline/s-topbar-highcontrast-dark-input.ico | 4 ++-- .../s-topbar-highcontrast-dark-light-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-dark-light-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-dark-light-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-dark-light-variant.ico | 4 ++-- .../Firefox/baseline/s-topbar-highcontrast-dark-themed.ico | 4 ++-- .../Firefox/baseline/s-topbar-highcontrast-dark.ico | 4 ++-- .../baseline/s-topbar-highcontrast-light-advanced.ico | 4 ++-- .../Firefox/baseline/s-topbar-highcontrast-light-alt.ico | 4 ++-- .../s-topbar-highcontrast-light-dark-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-light-dark-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-light-dark-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-light-dark-variant.ico | 4 ++-- .../Firefox/baseline/s-topbar-highcontrast-light-input.ico | 4 ++-- .../s-topbar-highcontrast-light-light-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-light-light-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-light-light-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-light-light-variant.ico | 4 ++-- .../Firefox/baseline/s-topbar-highcontrast-light-themed.ico | 4 ++-- .../Firefox/baseline/s-topbar-highcontrast-light.ico | 4 ++-- .../Firefox/baseline/s-topbar-light-advanced.ico | 4 ++-- .../screenshots/Firefox/baseline/s-topbar-light-alt.ico | 4 ++-- .../baseline/s-topbar-light-dark-variant-advanced.ico | 4 ++-- .../Firefox/baseline/s-topbar-light-dark-variant-alt.ico | 4 ++-- .../Firefox/baseline/s-topbar-light-dark-variant-input.ico | 4 ++-- .../Firefox/baseline/s-topbar-light-dark-variant.ico | 4 ++-- .../screenshots/Firefox/baseline/s-topbar-light-input.ico | 4 ++-- .../baseline/s-topbar-light-light-variant-advanced.ico | 4 ++-- .../Firefox/baseline/s-topbar-light-light-variant-alt.ico | 4 ++-- .../Firefox/baseline/s-topbar-light-light-variant-input.ico | 4 ++-- .../Firefox/baseline/s-topbar-light-light-variant.ico | 4 ++-- .../screenshots/Firefox/baseline/s-topbar-light-themed.ico | 4 ++-- .../screenshots/Firefox/baseline/s-topbar-light.ico | 4 ++-- .../baseline/s-activity-indicator-dark-danger-new.ico | 4 ++-- .../Webkit/baseline/s-activity-indicator-dark-danger-sm.ico | 3 +++ .../Webkit/baseline/s-activity-indicator-dark-danger.ico | 4 ++-- .../Webkit/baseline/s-activity-indicator-dark-new.ico | 4 ++-- .../Webkit/baseline/s-activity-indicator-dark-sm.ico | 3 +++ .../baseline/s-activity-indicator-dark-success-new.ico | 4 ++-- .../baseline/s-activity-indicator-dark-success-sm.ico | 3 +++ .../Webkit/baseline/s-activity-indicator-dark-success.ico | 4 ++-- .../baseline/s-activity-indicator-dark-warning-new.ico | 4 ++-- .../baseline/s-activity-indicator-dark-warning-sm.ico | 3 +++ .../Webkit/baseline/s-activity-indicator-dark-warning.ico | 4 ++-- .../Webkit/baseline/s-activity-indicator-dark.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-danger-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-danger-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-danger.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-dark-new.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-dark-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-success-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-success-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-success.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-warning-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-dark-warning-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-dark-warning.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-dark.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-danger-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-danger-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-danger.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-new.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-light-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-success-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-success-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-success.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-warning-new.ico | 4 ++-- .../s-activity-indicator-highcontrast-light-warning-sm.ico | 3 +++ .../s-activity-indicator-highcontrast-light-warning.ico | 4 ++-- .../baseline/s-activity-indicator-highcontrast-light.ico | 4 ++-- .../baseline/s-activity-indicator-light-danger-new.ico | 4 ++-- .../baseline/s-activity-indicator-light-danger-sm.ico | 3 +++ .../Webkit/baseline/s-activity-indicator-light-danger.ico | 4 ++-- .../Webkit/baseline/s-activity-indicator-light-new.ico | 4 ++-- .../Webkit/baseline/s-activity-indicator-light-sm.ico | 3 +++ .../baseline/s-activity-indicator-light-success-new.ico | 4 ++-- .../baseline/s-activity-indicator-light-success-sm.ico | 3 +++ .../Webkit/baseline/s-activity-indicator-light-success.ico | 4 ++-- .../baseline/s-activity-indicator-light-warning-new.ico | 4 ++-- .../baseline/s-activity-indicator-light-warning-sm.ico | 3 +++ .../Webkit/baseline/s-activity-indicator-light-warning.ico | 4 ++-- .../Webkit/baseline/s-activity-indicator-light.ico | 4 ++-- .../screenshots/Webkit/baseline/s-topbar-dark-advanced.ico | 4 ++-- .../screenshots/Webkit/baseline/s-topbar-dark-alt.ico | 4 ++-- .../Webkit/baseline/s-topbar-dark-dark-variant-advanced.ico | 4 ++-- .../Webkit/baseline/s-topbar-dark-dark-variant-alt.ico | 4 ++-- .../Webkit/baseline/s-topbar-dark-dark-variant-input.ico | 4 ++-- .../Webkit/baseline/s-topbar-dark-dark-variant.ico | 4 ++-- .../screenshots/Webkit/baseline/s-topbar-dark-input.ico | 4 ++-- .../baseline/s-topbar-dark-light-variant-advanced.ico | 4 ++-- .../Webkit/baseline/s-topbar-dark-light-variant-alt.ico | 4 ++-- .../Webkit/baseline/s-topbar-dark-light-variant-input.ico | 4 ++-- .../Webkit/baseline/s-topbar-dark-light-variant.ico | 4 ++-- .../screenshots/Webkit/baseline/s-topbar-dark-themed.ico | 4 ++-- .../screenshots/Webkit/baseline/s-topbar-dark.ico | 4 ++-- .../Webkit/baseline/s-topbar-highcontrast-dark-advanced.ico | 4 ++-- .../Webkit/baseline/s-topbar-highcontrast-dark-alt.ico | 4 ++-- .../s-topbar-highcontrast-dark-dark-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-dark-dark-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-dark-dark-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-dark-dark-variant.ico | 4 ++-- .../Webkit/baseline/s-topbar-highcontrast-dark-input.ico | 4 ++-- .../s-topbar-highcontrast-dark-light-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-dark-light-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-dark-light-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-dark-light-variant.ico | 4 ++-- .../Webkit/baseline/s-topbar-highcontrast-dark-themed.ico | 4 ++-- .../Webkit/baseline/s-topbar-highcontrast-dark.ico | 4 ++-- .../baseline/s-topbar-highcontrast-light-advanced.ico | 4 ++-- .../Webkit/baseline/s-topbar-highcontrast-light-alt.ico | 4 ++-- .../s-topbar-highcontrast-light-dark-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-light-dark-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-light-dark-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-light-dark-variant.ico | 4 ++-- .../Webkit/baseline/s-topbar-highcontrast-light-input.ico | 4 ++-- .../s-topbar-highcontrast-light-light-variant-advanced.ico | 4 ++-- .../s-topbar-highcontrast-light-light-variant-alt.ico | 4 ++-- .../s-topbar-highcontrast-light-light-variant-input.ico | 4 ++-- .../baseline/s-topbar-highcontrast-light-light-variant.ico | 4 ++-- .../Webkit/baseline/s-topbar-highcontrast-light-themed.ico | 4 ++-- .../Webkit/baseline/s-topbar-highcontrast-light.ico | 4 ++-- .../screenshots/Webkit/baseline/s-topbar-light-advanced.ico | 4 ++-- .../screenshots/Webkit/baseline/s-topbar-light-alt.ico | 4 ++-- .../baseline/s-topbar-light-dark-variant-advanced.ico | 4 ++-- .../Webkit/baseline/s-topbar-light-dark-variant-alt.ico | 4 ++-- .../Webkit/baseline/s-topbar-light-dark-variant-input.ico | 4 ++-- .../Webkit/baseline/s-topbar-light-dark-variant.ico | 4 ++-- .../screenshots/Webkit/baseline/s-topbar-light-input.ico | 4 ++-- .../baseline/s-topbar-light-light-variant-advanced.ico | 4 ++-- .../Webkit/baseline/s-topbar-light-light-variant-alt.ico | 4 ++-- .../Webkit/baseline/s-topbar-light-light-variant-input.ico | 4 ++-- .../Webkit/baseline/s-topbar-light-light-variant.ico | 4 ++-- .../screenshots/Webkit/baseline/s-topbar-light-themed.ico | 4 ++-- .../screenshots/Webkit/baseline/s-topbar-light.ico | 4 ++-- 302 files changed, 660 insertions(+), 504 deletions(-) create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-dark-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-dark-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-dark-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-dark-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-highcontrast-dark-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-highcontrast-dark-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-highcontrast-dark-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-highcontrast-dark-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-highcontrast-light-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-highcontrast-light-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-highcontrast-light-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-highcontrast-light-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-light-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-light-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-light-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Chromium/baseline/s-activity-indicator-light-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-dark-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-dark-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-dark-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-dark-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-highcontrast-dark-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-highcontrast-dark-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-highcontrast-dark-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-highcontrast-dark-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-highcontrast-light-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-highcontrast-light-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-highcontrast-light-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-highcontrast-light-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-light-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-light-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-light-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Firefox/baseline/s-activity-indicator-light-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-dark-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-dark-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-dark-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-dark-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-highcontrast-dark-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-highcontrast-dark-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-highcontrast-dark-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-highcontrast-dark-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-highcontrast-light-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-highcontrast-light-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-highcontrast-light-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-highcontrast-light-warning-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-light-danger-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-light-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-light-success-sm.ico create mode 100644 packages/stacks-classic/screenshots/Webkit/baseline/s-activity-indicator-light-warning-sm.ico diff --git a/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.a11y.test.ts b/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.a11y.test.ts index 21379b90ac..239b25d079 100644 --- a/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.a11y.test.ts +++ b/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.a11y.test.ts @@ -5,9 +5,15 @@ describe("activity-indicator", () => { runA11yTests({ baseClass: "s-activity-indicator", variants: ["danger", "success", "warning"], + modifiers: { + primary: ["sm"], + }, children: { default: `
New activity
`, new: `new
New activity
`, }, + excludedTestids: [ + /^s-activity-indicator-(?=.*sm).*new$/, // s-activity-indicator with content in sm size not supported + ], }); }); diff --git a/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.visual.test.ts b/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.visual.test.ts index ac7a25c32d..f0cfbb3028 100644 --- a/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.visual.test.ts +++ b/packages/stacks-classic/lib/components/activity-indicator/activity-indicator.visual.test.ts @@ -6,10 +6,16 @@ describe("activity-indicator", () => { runVisualTests({ baseClass: "s-activity-indicator", variants: ["danger", "success", "warning"], + modifiers: { + primary: ["sm"], + }, children: { default: `
New activity
`, new: `new
New activity
`, }, + excludedTestids: [ + /^s-activity-indicator-(?=.*sm).*new$/, // s-activity-indicator with content in sm size not supported + ], template: ({ component, testid }) => html`