npm - @stackoverflow/stacks - Versions diffs - 2.7.3 → 2.7.4 - Mend

@stackoverflow/stacks 2.7.3 → 2.7.4

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 (83) hide show

package/LICENSE.MD +9 -9
package/README.md +158 -180
package/dist/css/stacks.css +6 -0
package/dist/js/stacks.min.js +1 -1
package/lib/atomic/border.less +139 -139
package/lib/atomic/color.less +36 -36
package/lib/atomic/flex.less +426 -426
package/lib/atomic/gap.less +44 -44
package/lib/atomic/grid.less +139 -139
package/lib/atomic/misc.less +374 -374
package/lib/atomic/spacing.less +98 -98
package/lib/atomic/typography.less +266 -264
package/lib/atomic/width-height.less +194 -194
package/lib/base/body.less +44 -44
package/lib/base/configuration-static.less +61 -61
package/lib/base/fieldset.less +5 -5
package/lib/base/icon.less +11 -11
package/lib/base/internal.less +220 -220
package/lib/base/reset-meyer.less +64 -64
package/lib/base/reset-normalize.less +449 -449
package/lib/base/reset.less +20 -20
package/lib/components/activity-indicator/activity-indicator.less +53 -53
package/lib/components/avatar/avatar.less +108 -108
package/lib/components/award-bling/award-bling.less +31 -31
package/lib/components/banner/banner.less +44 -44
package/lib/components/banner/banner.ts +149 -149
package/lib/components/block-link/block-link.less +82 -82
package/lib/components/breadcrumbs/breadcrumbs.less +41 -41
package/lib/components/button-group/button-group.less +82 -82
package/lib/components/card/card.less +37 -37
package/lib/components/check-control/check-control.less +17 -17
package/lib/components/check-group/check-group.less +19 -19
package/lib/components/checkbox_radio/checkbox_radio.less +159 -159
package/lib/components/code-block/code-block.fixtures.ts +88 -88
package/lib/components/code-block/code-block.less +116 -116
package/lib/components/description/description.less +9 -9
package/lib/components/empty-state/empty-state.less +16 -16
package/lib/components/expandable/expandable.less +118 -118
package/lib/components/input-fill/input-fill.less +35 -35
package/lib/components/input-icon/input-icon.less +45 -45
package/lib/components/input-message/input-message.less +49 -49
package/lib/components/label/label.less +110 -110
package/lib/components/link-preview/link-preview.less +148 -148
package/lib/components/menu/menu.less +41 -41
package/lib/components/modal/modal.less +118 -118
package/lib/components/modal/modal.ts +383 -383
package/lib/components/navigation/navigation.less +136 -136
package/lib/components/navigation/navigation.ts +128 -128
package/lib/components/page-title/page-title.less +51 -51
package/lib/components/popover/popover.less +159 -159
package/lib/components/popover/popover.ts +651 -651
package/lib/components/post-summary/post-summary.less +457 -457
package/lib/components/progress-bar/progress-bar.less +291 -291
package/lib/components/prose/prose.less +452 -452
package/lib/components/select/select.less +138 -138
package/lib/components/spinner/spinner.less +103 -103
package/lib/components/table/table.ts +296 -296
package/lib/components/table-container/table-container.less +4 -4
package/lib/components/tag/tag.less +186 -186
package/lib/components/toast/toast.less +35 -35
package/lib/components/toast/toast.ts +357 -357
package/lib/components/toggle-switch/toggle-switch.less +104 -104
package/lib/components/topbar/topbar.less +553 -553
package/lib/components/uploader/uploader.less +205 -205
package/lib/components/user-card/user-card.less +129 -129
package/lib/controllers.ts +33 -33
package/lib/exports/color-mixins.less +283 -283
package/lib/exports/constants-helpers.less +108 -108
package/lib/exports/constants-type.less +155 -155
package/lib/exports/exports.less +15 -15
package/lib/exports/mixins.less +334 -333
package/lib/exports/spacing-mixins.less +67 -67
package/lib/index.ts +32 -32
package/lib/input-utils.less +41 -41
package/lib/stacks-dynamic.less +24 -24
package/lib/stacks-static.less +93 -93
package/lib/stacks.less +13 -13
package/lib/test/assertions.ts +36 -36
package/lib/test/less-test-utils.ts +28 -28
package/lib/test/open-wc-testing-patch.d.ts +26 -26
package/lib/tsconfig.build.json +4 -4
package/lib/tsconfig.json +17 -17
package/package.json +26 -22

package/lib/components/toggle-switch/toggle-switch.less CHANGED Viewed

