@digdir/designsystemet-css 1.12.1 → 1.13.0
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.
- package/dist/src/avatar-stack.css +1 -1
- package/dist/src/badge.css +1 -1
- package/dist/src/base.css +1 -1
- package/dist/src/button.css +1 -1
- package/dist/src/card.css +1 -1
- package/dist/src/combobox.css +1 -1
- package/dist/src/dialog.css +1 -1
- package/dist/src/index.css +3 -3
- package/dist/src/input.css +1 -1
- package/dist/src/spinner.css +1 -1
- package/dist/src/table.css +1 -1
- package/dist/src/tabs.css +1 -1
- package/dist/src/tag.css +1 -1
- package/dist/src/toggle-group.css +1 -1
- package/dist/src/togglegroup.css +1 -1
- package/dist/theme/designsystemet.css +1 -1
- package/package.json +5 -5
- package/theme/types.d.ts +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
.ds-avatar-stack{--dsc-avatar-stack-size:var(--ds-size-12);--dsc-avatar-stack-gap:2px;--dsc-avatar-stack-overlap:50;--dsc-avatar-count:initial;--_gap:var(--dsc-avatar-stack-gap);--_overlap:calc(((var(--dsc-avatar-stack-size)/100)*var(--dsc-avatar-stack-overlap))*-1);--_ds-captured-length:var(--_overlap);align-items:center;display:flex;isolation:isolate;margin:0;padding-block:1px;transition:--_ds-captured-length .2s ease;width:-moz-max-content;width:max-content}.ds-avatar-stack:focus-visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}.ds-avatar-stack:focus-visible *{--_ds--focus: }.ds-avatar-stack[data-expandable]:focus-visible,.ds-avatar-stack[data-expandable]:hover{--_ds-captured-length:var(--_gap)}.ds-avatar-stack[data-expandable=fixed]{width:calc(var(--dsc-avatar-stack-size)*var(--dsc-avatar-count) + var(--_overlap)*(var(--dsc-avatar-count) - 1))}.ds-avatar-stack:empty{display:none}.ds-avatar-stack[data-suffix]:after{content:attr(data-suffix);font-size:max(1rem,calc(var(--dsc-avatar-stack-size)*.4));margin-left:1ch;place-self:center}.ds-avatar-stack .ds-avatar{--dsc-avatar-size:var(--dsc-avatar-stack-size);--_font-size:max(0.75rem,calc(var(--dsc-avatar-stack-size)*0.5));-webkit-mask:radial-gradient(50% 50% at calc(150% + var(--_ds-captured-length)),transparent calc(100% - 1px + var(--_gap)),#000 calc(100% + var(--_gap)));mask:radial-gradient(50% 50% at calc(150% + var(--_ds-captured-length)),transparent calc(100% - 1px + var(--_gap)),#000 calc(100% + var(--_gap)))}[data-variant=square]:is(.ds-avatar-stack .ds-avatar){-webkit-mask:linear-gradient(to right,#000 calc(100% + var(--_ds-captured-length) - var(--_gap)),transparent calc(100% + var(--_ds-captured-length) - var(--_gap)));mask:linear-gradient(to right,#000 calc(100% + var(--_ds-captured-length) - var(--_gap)),transparent calc(100% + var(--_ds-captured-length) - var(--_gap)))}:is(.ds-avatar-stack .ds-avatar):not(:first-child){margin-left:var(--_ds-captured-length)}:is(.ds-avatar-stack .ds-avatar):nth-last-child(1 of .ds-avatar){-webkit-mask:none;mask:none}@supports not selector(:nth-last-child(1 of .ds-avatar)){:is(.ds-avatar-stack .ds-avatar):not(:has(+.ds-avatar)){-webkit-mask:none;mask:none}}:is(.ds-avatar-stack .ds-avatar):not([data-size]){--dsc-avatar-font-size:var(--_font-size)}:is(.ds-avatar-stack .ds-avatar):focus-visible,:is(.ds-avatar-stack .ds-avatar):has(:focus-visible){-webkit-mask:none;mask:none}:is(:is(.ds-avatar-stack .ds-avatar):has(:focus-visible),:is(.ds-avatar-stack .ds-avatar):focus-visible){box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}:is(:is(.ds-avatar-stack .ds-avatar):has(:focus-visible),:is(.ds-avatar-stack .ds-avatar):focus-visible) *{--_ds--focus: }:is(.ds-avatar-stack .ds-avatar):focus-visible,:is(.ds-avatar-stack .ds-avatar):has(:focus-visible){z-index:1}
|
package/dist/src/badge.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ds-badge{--dsc-badge-background:var(--ds-color-base-default);--dsc-badge-color:var(--ds-color-base-contrast-default);--dsc-badge-padding:0 calc(var(--ds-size-1) + var(--ds-size-1)/2);--dsc-badge-size:calc(var(--ds-size-3) + var(--ds-size-1)/2);--dsc-badge-top:inherit;--dsc-badge-bottom:inherit;--dsc-badge-left:inherit;--dsc-badge-right:inherit;-webkit-print-color-adjust:exact;print-color-adjust:exact;vertical-align:middle}.ds-badge:not([hidden]){display:inline-flex}.ds-badge:before{background:var(--dsc-badge-background);border-radius:var(--ds-border-radius-full);box-sizing:border-box;color:var(--dsc-badge-color);content:attr(data-count);display:inline-grid;font-size:var(--ds-font-size-minus-1);line-height:var(--ds-line-height-sm);min-height:var(--dsc-badge-size);min-width:var(--dsc-badge-size);padding:var(--dsc-badge-padding);place-items:center;width:-moz-fit-content;width:fit-content}@supports (content:attr(data-count,"")){.ds-badge:before{content:attr(data-count,"")}}.ds-badge[data-variant=base]{--dsc-badge-background:var(--ds-color-base-default);--dsc-badge-color:var(--ds-color-base-contrast-default)}.ds-badge[data-variant=tinted]{--dsc-badge-background:var(--ds-color-surface-tinted);--dsc-badge-color:var(--ds-color-text-default)}.ds-badge--position{box-sizing:border-box;height:-moz-fit-content;height:fit-content;position:relative;width:-moz-fit-content;width:fit-content}.ds-badge--position:not([hidden]){display:inline-flex}.ds-badge--position .ds-badge:before{bottom:var(--dsc-badge-bottom);left:var(--dsc-badge-left);position:absolute;right:var(--dsc-badge-right);top:var(--dsc-badge-top)}.ds-badge--position
|
|
1
|
+
.ds-badge{--dsc-badge-background:var(--ds-color-base-default);--dsc-badge-color:var(--ds-color-base-contrast-default);--dsc-badge-padding:0 calc(var(--ds-size-1) + var(--ds-size-1)/2);--dsc-badge-size:calc(var(--ds-size-3) + var(--ds-size-1)/2);--dsc-badge-top:inherit;--dsc-badge-bottom:inherit;--dsc-badge-left:inherit;--dsc-badge-right:inherit;-webkit-print-color-adjust:exact;print-color-adjust:exact;vertical-align:middle}.ds-badge:not([hidden]){display:inline-flex}.ds-badge:before{background:var(--dsc-badge-background);border-radius:var(--ds-border-radius-full);box-sizing:border-box;color:var(--dsc-badge-color);content:attr(data-count);display:inline-grid;font-size:var(--ds-font-size-minus-1);line-height:var(--ds-line-height-sm);min-height:var(--dsc-badge-size);min-width:var(--dsc-badge-size);padding:var(--dsc-badge-padding);place-items:center;width:-moz-fit-content;width:fit-content}@supports (content:attr(data-count,"")){.ds-badge:before{content:attr(data-count,"")}}.ds-badge[data-variant=base]{--dsc-badge-background:var(--ds-color-base-default);--dsc-badge-color:var(--ds-color-base-contrast-default)}.ds-badge[data-variant=tinted]{--dsc-badge-background:var(--ds-color-surface-tinted);--dsc-badge-color:var(--ds-color-text-default)}.ds-badge--position{box-sizing:border-box;height:-moz-fit-content;height:fit-content;position:relative;width:-moz-fit-content;width:fit-content;--_ds-captured-length:1em}.ds-badge--position:not([hidden]){display:inline-flex}.ds-badge--position .ds-badge:before{bottom:var(--dsc-badge-bottom);left:var(--dsc-badge-left);position:absolute;right:var(--dsc-badge-right);top:var(--dsc-badge-top);z-index:1}.ds-badge--position>:where(img,svg){flex-shrink:0;font-size:calc(var(--_ds-captured-length)*1.25)}.ds-badge--position[data-placement=top-right] .ds-badge:before{right:var(--dsc-badge-right,0);top:var(--dsc-badge-top,0);translate:50% -50%}.ds-badge--position[data-placement=top-left] .ds-badge:before{left:var(--dsc-badge-left,0);top:var(--dsc-badge-top,0);translate:-50% -50%}.ds-badge--position[data-placement=bottom-right] .ds-badge:before{bottom:var(--dsc-badge-bottom,0);right:var(--dsc-badge-right,0);translate:50% 50%}.ds-badge--position[data-placement=bottom-left] .ds-badge:before{bottom:var(--dsc-badge-bottom,0);left:var(--dsc-badge-left,0);translate:-50% 50%}.ds-badge--position[data-placement=top-right][data-overlap=circle] .ds-badge:before{right:var(--dsc-badge-right,14%);top:var(--dsc-badge-top,14%);translate:50% -50%}.ds-badge--position[data-placement=top-left][data-overlap=circle] .ds-badge:before{left:var(--dsc-badge-left,14%);top:var(--dsc-badge-top,14%);translate:-50% -50%}.ds-badge--position[data-placement=bottom-right][data-overlap=circle] .ds-badge:before{bottom:var(--dsc-badge-bottom,14%);right:var(--dsc-badge-right,14%);translate:50% 50%}.ds-badge--position[data-placement=bottom-left][data-overlap=circle] .ds-badge:before{bottom:var(--dsc-badge-bottom,14%);left:var(--dsc-badge-left,14%);translate:-50% 50%}
|
package/dist/src/base.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ds-sr-only{border:0;clip:rect(0 0 0 0);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}:root{--ds-font-size-minus-1:max(0.9em,0.875rem);--ds-font-size-plus-1:1.1em;--ds-readonly-icon-size:1.2em;--ds-readonly-icon-url:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2.25A4.75 4.75 0 0 0 7.25 7v2.25H7A1.75 1.75 0 0 0 5.25 11v9c0 .41.34.75.75.75h12a.75.75 0 0 0 .75-.75v-9A1.75 1.75 0 0 0 17 9.25h-.25V7A4.75 4.75 0 0 0 12 2.25m3.25 7V7a3.25 3.25 0 0 0-6.5 0v2.25zM12 13a1.5 1.5 0 0 0-.75 2.8V17a.75.75 0 0 0 1.5 0v-1.2A1.5 1.5 0 0 0 12 13'/%3E%3C/svg%3E")}@supports (width:round(down,0.1em,1px)){:root{--ds-font-size-minus-1:round(down,max(0.9em,0.875rem),1px);--ds-font-size-plus-1:round(down,1.1em,1px)}}:root,[data-color-scheme]{--dsc-focus-boxShadow:0 0 0 var(--ds-border-width-focus) var(--ds-color-focus-inner);--dsc-focus-boxShadow-inset:inset 0 0 0 calc(var(--ds-border-width-focus)*2) var(--ds-color-focus-inner);--dsc-focus-outline:var(--ds-color-focus-outer) solid var(--ds-border-width-focus)}[data-color-scheme],body{background:var(--ds-color-neutral-background-default);color:var(--ds-color-neutral-text-default)}.ds-readonly-icon:before{background:currentcolor;content:"";display:inline-block;height:calc(1em*var(--ds-line-height-md));height:1lh;margin-inline-end:.25ch;-webkit-mask:center/contain no-repeat var(--ds-readonly-icon-url);mask:center/contain no-repeat var(--ds-readonly-icon-url);vertical-align:bottom;width:var(--ds-readonly-icon-size)}:is(.ds-readonly-icon:before){-webkit-print-color-adjust:exact;print-color-adjust:exact}@media (forced-colors:active){.ds-readonly-icon:before{background:CanvasText}}.ds-print-preserve{-webkit-print-color-adjust:exact;print-color-adjust:exact}.ds-focus:focus-visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}.ds-focus:focus-visible *{--_ds--focus: }.ds-focus--inset:focus-visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow-inset));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:calc(var(--_ds--focus, var(--ds-border-width-focus))*-1)}.ds-focus--inset:focus-visible *{--_ds--focus: }.ds-focus--visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}.ds-focus--visible *{--_ds--focus: }.ds-focus--visible--inset{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow-inset));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:calc(var(--_ds--focus, var(--ds-border-width-focus))*-1)}.ds-focus--visible--inset *{--_ds--focus: }.ds-floating{--_ds-floating:top;--_ds-floating-arrow-size:0;--_ds-floating-arrow-visibility:inherit;animation:ds-fade-in .15s ease-in-out forwards;inset:0 auto auto 0;margin:0;overflow:visible;position:absolute}.ds-floating:before{background:inherit;border:inherit;border-left-color:transparent;border-top-color:transparent;box-sizing:border-box;content:"";height:var(--_ds-floating-arrow-size);left:var(--_ds-floating-arrow-x,50%);position:absolute;rotate:45deg;top:var(--_ds-floating-arrow-y,100%);translate:-50% -50%;visibility:var(--_ds-floating-arrow-visibility);width:var(--_ds-floating-arrow-size)}.ds-floating[data-overscroll=contain]{--_ds-floating-overscroll:contain;overflow:auto;overscroll-behavior:contain}.ds-floating{&[data-floating|=top]:before{rotate:45deg;top:100%}&[data-floating|=right]:before{left:0;rotate:135deg}&[data-floating|=bottom]:before{rotate:-135deg;top:0}&[data-floating|=left]:before{left:100%;rotate:-45deg}}@keyframes ds-fade-in{0%{opacity:0}}body{font-weight:var(--ds-body-md-font-weight);letter-spacing:var(--ds-body-md-letter-spacing);line-height:var(--ds-body-md-line-height)}[data-size]
|
|
1
|
+
.ds-sr-only{border:0;clip:rect(0 0 0 0);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}:root{--ds-font-size-minus-1:max(0.9em,0.875rem);--ds-font-size-plus-1:1.1em;--ds-readonly-icon-size:1.2em;--ds-readonly-icon-url:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2.25A4.75 4.75 0 0 0 7.25 7v2.25H7A1.75 1.75 0 0 0 5.25 11v9c0 .41.34.75.75.75h12a.75.75 0 0 0 .75-.75v-9A1.75 1.75 0 0 0 17 9.25h-.25V7A4.75 4.75 0 0 0 12 2.25m3.25 7V7a3.25 3.25 0 0 0-6.5 0v2.25zM12 13a1.5 1.5 0 0 0-.75 2.8V17a.75.75 0 0 0 1.5 0v-1.2A1.5 1.5 0 0 0 12 13'/%3E%3C/svg%3E")}@supports (width:round(down,0.1em,1px)){:root{--ds-font-size-minus-1:round(down,max(0.9em,0.875rem),1px);--ds-font-size-plus-1:round(down,1.1em,1px)}}:root,[data-color-scheme]{--dsc-focus-boxShadow:0 0 0 var(--ds-border-width-focus) var(--ds-color-focus-inner);--dsc-focus-boxShadow-inset:inset 0 0 0 calc(var(--ds-border-width-focus)*2) var(--ds-color-focus-inner);--dsc-focus-outline:var(--ds-color-focus-outer) solid var(--ds-border-width-focus)}[data-color-scheme],body{background:var(--ds-color-neutral-background-default);color:var(--ds-color-neutral-text-default)}.ds-readonly-icon:before{background:currentcolor;content:"";display:inline-block;height:calc(1em*var(--ds-line-height-md));height:1lh;margin-inline-end:.25ch;-webkit-mask:center/contain no-repeat var(--ds-readonly-icon-url);mask:center/contain no-repeat var(--ds-readonly-icon-url);vertical-align:bottom;width:var(--ds-readonly-icon-size)}:is(.ds-readonly-icon:before){-webkit-print-color-adjust:exact;print-color-adjust:exact}@media (forced-colors:active){.ds-readonly-icon:before{background:CanvasText}}.ds-print-preserve{-webkit-print-color-adjust:exact;print-color-adjust:exact}.ds-focus:focus-visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}.ds-focus:focus-visible *{--_ds--focus: }.ds-focus--inset:focus-visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow-inset));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:calc(var(--_ds--focus, var(--ds-border-width-focus))*-1)}.ds-focus--inset:focus-visible *{--_ds--focus: }.ds-focus--visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}.ds-focus--visible *{--_ds--focus: }.ds-focus--visible--inset{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow-inset));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:calc(var(--_ds--focus, var(--ds-border-width-focus))*-1)}.ds-focus--visible--inset *{--_ds--focus: }.ds-floating{--_ds-floating:top;--_ds-floating-arrow-size:0;--_ds-floating-arrow-visibility:inherit;animation:ds-fade-in .15s ease-in-out forwards;inset:0 auto auto 0;margin:0;overflow:visible;position:absolute}.ds-floating:before{background:inherit;border:inherit;border-left-color:transparent;border-top-color:transparent;box-sizing:border-box;content:"";height:var(--_ds-floating-arrow-size);left:var(--_ds-floating-arrow-x,50%);position:absolute;rotate:45deg;top:var(--_ds-floating-arrow-y,100%);translate:-50% -50%;visibility:var(--_ds-floating-arrow-visibility);width:var(--_ds-floating-arrow-size)}.ds-floating[data-overscroll=contain]{--_ds-floating-overscroll:contain;overflow:auto;overscroll-behavior:contain}.ds-floating{&[data-floating|=top]:before{rotate:45deg;top:100%}&[data-floating|=right]:before{left:0;rotate:135deg}&[data-floating|=bottom]:before{rotate:-135deg;top:0}&[data-floating|=left]:before{left:100%;rotate:-45deg}}@keyframes ds-fade-in{0%{opacity:0}}body{font-size:var(--ds-body-md-font-size);font-weight:var(--ds-body-md-font-weight);letter-spacing:var(--ds-body-md-letter-spacing);line-height:var(--ds-body-md-line-height)}[data-size]{font-size:var(--ds-body-md-font-size)}@property --_ds-captured-length{syntax:"<length>";inherits:true;initial-value:0}
|
package/dist/src/button.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ds-button{--dsc-button-background--active:var(--ds-color-base-active);--dsc-button-background--hover:var(--ds-color-base-hover);--dsc-button-background:var(--ds-color-base-default);--dsc-button-color:var(--ds-color-base-contrast-default);--dsc-button-color--hover:var(--ds-color-base-contrast-default);--dsc-button-border-width:var(--ds-border-width-default);--dsc-button-border-style:solid;--dsc-button-border-color:transparent;--dsc-button-gap:var(--ds-size-2);--dsc-button-padding:var(--ds-size-2) var(--ds-size-4);--dsc-button-size:var(--ds-size-12);align-items:center;background:var(--dsc-button-background);border-color:var(--dsc-button-border-color);border-radius:var(--ds-border-radius-default);border-style:var(--dsc-button-border-style);border-width:var(--dsc-button-border-width);box-sizing:border-box;color:var(--dsc-button-color);cursor:pointer;font-family:inherit;font-weight:var(--ds-font-weight-medium);gap:var(--dsc-button-gap);height:-moz-fit-content;height:fit-content;justify-content:center;line-height:var(--ds-line-height-sm);min-height:var(--dsc-button-size);min-width:var(--dsc-button-size);outline:none;padding:var(--dsc-button-padding);-webkit-print-color-adjust:exact;print-color-adjust:exact;text-align:inherit;text-decoration:none}.ds-button:focus-visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}.ds-button:focus-visible *{--_ds--focus: }.ds-button[data-variant=secondary],.ds-button[data-variant=tertiary]{--dsc-button-background:transparent;--dsc-button-background--active:var(--ds-color-surface-active);--dsc-button-background--hover:var(--ds-color-surface-hover);--dsc-button-color:var(--ds-color-text-subtle);--dsc-button-color--hover:var(--ds-color-text-default)}.ds-button[data-variant=secondary]{--dsc-button-border-color:var(--ds-color-border-strong)}.ds-button:not([data-size]){font-size:inherit}.ds-button :where(img,svg){flex-shrink:0;font-size:1.
|
|
1
|
+
.ds-button{--dsc-button-background--active:var(--ds-color-base-active);--dsc-button-background--hover:var(--ds-color-base-hover);--dsc-button-background:var(--ds-color-base-default);--dsc-button-color:var(--ds-color-base-contrast-default);--dsc-button-color--hover:var(--ds-color-base-contrast-default);--dsc-button-border-width:var(--ds-border-width-default);--dsc-button-border-style:solid;--dsc-button-border-color:transparent;--dsc-button-gap:var(--ds-size-2);--dsc-button-padding:var(--ds-size-2) var(--ds-size-4);--dsc-button-size:var(--ds-size-12);--_ds-captured-length:1em;align-items:center;background:var(--dsc-button-background);border-color:var(--dsc-button-border-color);border-radius:var(--ds-border-radius-default);border-style:var(--dsc-button-border-style);border-width:var(--dsc-button-border-width);box-sizing:border-box;color:var(--dsc-button-color);cursor:pointer;font-family:inherit;font-weight:var(--ds-font-weight-medium);gap:var(--dsc-button-gap);height:-moz-fit-content;height:fit-content;justify-content:center;line-height:var(--ds-line-height-sm);min-height:var(--dsc-button-size);min-width:var(--dsc-button-size);outline:none;padding:var(--dsc-button-padding);-webkit-print-color-adjust:exact;print-color-adjust:exact;text-align:inherit;text-decoration:none}.ds-button:focus-visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}.ds-button:focus-visible *{--_ds--focus: }.ds-button[data-variant=secondary],.ds-button[data-variant=tertiary]{--dsc-button-background:transparent;--dsc-button-background--active:var(--ds-color-surface-active);--dsc-button-background--hover:var(--ds-color-surface-hover);--dsc-button-color:var(--ds-color-text-subtle);--dsc-button-color--hover:var(--ds-color-text-default)}.ds-button[data-variant=secondary]{--dsc-button-border-color:var(--ds-color-border-strong)}.ds-button:not([data-size]){font-size:inherit}.ds-button :where(img,svg):not(.ds-spinner){flex-shrink:0;font-size:calc(var(--_ds-captured-length)*1.3)}.ds-button:focus-visible{position:relative}.ds-button:where(:not([hidden])){display:flex}.ds-button[data-icon]{height:var(--dsc-button-size);padding:0;width:var(--dsc-button-size)}.ds-button[data-icon] :where(img,svg):not(.ds-spinner){font-size:calc(var(--_ds-captured-length)*1.5)}.ds-button[data-fullwidth]{text-align:center;width:100%}.ds-button .ds-spinner{height:1.4em}@media (hover:hover) and (pointer:fine){.ds-button:where(:not(:disabled,[aria-disabled=true],[aria-busy=true])):hover{background:var(--dsc-button-background--hover);color:var(--dsc-button-color--hover)}}.ds-button[aria-busy=true]{cursor:progress}.ds-button:is(:disabled,[aria-disabled=true]){cursor:not-allowed;opacity:var(--ds-opacity-disabled)}.ds-button[aria-busy=true]:is(:disabled,[aria-disabled=true]){cursor:progress;opacity:1}.ds-button:where(:not(:disabled,[aria-disabled=true],[aria-busy=true])):active{background:var(--dsc-button-background--active)}
|
package/dist/src/card.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ds-card{--dsc-card-background--active:var(--ds-color-surface-active);--dsc-card-background--hover:var(--ds-color-surface-hover);--dsc-card-background:var(--ds-color-surface-default);--dsc-card-border-width:var(--ds-border-width-default);--dsc-card-border-style:solid;--dsc-card-border-color:var(--ds-color-border-subtle);--dsc-card-block-border-width:var(--dsc-card-border-width);--dsc-card-block-border-style:var(--dsc-card-border-style);--dsc-card-block-border-color:var(--dsc-card-border-color);--dsc-card-color:var(--ds-color-text-default);--dsc-card-content-margin-block:var(--ds-size-3) 0;--dsc-card-padding:var(--ds-size-6);--dsc-card-border-radius:var(--ds-border-radius-lg);background:var(--dsc-card-background);border-color:var(--dsc-card-border-color);border-radius:var(--dsc-card-border-radius);border-style:var(--dsc-card-border-style);border-width:var(--dsc-card-border-width);box-sizing:border-box;color:var(--dsc-card-color);font:inherit;margin:0;overflow:clip;padding:var(--dsc-card-padding);text-align:inherit}.ds-card[data-variant=default]{background:var(--ds-color-surface-default)}.ds-card[data-variant=tinted]{background:var(--ds-color-surface-tinted)}.ds-card:not([hidden]){display:block}.ds-card:where(a,button,[role=button],[data-clickdelegatefor]){cursor:pointer;text-decoration:none}.ds-card:where(a,button,[role=button],[data-clickdelegatefor])>.ds-card__block>:is(h1,h2,h3,h4,h5,h6),.ds-card:where(a,button,[role=button],[data-clickdelegatefor])>:is(h1,h2,h3,h4,h5,h6){text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:.0625em;text-underline-offset:.27em}:is(.ds-card:where(a,button,[role=button],[data-clickdelegatefor])>:is(h1,h2,h3,h4,h5,h6),.ds-card:where(a,button,[role=button],[data-clickdelegatefor])>.ds-card__block>:is(h1,h2,h3,h4,h5,h6))>a{color:inherit;text-decoration:none}@media (hover:hover) and (pointer:fine){.ds-card:where(a,button,[role=button]):hover,.ds-card[data-clickdelegatefor]:has(.\:click-delegate-hover){background:var(--dsc-card-background--hover)}:is(.ds-card:where(a,button,[role=button]):hover,.ds-card[data-clickdelegatefor]:has(.\:click-delegate-hover)):active{background:var(--dsc-card-background--active)}}.ds-card:has(>.ds-card__block
|
|
1
|
+
.ds-card{--dsc-card-background--active:var(--ds-color-surface-active);--dsc-card-background--hover:var(--ds-color-surface-hover);--dsc-card-background:var(--ds-color-surface-default);--dsc-card-border-width:var(--ds-border-width-default);--dsc-card-border-style:solid;--dsc-card-border-color:var(--ds-color-border-subtle);--dsc-card-block-border-width:var(--dsc-card-border-width);--dsc-card-block-border-style:var(--dsc-card-border-style);--dsc-card-block-border-color:var(--dsc-card-border-color);--dsc-card-color:var(--ds-color-text-default);--dsc-card-content-margin-block:var(--ds-size-3) 0;--dsc-card-padding:var(--ds-size-6);--dsc-card-border-radius:var(--ds-border-radius-lg);background:var(--dsc-card-background);border-color:var(--dsc-card-border-color);border-radius:var(--dsc-card-border-radius);border-style:var(--dsc-card-border-style);border-width:var(--dsc-card-border-width);box-sizing:border-box;color:var(--dsc-card-color);font:inherit;margin:0;overflow:clip;padding:var(--dsc-card-padding);text-align:inherit}.ds-card[data-variant=default]{background:var(--ds-color-surface-default)}.ds-card[data-variant=tinted]{background:var(--ds-color-surface-tinted)}.ds-card:not([hidden]){display:block}.ds-card:where(a,button,[role=button],[data-clickdelegatefor]){cursor:pointer;text-decoration:none}.ds-card:where(a,button,[role=button],[data-clickdelegatefor])>.ds-card__block>:is(h1,h2,h3,h4,h5,h6),.ds-card:where(a,button,[role=button],[data-clickdelegatefor])>:is(h1,h2,h3,h4,h5,h6){text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:.0625em;text-underline-offset:.27em}:is(.ds-card:where(a,button,[role=button],[data-clickdelegatefor])>:is(h1,h2,h3,h4,h5,h6),.ds-card:where(a,button,[role=button],[data-clickdelegatefor])>.ds-card__block>:is(h1,h2,h3,h4,h5,h6))>a{color:inherit;text-decoration:none}@media (hover:hover) and (pointer:fine){.ds-card:where(a,button,[role=button]):hover,.ds-card[data-clickdelegatefor]:has(.\:click-delegate-hover){background:var(--dsc-card-background--hover)}:is(.ds-card:where(a,button,[role=button]):hover,.ds-card[data-clickdelegatefor]:has(.\:click-delegate-hover)):active{background:var(--dsc-card-background--active)}}.ds-card:has(>.ds-card__block,>.ds-details){padding:0}.ds-card>.ds-details:first-child{border-top:0}:is(.ds-card>.ds-details:first-child)>summary,:is(.ds-card>.ds-details:first-child)>u-summary{border-top-left-radius:var(--dsc-card-border-radius);border-top-right-radius:var(--dsc-card-border-radius)}.ds-card>.ds-details:last-child{border-bottom:0}:is(.ds-card>.ds-details:last-child):not([open])>summary,:is(.ds-card>.ds-details:last-child):not([open])>u-summary{border-bottom-left-radius:var(--dsc-card-border-radius);border-bottom-right-radius:var(--dsc-card-border-radius)}:where(.ds-card,.ds-card__block)>:first-child{margin-block:0}:where(.ds-card,.ds-card__block)>*+*{margin-block:var(--dsc-card-content-margin-block)}.ds-card__block{box-sizing:border-box;margin:0;padding:var(--dsc-card-padding);position:relative}.ds-card__block:before{border-color:var(--dsc-card-block-border-color);border-top-style:var(--dsc-card-block-border-style);border-top-width:var(--dsc-card-block-border-width);content:"";inset:0 0 auto;position:absolute;translate:0 -100%}.ds-card__block:after{border-color:var(--dsc-card-block-border-color);border-left-style:var(--dsc-card-block-border-style);border-left-width:var(--dsc-card-block-border-width);content:"";inset:0 auto 0 0;position:absolute;translate:-100%}.ds-card__block:has(>:is(audio,figure,iframe,img,picture,video):only-child){padding:0}.ds-card__block:has(>:is(audio,figure,iframe,img,picture,video):only-child)>:not([hidden]),.ds-card__block:has(>:is(audio,figure,iframe,img,picture,video):only-child)>picture img:not([hidden]){border:0;display:block;height:auto;width:100%}.ds-card__block:has(>:is(audio,figure,iframe,img,picture,video):only-child)>iframe{aspect-ratio:16/9}
|
package/dist/src/combobox.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ds-textfield{display:grid;gap:var(--ds-size-2)}.ds-textfield__adornment{background:var(--ds-color-neutral-surface-tinted);border-radius:var(--ds-border-radius-md);color:var(--ds-color-neutral-text-subtle);display:inline-block;padding:9px var(--ds-size-4)}.ds-textfield__adornment,.ds-textfield__input{border:1px solid var(--ds-color-neutral-border-default);box-sizing:border-box}.ds-textfield__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--ds-color-neutral-surface-default);border-radius:var(--ds-border-radius-md);color:var(--ds-color-neutral-text-default);flex:0 1 auto;font-family:inherit;padding:0 var(--ds-size-3);position:relative;width:100%}.ds-textfield__input:disabled{cursor:not-allowed}.ds-textfield--readonly .ds-textfield__input{background:var(--ds-color-neutral-surface-tinted);border-color:var(--ds-color-neutral-border-strong)}.ds-textfield__field{align-items:stretch;border-radius:var(--ds-border-radius-md);display:flex}.ds-textfield__field>:first-child{border-bottom-left-radius:var(--ds-border-radius-md);border-top-left-radius:var(--ds-border-radius-md)}.ds-textfield__field>:last-child{border-bottom-right-radius:var(--ds-border-radius-md);border-top-right-radius:var(--ds-border-radius-md)}.ds-textfield--sm .ds-textfield__adornment{padding:var(--ds-size-2) var(--ds-size-3)}.ds-textfield--md .ds-textfield__adornment{padding:.65rem var(--ds-size-4)}.ds-textfield--lg .ds-textfield__adornment{padding:.85rem var(--ds-size-5)}.ds-textfield--sm .ds-textfield__field{height:var(--ds-size-10)}.ds-textfield--md .ds-textfield__field{height:var(--ds-size-12)}.ds-textfield--lg .ds-textfield__field{height:var(--ds-size-14)}.ds-textfield--sm .ds-textfield__input{padding:0 var(--ds-size-2)}.ds-textfield--md .ds-textfield__input{padding:0 var(--ds-size-3)}.ds-textfield--lg .ds-textfield__input{padding:0 var(--ds-size-4)}.ds-textfield__label{align-items:center;display:inline-flex;flex-direction:row;gap:var(--ds-size-1);min-width:-moz-min-content;min-width:min-content}.ds-textfield__description{color:var(--ds-color-neutral-text-subtle);margin-top:calc(var(--ds-size-2)*-1)}.ds-textfield:has(.ds-textfield__input:disabled){opacity:var(--ds-opacity-disabled)}.ds-textfield--error .ds-textfield__input:not(:focus-visible){border-color:var(--ds-color-danger-border-default);box-shadow:inset 0 0 0 1px var(--ds-color-danger-border-default)}@media (hover:hover) and (pointer:fine){.ds-textfield__input:not(:focus-visible,:disabled,[aria-disabled]):hover{border-color:var(--ds-color-border-strong);box-shadow:inset 0 0 0 1px var(--ds-color-border-strong)}}.ds-textfield__input--with-prefix{border-bottom-left-radius:0;border-top-left-radius:0}.ds-textfield__input--with-suffix{border-bottom-right-radius:0;border-top-right-radius:0}.ds-textfield__prefix{border-bottom-right-radius:0;border-right:0;border-top-right-radius:0;white-space:nowrap}.ds-textfield__suffix{border-bottom-left-radius:0;border-left:0;border-top-left-radius:0;white-space:nowrap}.ds-textfield__readonly__icon{height:1.2em;width:1.2em}.ds-textfield__error-message:empty{display:none}.ds-combobox{background-color:
|
|
1
|
+
.ds-textfield{display:grid;gap:var(--ds-size-2)}.ds-textfield__adornment{background:var(--ds-color-neutral-surface-tinted);border-radius:var(--ds-border-radius-md);color:var(--ds-color-neutral-text-subtle);display:inline-block;padding:9px var(--ds-size-4)}.ds-textfield__adornment,.ds-textfield__input{border:1px solid var(--ds-color-neutral-border-default);box-sizing:border-box}.ds-textfield__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--ds-color-neutral-surface-default);border-radius:var(--ds-border-radius-md);color:var(--ds-color-neutral-text-default);flex:0 1 auto;font-family:inherit;padding:0 var(--ds-size-3);position:relative;width:100%}.ds-textfield__input:disabled{cursor:not-allowed}.ds-textfield--readonly .ds-textfield__input{background:var(--ds-color-neutral-surface-tinted);border-color:var(--ds-color-neutral-border-strong)}.ds-textfield__field{align-items:stretch;border-radius:var(--ds-border-radius-md);display:flex}.ds-textfield__field>:first-child{border-bottom-left-radius:var(--ds-border-radius-md);border-top-left-radius:var(--ds-border-radius-md)}.ds-textfield__field>:last-child{border-bottom-right-radius:var(--ds-border-radius-md);border-top-right-radius:var(--ds-border-radius-md)}.ds-textfield--sm .ds-textfield__adornment{padding:var(--ds-size-2) var(--ds-size-3)}.ds-textfield--md .ds-textfield__adornment{padding:.65rem var(--ds-size-4)}.ds-textfield--lg .ds-textfield__adornment{padding:.85rem var(--ds-size-5)}.ds-textfield--sm .ds-textfield__field{height:var(--ds-size-10)}.ds-textfield--md .ds-textfield__field{height:var(--ds-size-12)}.ds-textfield--lg .ds-textfield__field{height:var(--ds-size-14)}.ds-textfield--sm .ds-textfield__input{padding:0 var(--ds-size-2)}.ds-textfield--md .ds-textfield__input{padding:0 var(--ds-size-3)}.ds-textfield--lg .ds-textfield__input{padding:0 var(--ds-size-4)}.ds-textfield__label{align-items:center;display:inline-flex;flex-direction:row;gap:var(--ds-size-1);min-width:-moz-min-content;min-width:min-content}.ds-textfield__description{color:var(--ds-color-neutral-text-subtle);margin-top:calc(var(--ds-size-2)*-1)}.ds-textfield:has(.ds-textfield__input:disabled){opacity:var(--ds-opacity-disabled)}.ds-textfield--error .ds-textfield__input:not(:focus-visible){border-color:var(--ds-color-danger-border-default);box-shadow:inset 0 0 0 1px var(--ds-color-danger-border-default)}@media (hover:hover) and (pointer:fine){.ds-textfield__input:not(:focus-visible,:disabled,[aria-disabled]):hover{border-color:var(--ds-color-border-strong);box-shadow:inset 0 0 0 1px var(--ds-color-border-strong)}}.ds-textfield__input--with-prefix{border-bottom-left-radius:0;border-top-left-radius:0}.ds-textfield__input--with-suffix{border-bottom-right-radius:0;border-top-right-radius:0}.ds-textfield__prefix{border-bottom-right-radius:0;border-right:0;border-top-right-radius:0;white-space:nowrap}.ds-textfield__suffix{border-bottom-left-radius:0;border-left:0;border-top-left-radius:0;white-space:nowrap}.ds-textfield__readonly__icon{height:1.2em;width:1.2em}.ds-textfield__error-message:empty{display:none}.ds-combobox{background-color:transparent;display:grid;gap:var(--ds-size-2)}.ds-combobox [data-floating-ui-portal]{grid-column:1/2;grid-row:1/2}.ds-combobox__options-wrapper{background:var(--ds-color-neutral-surface-default);border:1px solid var(--ds-color-neutral-border-default);border-radius:var(--ds-border-radius-md);box-shadow:var(--ds-shadow-md);color:var(--ds-color-neutral-text-default);overflow-y:auto;padding:var(--ds-size-2);z-index:1600}.ds-combobox--readonly .ds-combobox__input{pointer-events:none}.ds-combobox__input__wrapper{align-items:center;border-radius:var(--ds-border-radius-md);cursor:text;display:flex;gap:var(--ds-size-1);height:auto;justify-content:space-between;padding:var(--ds-size-2);position:relative;width:100%}.ds-combobox__input__wrapper .ds-combobox__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;box-sizing:border-box;color:var(--ds-color-neutral-text-default);flex-grow:1;font-family:inherit;font-size:inherit;font-weight:inherit;height:100%;line-height:inherit;min-width:50px;width:100%}.ds-combobox--sm .ds-combobox__input__wrapper{min-height:var(--ds-size-10);padding:5px var(--ds-size-2)}.ds-combobox--md .ds-combobox__input__wrapper{min-height:var(--ds-size-12);padding:7px var(--ds-size-3)}.ds-combobox--lg .ds-combobox__input__wrapper{min-height:var(--ds-size-14);padding:7px var(--ds-size-4)}.ds-combobox__input__wrapper .ds-combobox__input:focus{outline:none}.ds-combobox__input__wrapper.ds-combobox--error{border-color:var(--ds-color-danger-border-default);border-width:2px}.ds-combobox__chip-and-input{align-items:center;background-color:transparent;display:flex;flex-wrap:wrap;gap:var(--ds-size-2);width:100%}.ds-combobox__arrow{cursor:pointer;display:grid;place-items:center}.ds-combobox__input__wrapper.ds-combobox--readonly{background:var(--ds-color-base-default);border-color:var(--ds-color-base-default)}.ds-combobox__label{align-items:center;display:inline-flex;flex-direction:row;gap:var(--ds-size-1);grid-column:1/2;grid-row:1/2;min-width:-moz-min-content;min-width:min-content}.ds-combobox__description{color:var(--ds-color-neutral-text-subtle);margin-top:calc(var(--ds-size-2)*-1)}.ds-combobox__clear-button{aspect-ratio:1;background-color:transparent;border:none;border-radius:var(--ds-border-radius-sm);color:var(--ds-color-neutral-text-default);cursor:pointer;display:grid;height:29px;padding:0;place-items:center;width:29px}.ds-combobox--sm .ds-combobox__clear-button{height:25px;width:25px}.ds-combobox--md .ds-combobox__clear-button{height:29px;width:29px}.ds-combobox--lg .ds-combobox__clear-button{height:31px;width:31px}.ds-combobox__clear-button:not(:disabled):hover{background-color:var(--ds-color-neutral-surface-tinted)}.ds-combobox__disabled{opacity:var(--ds-opacity-disabled)}.ds-combobox__disabled *{cursor:not-allowed}.ds-combobox__readonly__icon{height:1.2em;width:1.2em}.ds-combobox__error-message{margin-top:var(--ds-size-2)}.ds-combobox__error-message:empty{display:none}.ds-combobox__loading{align-content:center;display:flex;gap:var(--ds-size-2)}.ds-combobox__input__wrapper:has(input:focus){--dsc-focus-border-width:3px;box-shadow:0 0 0 var(--dsc-focus-border-width) var(--ds-color-focus-inner);outline:var(--dsc-focus-border-width) solid var(--ds-color-focus-outer);outline-offset:var(--dsc-focus-border-width)}.ds-combobox__input__wrapper:focus-within:hover{border-color:var(--ds-color-neutral-border-default)}.ds-combobox__custom,.ds-combobox__empty,.ds-combobox__option{font-weight:400;padding:var(--ds-size-2) var(--ds-size-3)}.ds-combobox__option{background:none;border:none;border-left:5px solid transparent;border-radius:var(--ds-border-radius-sm);cursor:pointer;display:grid;font-family:inherit;grid-template-columns:1.2em 1fr;height:auto;justify-content:start;padding-left:var(--ds-size-1);text-align:left;width:100%}.ds-combobox__option.ds-combobox__option--active{background:var(--ds-color-surface-tinted);border-left:5px solid var(--ds-color-base-default)}.ds-combobox__option>div{align-self:flex-start}.ds-combobox__option.ds-combobox__option--multiple{gap:var(--ds-size-2);grid-template-columns:auto 1fr}.ds-combobox__option__label{color:var(--ds-color-neutral-text-default);cursor:pointer;display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--ds-size-1);margin:auto 0}.ds-combobox__option--active .ds-combobox__option__label{color:var(--ds-color-text-default)}.ds-combobox__option__icon-wrapper{aspect-ratio:1/1;background-color:var(--ds-color-neutral-surface-default);border:2px solid var(--ds-color-neutral-border-default);border-radius:var(--ds-border-radius-sm);display:grid;place-items:center;width:var(--ds-size-6)}.ds-combobox__option--active .ds-combobox__option__icon-wrapper{border-color:var(--ds-color-base-default)}.ds-combobox--sm .ds-combobox__option .ds-combobox__option__icon-wrapper{width:var(--ds-size-5)}.ds-combobox--md .ds-combobox__option .ds-combobox__option__icon-wrapper{width:var(--ds-size-6)}.ds-combobox--lg .ds-combobox__option .ds-combobox__option__icon-wrapper{width:var(--ds-size-7)}.ds-combobox__option__icon-wrapper.ds-combobox__option__icon-wrapper--selected{background-color:var(--ds-color-base-default);border-color:var(--ds-color-base-default)}.ds-combobox__option__icon-wrapper__icon{box-sizing:border-box;padding-top:.2em;transform:scale(1.4);stroke:var(--ds-color-neutral-text-default);color:var(--ds-color-neutral-text-default)}.ds-combobox__option__icon-wrapper .ds-combobox__option__icon-wrapper__icon{padding-top:0}.ds-combobox__option--active .ds-combobox__option__icon-wrapper__icon{stroke:var(--ds-color-text-default);color:var(--ds-color-text-default)}.ds-combobox__option__icon-wrapper.ds-combobox__option__icon-wrapper--selected .ds-combobox__option__icon-wrapper__icon{color:#fff;stroke:#fff}.ds-combobox__option__description{color:var(--ds-color-neutral-text-subtle);display:flex;flex-direction:column;flex-wrap:wrap;font-weight:400;gap:var(--ds-size-1)}
|
package/dist/src/dialog.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ds-dialog{--dsc-dialog-backdrop-background:rgba(0,0,0,.5);--dsc-dialog-background:var(--ds-color-neutral-surface-default);--dsc-dialog-icon-spacing:var(--ds-size-3);--dsc-dialog-icon-url:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M6.53 5.47a.75.75 0 0 0-1.06 1.06L10.94 12l-5.47 5.47a.75.75 0 1 0 1.06 1.06L12 13.06l5.47 5.47a.75.75 0 1 0 1.06-1.06L13.06 12l5.47-5.47a.75.75 0 0 0-1.06-1.06L12 10.94z'/%3E%3C/svg%3E");--dsc-dialog-color:var(--ds-color-neutral-text-default);--dsc-dialog-divider-border-width:var(--ds-border-width-default);--dsc-dialog-divider-border-style:solid;--dsc-dialog-divider-border-color:var(--ds-color-neutral-border-subtle);--dsc-dialog-border-width:var(--ds-border-width-default);--dsc-dialog-border-style:solid;--dsc-dialog-border-color:var(--ds-color-neutral-border-subtle);--dsc-dialog-max-height:80vh;--dsc-dialog-max-width:40rem;--dsc-dialog-spacing:var(--ds-size-6);--dsc-dialog-placement-inline-max-width:40rem;--dsc-dialog-placement-block-max-width:100%;--dsc-dialog-transition-duration:300ms;--_dsc-dialog-icon-top-right-margin:calc(var(--dsc-dialog-spacing)*-1 + var(--dsc-dialog-icon-spacing));background:var(--dsc-dialog-background);border-color:var(--dsc-dialog-border-color);border-radius:clamp(0px,((100vw - 4px) - 100%) * 100000,var(--ds-border-radius-lg));border-style:var(--dsc-dialog-border-style);border-width:var(--dsc-dialog-border-width);box-shadow:var(--ds-shadow-xl);box-sizing:border-box;color:var(--dsc-dialog-color);inset:0;margin:auto;max-height:var(--dsc-dialog-max-height);max-width:var(--dsc-dialog-max-width);overflow:auto;overscroll-behavior:contain;padding:var(--dsc-dialog-spacing);position:fixed;width:100%}.ds-dialog::backdrop{animation:ds-dialog-fade-in var(--dsc-dialog-transition-duration) ease-in-out;background:var(--dsc-dialog-backdrop-background,rgba(0,0,0,.5));overflow:hidden;overscroll-behavior:contain}.ds-dialog:where([data-placement=bottom],[data-placement=top]){margin-inline:auto;max-width:var(--dsc-dialog-placement-block-max-width);width:100%}.ds-dialog:where([data-placement=left],[data-placement=right]){border-block-width:0;border-radius:0;height:100%;height:-webkit-fill-available;height:-moz-available;height:stretch;max-height:unset;max-width:var(--dsc-dialog-placement-inline-max-width)}.ds-dialog[data-placement=bottom]{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom-width:0;top:auto}.ds-dialog[data-placement=top]{border-top-left-radius:0;border-top-right-radius:0;border-top-width:0;bottom:auto}.ds-dialog[data-placement=left]{border-left-width:0;right:auto}.ds-dialog[data-placement=right]{border-right-width:0;left:auto}.ds-dialog[open]{animation:ds-dialog-slide-up var(--dsc-dialog-transition-duration) ease-in-out,ds-dialog-fade-in var(--dsc-dialog-transition-duration) ease-in-out}.ds-dialog[open][data-placement=bottom]{animation:ds-dialog-slide-up var(--dsc-dialog-transition-duration) ease}.ds-dialog[open][data-placement=top]{animation:ds-dialog-slide-down var(--dsc-dialog-transition-duration) ease}.ds-dialog[open][data-placement=left]{animation:ds-dialog-slide-left var(--dsc-dialog-transition-duration) ease}.ds-dialog[open][data-placement=right]{animation:ds-dialog-slide-right var(--dsc-dialog-transition-duration) ease}.ds-dialog:has(>.ds-dialog__block){--_dsc-dialog-icon-top-right-margin:var(--dsc-dialog-icon-spacing);padding:0}@media (prefers-reduced-motion:reduce){.ds-dialog::backdrop,.ds-dialog[open]{animation:none}}.ds-dialog button[command=close]:empty:before,.ds-dialog button[data-command=close]:empty:before{background:currentcolor;content:"";height:var(--ds-size-6);-webkit-mask:center/contain no-repeat var(--dsc-dialog-icon-url);mask:center/contain no-repeat var(--dsc-dialog-icon-url);width:var(--ds-size-6)}@media (forced-colors:active){.ds-dialog button[command=close]:empty:before,.ds-dialog button[data-command=close]:empty:before{background:ButtonText}}.ds-dialog>button[command=close]:first-child,.ds-dialog>button[data-command=close]:first-child
|
|
1
|
+
.ds-dialog{--dsc-dialog-backdrop-background:rgba(0,0,0,.5);--dsc-dialog-background:var(--ds-color-neutral-surface-default);--dsc-dialog-icon-spacing:var(--ds-size-3);--dsc-dialog-icon-url:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M6.53 5.47a.75.75 0 0 0-1.06 1.06L10.94 12l-5.47 5.47a.75.75 0 1 0 1.06 1.06L12 13.06l5.47 5.47a.75.75 0 1 0 1.06-1.06L13.06 12l5.47-5.47a.75.75 0 0 0-1.06-1.06L12 10.94z'/%3E%3C/svg%3E");--dsc-dialog-color:var(--ds-color-neutral-text-default);--dsc-dialog-divider-border-width:var(--ds-border-width-default);--dsc-dialog-divider-border-style:solid;--dsc-dialog-divider-border-color:var(--ds-color-neutral-border-subtle);--dsc-dialog-border-width:var(--ds-border-width-default);--dsc-dialog-border-style:solid;--dsc-dialog-border-color:var(--ds-color-neutral-border-subtle);--dsc-dialog-max-height:80vh;--dsc-dialog-max-width:40rem;--dsc-dialog-spacing:var(--ds-size-6);--dsc-dialog-placement-inline-max-width:40rem;--dsc-dialog-placement-block-max-width:100%;--dsc-dialog-transition-duration:300ms;--_dsc-dialog-icon-top-right-margin:calc(var(--dsc-dialog-spacing)*-1 + var(--dsc-dialog-icon-spacing));background:var(--dsc-dialog-background);border-color:var(--dsc-dialog-border-color);border-radius:clamp(0px,((100vw - 4px) - 100%) * 100000,var(--ds-border-radius-lg));border-style:var(--dsc-dialog-border-style);border-width:var(--dsc-dialog-border-width);box-shadow:var(--ds-shadow-xl);box-sizing:border-box;color:var(--dsc-dialog-color);inset:0;margin:auto;max-height:var(--dsc-dialog-max-height);max-width:var(--dsc-dialog-max-width);overflow:auto;overscroll-behavior:contain;padding:var(--dsc-dialog-spacing);position:fixed;width:100%}.ds-dialog::backdrop{animation:ds-dialog-fade-in var(--dsc-dialog-transition-duration) ease-in-out;background:var(--dsc-dialog-backdrop-background,rgba(0,0,0,.5));overflow:hidden;overscroll-behavior:contain}.ds-dialog:where([data-placement=bottom],[data-placement=top]){margin-inline:auto;max-width:var(--dsc-dialog-placement-block-max-width);width:100%}.ds-dialog:where([data-placement=left],[data-placement=right]){border-block-width:0;border-radius:0;height:100%;height:-webkit-fill-available;height:-moz-available;height:stretch;max-height:unset;max-width:var(--dsc-dialog-placement-inline-max-width)}.ds-dialog[data-placement=bottom]{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom-width:0;top:auto}.ds-dialog[data-placement=top]{border-top-left-radius:0;border-top-right-radius:0;border-top-width:0;bottom:auto}.ds-dialog[data-placement=left]{border-left-width:0;right:auto}.ds-dialog[data-placement=right]{border-right-width:0;left:auto}.ds-dialog[open]{animation:ds-dialog-slide-up var(--dsc-dialog-transition-duration) ease-in-out,ds-dialog-fade-in var(--dsc-dialog-transition-duration) ease-in-out}.ds-dialog[open][data-placement=bottom]{animation:ds-dialog-slide-up var(--dsc-dialog-transition-duration) ease}.ds-dialog[open][data-placement=top]{animation:ds-dialog-slide-down var(--dsc-dialog-transition-duration) ease}.ds-dialog[open][data-placement=left]{animation:ds-dialog-slide-left var(--dsc-dialog-transition-duration) ease}.ds-dialog[open][data-placement=right]{animation:ds-dialog-slide-right var(--dsc-dialog-transition-duration) ease}.ds-dialog:has(>.ds-dialog__block){--_dsc-dialog-icon-top-right-margin:var(--dsc-dialog-icon-spacing);padding:0}@media (prefers-reduced-motion:reduce){.ds-dialog::backdrop,.ds-dialog[open]{animation:none}}.ds-dialog button[command=close]:empty:before,.ds-dialog button[data-command=close]:empty:before{background:currentcolor;content:"";height:var(--ds-size-6);-webkit-mask:center/contain no-repeat var(--dsc-dialog-icon-url);mask:center/contain no-repeat var(--dsc-dialog-icon-url);width:var(--ds-size-6)}@media (forced-colors:active){.ds-dialog button[command=close]:empty:before,.ds-dialog button[data-command=close]:empty:before{background:ButtonText}}.ds-dialog>button[command=close]:first-child,.ds-dialog>button[data-command=close]:first-child{color:inherit;float:inline-end;margin-block-end:var(--dsc-dialog-icon-spacing);margin-block-start:var(--_dsc-dialog-icon-top-right-margin);margin-inline-end:var(--_dsc-dialog-icon-top-right-margin);margin-inline-start:var(--dsc-dialog-icon-spacing)}.ds-dialog>form[method=dialog]:first-child>button:only-child{color:inherit;float:inline-end;margin-block-end:var(--dsc-dialog-icon-spacing);margin-block-start:var(--_dsc-dialog-icon-top-right-margin);margin-inline-end:var(--_dsc-dialog-icon-top-right-margin);margin-inline-start:var(--dsc-dialog-icon-spacing)}:is(.ds-dialog>form[method=dialog]:first-child>button:only-child):before{background:currentcolor;content:"";height:var(--ds-size-6);-webkit-mask:center/contain no-repeat var(--dsc-dialog-icon-url);mask:center/contain no-repeat var(--dsc-dialog-icon-url);width:var(--ds-size-6)}@media (forced-colors:active){:is(.ds-dialog>form[method=dialog]:first-child>button:only-child):before{background:ButtonText}}.ds-dialog__block{padding:var(--dsc-dialog-spacing)}.ds-dialog__block+.ds-dialog__block{border-top:var(--dsc-dialog-divider-border-width) var(--dsc-dialog-divider-border-style) var(--dsc-dialog-divider-border-color)}body:has(.ds-dialog:modal){overflow:hidden}@keyframes ds-dialog-fade-in{0%{opacity:0}}@keyframes ds-dialog-slide-up{0%{opacity:0;translate:0 3rem}}@keyframes ds-dialog-slide-down{0%{opacity:0;translate:0 -3rem}}@keyframes ds-dialog-slide-left{0%{opacity:0;translate:-3rem 0}}@keyframes ds-dialog-slide-right{0%{opacity:0;translate:3rem 0}}
|