@@ -1,104 +1,104 @@
-.s-toggle-switch {
-    @ts-bg-image-fill: .set-white()[default];
-    @ts-bg-image-fill-dark: .set-white-dark()[default];
-    --_ts-bg: var(--black-350);
-    --_ts-bg-image: url("data:image/svg+xml;,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='@{ts-bg-image-fill}'/%3e%3c/svg%3e");
-    --_ts-bg-ps: left center;
-    --_ts-multiple-bg: unset;
-    --_ts-multiple-fc: var(--black-400);
-    .dark-mode({
-        --_ts-bg-image: url("data:image/svg+xml;,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='@{ts-bg-image-fill-dark}'/%3e%3c/svg%3e");
-    });
-    fieldset[disabled] &,
-    &[disabled] {
-        &,
-        & label {
-            cursor: not-allowed;
-            opacity: var(--_o-disabled-static);
-        }
-    }
-    &&__multiple { // TODO split single and multiple toggle into two seperate components
-        input[type="radio"] {
-            &:checked {
-                + label {
-                    &.s-toggle-switch--label-off {
-                        --_ts-multiple-bg: var(--black-400);
-                        --_ts-multiple-fc: var(--white);
-                    }
-                    &:not(.s-toggle-switch--label-off) {
-                        --_ts-multiple-bg: var(--green-400);
-                        --_ts-multiple-fc: var(--white);
-                    }
-                }
-            }
-            &:focus-visible + label {
-                .focus-styles(true);
-            }
-            left: -999em;
-            margin: 0;
-            opacity: 0;
-            position: absolute;
-        }
-        label {
-            background-color: var(--_ts-multiple-bg);
-            color: var(--_ts-multiple-fc);
-            border-radius: 1000px;
-            cursor: pointer;
-            font-size: var(--fs-body1);
-            font-weight: 400;
-            line-height: 1;
-            margin: 0;
-            padding: 0.5em 0.7em;
-            text-align: center;
-            white-space: nowrap;
-            width: 100%;
-            -webkit-touch-callout: none;
-            -webkit-user-select: none;
-            user-select: none;
-        }
-        align-items: stretch;
-        display: flex;
-    }
-    input[type="checkbox"], // TODO DEPRECATED: drop support for nested input[type="checkbox"]
-    input[type="checkbox"]& {
-        &:checked {
-            --_ts-bg: var(--green-400);
-            --_ts-bg-ps: right center;
-        }
-        &:focus-visible {
-            .focus-styles();
-        }
-        &[disabled] {
-            cursor: default;
-        }
-        background-color: var(--_ts-bg);
-        background-position: var(--_ts-bg-ps);
-        appearance: none;
-        background-image: var(--_ts-bg-image);
-        background-size: contain;
-        background-repeat: no-repeat;
-        border-radius: 1000px;
-        cursor: pointer;
-        flex-shrink: 0;
-        height: var(--su-static24);
-        margin: 0; // guard against production adding 5px of margin to these
-        transition: background-position 0.2s ease;
-        vertical-align: top;
-        width: calc(var(--su-static48) - var(--su-static4));
-    }
-}
+.s-toggle-switch {
+    @ts-bg-image-fill: .set-white()[default];
+    @ts-bg-image-fill-dark: .set-white-dark()[default];
+    --_ts-bg: var(--black-350);
+    --_ts-bg-image: url("data:image/svg+xml;,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='@{ts-bg-image-fill}'/%3e%3c/svg%3e");
+    --_ts-bg-ps: left center;
+    --_ts-multiple-bg: unset;
+    --_ts-multiple-fc: var(--black-400);
+    .dark-mode({
+        --_ts-bg-image: url("data:image/svg+xml;,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='@{ts-bg-image-fill-dark}'/%3e%3c/svg%3e");
+    });
+    fieldset[disabled] &,
+    &[disabled] {
+        &,
+        & label {
+            cursor: not-allowed;
+            opacity: var(--_o-disabled-static);
+        }
+    }
+    &&__multiple { // TODO split single and multiple toggle into two seperate components
+        input[type="radio"] {
+            &:checked {
+                + label {
+                    &.s-toggle-switch--label-off {
+                        --_ts-multiple-bg: var(--black-400);
+                        --_ts-multiple-fc: var(--white);
+                    }
+                    &:not(.s-toggle-switch--label-off) {
+                        --_ts-multiple-bg: var(--green-400);
+                        --_ts-multiple-fc: var(--white);
+                    }
+                }
+            }
+            &:focus-visible + label {
+                .focus-styles(true);
+            }
+            left: -999em;
+            margin: 0;
+            opacity: 0;
+            position: absolute;
+        }
+        label {
+            background-color: var(--_ts-multiple-bg);
+            color: var(--_ts-multiple-fc);
+            border-radius: 1000px;
+            cursor: pointer;
+            font-size: var(--fs-body1);
+            font-weight: 400;
+            line-height: 1;
+            margin: 0;
+            padding: 0.5em 0.7em;
+            text-align: center;
+            white-space: nowrap;
+            width: 100%;
+            -webkit-touch-callout: none;
+            -webkit-user-select: none;
+            user-select: none;
+        }
+        align-items: stretch;
+        display: flex;
+    }
+    input[type="checkbox"], // TODO DEPRECATED: drop support for nested input[type="checkbox"]
+    input[type="checkbox"]& {
+        &:checked {
+            --_ts-bg: var(--green-400);
+            --_ts-bg-ps: right center;
+        }
+        &:focus-visible {
+            .focus-styles();
+        }
+        &[disabled] {
+            cursor: default;
+        }
+        background-color: var(--_ts-bg);
+        background-position: var(--_ts-bg-ps);
+        appearance: none;
+        background-image: var(--_ts-bg-image);
+        background-size: contain;
+        background-repeat: no-repeat;
+        border-radius: 1000px;
+        cursor: pointer;
+        flex-shrink: 0;
+        height: var(--su-static24);
+        margin: 0; // guard against production adding 5px of margin to these
+        transition: background-position 0.2s ease;
+        vertical-align: top;
+        width: calc(var(--su-static48) - var(--su-static4));
+    }
+}