@digdir/designsystemet-css 0.9.1-alpha.3 → 0.10.0-alpha.1
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/accordion.css +17 -7
- package/alert.css +1 -1
- package/box.css +3 -3
- package/button.css +7 -51
- package/card.css +74 -44
- package/checkbox.css +24 -27
- package/chip.css +2 -2
- package/combobox.css +17 -4
- package/dist/accordion.css +1 -1
- package/dist/alert.css +1 -1
- package/dist/box.css +1 -1
- package/dist/button.css +1 -1
- package/dist/card.css +1 -1
- package/dist/checkbox.css +1 -1
- package/dist/chip.css +1 -1
- package/dist/combobox.css +1 -1
- package/dist/divider.css +1 -1
- package/dist/dropdownmenu.css +1 -1
- package/dist/error-message.css +1 -1
- package/dist/error-summary.css +1 -1
- package/dist/fieldset.css +1 -1
- package/dist/heading.css +1 -1
- package/dist/helptext.css +1 -1
- package/dist/index.css +1 -1
- package/dist/ingress.css +1 -1
- package/dist/label.css +1 -1
- package/dist/link.css +1 -1
- package/dist/list.css +1 -1
- package/dist/modal.css +1 -1
- package/dist/native-select.css +1 -1
- package/dist/pagination.css +1 -1
- package/dist/paragraph.css +1 -1
- package/dist/popover.css +1 -1
- package/dist/radio.css +1 -1
- package/dist/search.css +1 -1
- package/dist/skeleton.css +1 -1
- package/dist/skiplink.css +1 -1
- package/dist/spinner.css +1 -1
- package/dist/switch.css +1 -1
- package/dist/table.css +1 -1
- package/dist/tabs.css +1 -1
- package/dist/tag.css +1 -1
- package/dist/textarea.css +1 -1
- package/dist/textfield.css +1 -1
- package/dist/togglegroup.css +1 -1
- package/dist/tooltip.css +1 -1
- package/dist/utils.css +1 -1
- package/divider.css +1 -1
- package/dropdownmenu.css +1 -1
- package/error-message.css +1 -1
- package/error-summary.css +1 -1
- package/fieldset.css +3 -3
- package/heading.css +1 -1
- package/helptext.css +1 -1
- package/index.css +5 -5
- package/ingress.css +1 -1
- package/label.css +1 -1
- package/link.css +3 -3
- package/list.css +1 -1
- package/modal.css +1 -1
- package/native-select.css +4 -4
- package/package.json +2 -2
- package/pagination.css +1 -1
- package/paragraph.css +1 -1
- package/popover.css +1 -1
- package/radio.css +20 -24
- package/search.css +3 -3
- package/skeleton.css +1 -1
- package/skiplink.css +1 -1
- package/spinner.css +3 -3
- package/switch.css +19 -19
- package/table.css +1 -1
- package/tabs.css +7 -2
- package/tag.css +1 -1
- package/textarea.css +6 -6
- package/textfield.css +4 -4
- package/togglegroup.css +3 -2
- package/tooltip.css +3 -3
- package/utils.css +3 -3
package/dist/link.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.link{.fds-link{align-items:center;color:var(--ds-color-accent-text-subtle);cursor:pointer;display:inline-flex;gap:var(--ds-spacing-1);position:relative;text-decoration:underline;text-decoration-thickness:max(1px,.0625rem);text-underline-offset:max(5px,.25rem)}.fds-link:visited{color:var(--ds-global-purple-12);text-decoration:none}.fds-link:hover{color:var(--ds-color-accent-text-default);text-decoration-thickness:max(2px,.125rem,.12em)}.fds-link:focus-visible{background:var(--ds-color-neutral-surface-default);color:var(--ds-color-accent-text-default);outline:none}.fds-link:active{background:var(--ds-color-accent-surface-default);border-radius:var(--ds-border-radius-md);color:var(--ds-color-accent-text-default);outline:none}}
|
package/dist/list.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.list{.fds-list--sm{padding-left:var(--ds-spacing-4)}.fds-list--lg,.fds-list--md{padding-left:var(--ds-spacing-6)}.fds-list__item{margin-bottom:var(--ds-spacing-2)}.fds-list__item>.fds-list{margin-top:var(--ds-spacing-2)}}
|
package/dist/modal.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.modal{.fds-modal{border:none;border-radius:var(--ds-border-radius-md);box-shadow:var(--ds-shadow-xl);max-width:650px;padding:0;width:100%}.fds-modal::backdrop{animation:fade-in .3s ease-in-out;background-color:rgba(0,0,0,.5)}.fds-modal[open]{animation:slide-in .3s ease-in-out,fade-in .3s ease-in-out}.fds-modal>hr{border-color:var(--ds-color-neutral-border-subtle);margin:var(--ds-spacing-3) 0!important}.fds-modal--lock-scroll{overflow:hidden}@media (max-width:650px){.fds-modal{border-radius:0;max-width:100%;min-width:100%}}@media (prefers-reduced-motion:reduce){.fds-modal[open]{animation:none}.fds-modal::backdrop{animation:none}}@keyframes slide-in{0%{transform:translateY(50px)}to{transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.fds-modal__header{color:var(--ds-color-neutral-text-default);display:flex;flex-direction:column;gap:var(--ds-spacing-1);justify-content:space-between;padding:var(--ds-spacing-6) var(--ds-spacing-18) var(--ds-spacing-2) var(--ds-spacing-6)}.fds-modal__header--no-button{padding-right:var(--ds-spacing-6)}.fds-modal__header__button{position:absolute;right:var(--ds-spacing-3);top:var(--ds-spacing-3)}.fds-modal__footer{align-items:center;display:flex;gap:var(--ds-spacing-4);padding:var(--ds-spacing-3) var(--ds-spacing-6) var(--ds-spacing-6)}.fds-modal__content{max-height:80vh;overflow-y:auto;padding:var(--ds-spacing-2) var(--ds-spacing-6)}}
|
package/dist/native-select.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.nativeselect{.fds-native-select__wrapper{display:grid;flex:0 1 auto;position:relative}.fds-native-select__wrapper:after{background-color:var(--ds-color-neutral-text-default);content:"";height:1.5em;-webkit-mask-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS45NyA5LjQ3YS43NS43NSAwIDAgMSAxLjA2IDBMMTIgMTQuNDRsNC45Ny00Ljk3YS43NS43NSAwIDEgMSAxLjA2IDEuMDZsLTUuNSA1LjVhLjc1Ljc1IDAgMCAxLTEuMDYgMGwtNS41LTUuNWEuNzUuNzUgMCAwIDEgMC0xLjA2IiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=");mask-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS45NyA5LjQ3YS43NS43NSAwIDAgMSAxLjA2IDBMMTIgMTQuNDRsNC45Ny00Ljk3YS43NS43NSAwIDEgMSAxLjA2IDEuMDZsLTUuNSA1LjVhLjc1Ljc1IDAgMCAxLTEuMDYgMGwtNS41LTUuNWEuNzUuNzUgMCAwIDEgMC0xLjA2IiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=");-webkit-mask-size:contain;mask-size:contain;pointer-events:none;position:absolute;right:var(--ds-spacing-2);top:50%;transform:translateY(-50%);width:1.5em}.fds-native-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--ds-color-neutral-background-default);border:1px solid var(--ds-color-neutral-border-default);border-radius:var(--ds-border-radius-md);box-sizing:border-box;color:var(--ds-color-neutral-text-default);font:inherit;font-family:inherit;padding:0 var(--ds-spacing-2);position:relative}@media (hover:hover) and (pointer:fine){.fds-native-select:not(:focus-visible,:disabled,[aria-disabled]):hover{border-color:var(--ds-color-accent-border-strong);box-shadow:inset 0 0 0 1px var(--ds-color-accent-border-strong)}}.fds-native-select.fds-native-select--multiple{background-image:none}.fds-native-select--sm{height:var(--ds-sizing-10);padding:0 var(--ds-spacing-2);padding-right:var(--ds-spacing-8)}.fds-native-select--md{height:var(--ds-sizing-12);padding:0 var(--ds-spacing-3);padding-right:var(--ds-spacing-10)}.fds-native-select--lg{height:var(--ds-sizing-14);padding:0 var(--ds-spacing-4);padding-right:var(--ds-spacing-12)}.fds-native-select--container{display:grid;gap:var(--ds-spacing-2)}.fds-native-select--container:has(.fds-native-select:disabled){opacity:var(--ds-disabled-opacity)}.fds-native-select:disabled{cursor:not-allowed}.fds-native-select--readonly .fds-native-select{background:var(--ds-color-neutral-background-subtle);border-color:var(--ds-color-neutral-border-strong)}.fds-native-select--error>.fds-native-select:not(:focus-visible){border-color:var(--ds-color-danger-border-default);box-shadow:inset 0 0 0 1px var(--ds-color-danger-border-default)}.fds-native-select__readonly__icon{height:1.2em;width:1.2em}.fds-native-select__error-message:empty{display:none}.fds-native-select__label{align-items:center;display:inline-flex;flex-direction:row;gap:var(--ds-spacing-1);min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}.fds-native-select__description{color:var(--ds-color-neutral-text-subtle);margin-top:calc(var(--ds-spacing-2)*-1)}}
|
package/dist/pagination.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.pagination{.fds-pagination{--dsc-pagination-listitem-margin:var(--ds-spacing-4);--dsc-pagination-ellipsis-width:var(--ds-sizing-12);--dsc-pagination-chevron-margin:var(--ds-spacing-2);display:flex;list-style-type:none;margin:0;padding:0;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.fds-pagination--hidden{visibility:hidden}.fds-pagination--lg,.fds-pagination--md,.fds-pagination--sm{--dsc-pagination-chevron-margin:var(--ds-spacing-2)}.fds-pagination li:first-child{margin-right:var(--dsc-pagination-chevron-margin)}.fds-pagination li:last-child{margin-left:var(--dsc-pagination-chevron-margin)}.fds-pagination__item{flex:1;margin-right:var(--dsc-pagination-listitem-margin)}.fds-pagination--sm .fds-pagination__item{--dsc-pagination-listitem-margin:var(--ds-spacing-2);--dsc-pagination-ellipsis-width:var(--ds-sizing-10)}.fds-pagination--md .fds-pagination__item{--dsc-pagination-listitem-margin:var(--ds-spacing-4);--dsc-pagination-ellipsis-width:var(--ds-sizing-12)}.fds-pagination--lg .fds-pagination__item{--dsc-pagination-listitem-margin:var(--ds-spacing-6);--dsc-pagination-ellipsis-width:var(--ds-sizing-14)}.fds-pagination__item.fds-pagination--compact{--dsc-pagination-listitem-margin:var(--ds-spacing-0);--dsc-pagination-chevron-margin:var(--ds-spacing-1)}.fds-pagination__ellipsis{margin-top:.5em;text-align:center;width:var(--dsc-pagination-ellipsis-width)}}
|
package/dist/paragraph.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.typography.paragraph{.fds-paragraph{--dsc-bottom-spacing:var(--ds-spacing-5);color:var(--ds-color-neutral-text-default);margin:0}.fds-paragraph--spacing{margin-bottom:var(--dsc-bottom-spacing)}.fds-paragraph--lg{--dsc-bottom-spacing:var(--ds-spacing-6);font:var(--ds-typography-paragraph-lg);font-family:inherit}.fds-paragraph--lg.fds-paragraph--short{font:var(--ds-typography-paragraph-short-lg);font-family:inherit}.fds-paragraph--lg.fds-paragraph--long{line-height:var(--ds-typography-paragraph-long-lg)}.fds-paragraph--md{--dsc-bottom-spacing:var(--ds-spacing-5);font:var(--ds-typography-paragraph-md);font-family:inherit}.fds-paragraph--md.fds-paragraph--short{--dsc-bottom-spacing:var(--ds-spacing-5);font:var(--ds-typography-paragraph-short-md);font-family:inherit}.fds-paragraph--md.fds-paragraph--long{line-height:var(--ds-typography-paragraph-long-md)}.fds-paragraph--sm{--dsc-bottom-spacing:var(--ds-spacing-4);font:var(--ds-typography-paragraph-sm);font-family:inherit}.fds-paragraph--sm.fds-paragraph--short{--dsc-bottom-spacing:var(--ds-spacing-4);font:var(--ds-typography-paragraph-short-sm);font-family:inherit}.fds-paragraph--sm.fds-paragraph--long{line-height:var(--ds-typography-paragraph-long-sm)}.fds-paragraph--xs{--dsc-bottom-spacing:var(--ds-spacing-3);font:var(--ds-typography-paragraph-xs);font-family:inherit}.fds-paragraph--xs.fds-paragraph--short{--dsc-bottom-spacing:var(--ds-spacing-3);font:var(--ds-typography-paragraph-short-xs);font-family:inherit}.fds-paragraph--xs.fds-paragraph--long{line-height:var(--ds-typography-paragraph-long-xs)}}
|
package/dist/popover.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.fds-popover{.fds-popover{--dsc-popover-border:1px solid;--dsc-popover-background:var(--ds-color-neutral-background-default);background:var(--dsc-popover-background);border:var(--dsc-popover-border);border-radius:var(--ds-border-radius-md);max-width:300px;padding:var(--ds-spacing-3);z-index:1500}.fds-popover--sm{padding:var(--ds-spacing-2) var(--ds-spacing-3)}.fds-popover--md{padding:var(--ds-spacing-3) var(--ds-spacing-4)}.fds-popover--lg{padding:var(--ds-spacing-3) var(--ds-spacing-5)}.fds-popover--default{--dsc-popover-background:var(--ds-color-neutral-background-default);border-color:var(--ds-color-neutral-border-default)}.fds-popover--info{--dsc-popover-background:var(--ds-color-info-surface-default);border-color:var(--ds-color-info-border-default);color:var(--ds-color-info-text-default)}.fds-popover--warning{--dsc-popover-background:var(--ds-color-warning-surface-default);border-color:var(--ds-color-warning-border-default);color:var(--ds-color-warning-text-default)}.fds-popover--danger{--dsc-popover-background:var(--ds-color-danger-surface-default);border-color:var(--ds-color-danger-border-default);color:var(--ds-color-danger-text-default)}.fds-popover__arrow{background:var(--dsc-popover-background);position:absolute;transform:rotate(45deg)}.fds-popover__arrow.fds-popover__arrow--top{border-left:var(--dsc-popover-border);border-top:var(--dsc-popover-border);border-color:inherit}.fds-popover__arrow.fds-popover__arrow--bottom{border-bottom:var(--dsc-popover-border);border-right:var(--dsc-popover-border);border-color:inherit}.fds-popover__arrow.fds-popover__arrow--right{border-right:var(--dsc-popover-border);border-top:var(--dsc-popover-border);border-color:inherit}.fds-popover__arrow.fds-popover__arrow--left{border-bottom:var(--dsc-popover-border);border-left:var(--dsc-popover-border);border-color:inherit}}
|
package/dist/radio.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.radio{.fds-radio{--dsc-radio-size:var(--ds-spacing-5);--dsc-radio-focus-border-width:3px;--dsc-radio-background:var(--ds-color-neutral-background-default);--dsc-radio-border-color:var(--ds-color-neutral-border-strong);--dsc-radio-border__hover--size:calc(var(--ds-spacing-3)/2);--dsc-radio-border__hover:0 0 0 var(--dsc-radio-border__hover--size) var(--ds-color-accent-surface-hover);display:grid}.fds-radio:has(.fds-radio__label){gap:var(--ds-spacing-2);grid-template-columns:var(--dsc-radio-size) auto}.fds-radio__input{align-self:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--dsc-radio-background);border-radius:50%;box-shadow:inset 0 0 0 2px var(--dsc-radio-border-color);cursor:pointer;height:var(--dsc-radio-size);margin:0;outline:none;position:relative;width:var(--dsc-radio-size);z-index:1}.fds-radio__input:before{border-radius:var(--ds-border-radius-md);content:"";cursor:pointer;display:block;height:2.75rem;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:2.75rem}.fds-radio__label{align-items:center;cursor:pointer;display:inline-flex;flex-direction:row;gap:var(--ds-spacing-1);min-height:var(--ds-sizing-10);min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}.fds-radio__description{color:var(--ds-color-neutral-text-subtle);grid-column:2;margin-top:calc(var(--ds-spacing-3)*-1)}.fds-radio--readonly>.fds-radio__input,.fds-radio--readonly>.fds-radio__input:before,.fds-radio--readonly>.fds-radio__label{cursor:default}.fds-radio:has(.fds-radio__input:disabled)>.fds-radio__description{opacity:var(--ds-disabled-opacity)}.fds-radio:has(.fds-radio__input:disabled)>.fds-radio__label,.fds-radio__input:disabled,.fds-radio__input:disabled:before{cursor:not-allowed;opacity:var(--fds-opacity-disabled)}.fds-radio__input:focus-visible{box-shadow:inset 0 0 0 2px var(--dsc-radio-border-color),inset 0 0 0 var(--dsc-radio-focus-border-width) var(--ds-focus-inner),inset 0 0 0 6px var(--dsc-radio-background);outline:var(--dsc-radio-focus-border-width) solid var(--ds-focus-outer);outline-offset:var(--ds-spacing-1)}.fds-radio__input:checked{--dsc-radio-border-color:var(--ds-color-accent-base-default);background:var(--dsc-radio-border-color)}.fds-radio--readonly>.fds-radio__input{--dsc-radio-border-color:var(--ds-color-neutral-border-subtle);--dsc-radio-background:var(--ds-color-neutral-background-subtle)}.fds-radio__input:checked:not(:focus-visible){box-shadow:inset 0 0 0 2px var(--dsc-radio-border-color),inset 0 0 0 6px var(--dsc-radio-background)}.fds-radio--readonly>.fds-radio__input:checked{background:var(--ds-color-neutral-border-strong)}.fds-radio--error>.fds-radio__input:not(:disabled,:focus-visible){--dsc-radio-border-color:var(--ds-color-danger-border-default)}@media (hover:hover) and (pointer:fine){.fds-radio:not(.fds-radio--readonly)>.fds-radio__input:hover:not(:disabled)+.fds-radio__label,.fds-radio:not(.fds-radio--readonly)>.fds-radio__label:hover:not(:disabled){color:var(--ds-color-accent-text-subtle)}.fds-radio:not(.fds-radio--readonly)>.fds-radio__input:hover:not(:checked,:disabled){--dsc-radio-border-color:var(--ds-color-accent-border-strong);box-shadow:var(--dsc-radio-border__hover),inset 0 0 0 2px var(--dsc-radio-border-color)}.fds-radio:not(.fds-radio--readonly)>.fds-radio__input:hover:checked:not(:disabled){box-shadow:var(--dsc-radio-border__hover),inset 0 0 0 2px var(--dsc-radio-border-color),inset 0 0 0 6px var(--dsc-radio-background)}}.fds-radio--sm{--dsc-radio-size:var(--ds-sizing-5);min-height:var(--ds-sizing-10)}.fds-radio--md{--dsc-radio-size:var(--ds-sizing-6);--dsc-radio-border__hover--size:var(--ds-spacing-1);min-height:var(--ds-sizing-11)}.fds-radio--lg{--dsc-radio-size:var(--ds-sizing-7);min-height:var(--ds-sizing-12)}.fds-radio-group--horizontal{display:flex;flex-direction:row;gap:var(--ds-spacing-6)}}
|
package/dist/search.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.search{.fds-search{display:inline-grid;gap:var(--ds-spacing-2);width:100%}.fds-search--sm{--dsc-search-button-clear-size:var(--ds-sizing-5)}.fds-search--md{--dsc-search-button-clear-size:var(--ds-sizing-6)}.fds-search--lg{--dsc-search-button-clear-size:var(--ds-sizing-8)}.fds-search__error:empty{display:none}.fds-search__label{align-items:center;display:inline-flex;flex-direction:row;gap:var(--ds-spacing-1);min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}.fds-search__field{align-items:stretch;border-radius:var(--ds-border-radius-md);display:flex;position:relative;width:100%}.fds-search__icon{height:100%;left:var(--ds-spacing-4);pointer-events:none;position:absolute;transform:scale(1.5);z-index:2}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}.fds-search__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--ds-color-neutral-background-default);border:1px solid var(--ds-color-neutral-border-default);border-radius:var(--ds-border-radius-md);box-sizing:border-box;color:var(--ds-color-neutral-text-default);flex:0 1 auto;font:inherit;font-family:inherit;height:var(--ds-sizing-10);padding:0 var(--ds-spacing-3);position:relative;width:100%}.fds-search__input.fds-search__input--with-search-button{border-bottom-right-radius:0;border-top-right-radius:0}.fds-search__input:disabled{cursor:not-allowed}.fds-search__input[type=search]:focus-visible{z-index:1}.fds-search:has(.fds-search__input:disabled){opacity:var(--ds-disabled-opacity)}.fds-search__search-button{border-bottom-left-radius:0;border-top-left-radius:0}.fds-search__search-button:not(:focus-visible){border-left:0}.fds-search__search-button:focus-visible{z-index:1}.fds-search__clear-button{align-items:center;background:none;border:none;border-radius:var(--ds-border-radius-md);color:var(--ds-color-neutral-text-default);cursor:pointer;display:inline-flex;font-size:1.25rem;height:var(--dsc-search-button-clear-size);justify-content:center;padding:0;position:absolute;right:.6em;top:50%;transform:translateY(-50%);width:var(--dsc-search-button-clear-size);z-index:2}.fds-search--sm .fds-search__input{--dsc-search-button-clear-size:var(--ds-sizing-4);height:var(--ds-sizing-10);padding:0 var(--ds-spacing-3);padding-right:2.5em}.fds-search--sm .fds-search__icon{left:var(--ds-spacing-3)}.fds-search--md .fds-search__input{--dsc-search-button-clear-size:var(--ds-sizing-6);height:var(--ds-sizing-12);padding:0 var(--ds-spacing-4);padding-right:2.2em}.fds-search--md .fds-search__icon{left:var(--ds-spacing-4)}.fds-search--lg .fds-search__input{--dsc-search-button-clear-size:var(--ds-sizing-12);height:var(--ds-sizing-14);padding:0 var(--ds-spacing-5);padding-right:2em}.fds-search--lg .fds-search__icon{left:var(--ds-spacing-5)}.fds-search__input.fds-search__input--simple{padding-left:2.4em}.fds-search__error-message>.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){.fds-search__input:not(:focus-visible,:disabled,[aria-disabled]):hover{border-color:var(--ds-color-accent-border-strong);box-shadow:inset 0 0 0 1px var(--ds-color-accent-border-strong)}.fds-search__clear-button:not(:focus-visible,:disabled,[aria-disabled]):hover{background:var(--ds-color-accent-surface-hover)}}}
|
package/dist/skeleton.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.skeleton{.fds-skeleton{--dsc-skeleton-animation-duration:0.8s;animation:fds-skeleton-opacity-fade var(--dsc-skeleton-animation-duration) linear infinite alternate;background-color:var(--ds-color-neutral-surface-default);height:1.3em;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.fds-skeleton--circle{border-radius:50%;width:1.3em}.fds-skeleton--rectangle{border-radius:.2em;width:100%}.fds-skeleton--text{border-radius:.55em;height:auto;transform:scaleY(.6);transform-origin:0 55%;width:100%}.fds-skeleton--text:empty:before{content:"\00a0"}.fds-skeleton--has-children{color:transparent!important;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.fds-skeleton--has-children>*{visibility:hidden}@media (prefers-reduced-motion:reduce){.fds-skeleton{--dsc-skeleton-animation-duration:1.6s}}@keyframes fds-skeleton-opacity-fade{0%{opacity:1}to{opacity:.4}}}
|
package/dist/skiplink.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.skiplink{.fds-skiplink:focus{display:block;height:auto;margin:inherit;outline:0;overflow:visible;position:static;width:auto;clip:auto;background:var(--ds-color-neutral-backround-default);-webkit-clip-path:none;clip-path:none;color:var(--ds-color-neutral-text-default);padding:var(--ds-spacing-3) var(--ds-spacing-4) var(--ds-spacing-3) var(--ds-spacing-6);text-decoration:none;white-space:inherit}.fds-skiplink__content{--dsc-skiplink-padding:var(--ds-spacing-2) var(--ds-spacing-4);--dsc-skiplink-border-width:3px;align-items:center;background-color:initial;border:var(--ds-border-width-default) solid transparent;border-color:var(--ds-color-accent-base-hover);border-radius:var(--ds-border-radius-md);box-shadow:0 0 0 var(--dsc-skiplink-border-width) var(--ds-color-neutral-background-default);box-sizing:border-box;color:var(--ds-color-accent-base-hover);cursor:pointer;display:flex;font-family:inherit;justify-content:center;min-height:var(--ds-sizing-10);outline:var(--dsc-skiplink-border-width) solid var(--ds-color-neutral-text-default);outline-offset:var(--dsc-skiplink-border-width);padding:var(--dsc-skiplink-padding);position:relative;text-align:center;text-decoration:none;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}}
|
package/dist/spinner.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.spinner{.fds-spinner{animation:fds-spinner-rotate-animation linear infinite;animation-duration:2s}.fds-spinner__circle{stroke-dasharray:1px,200px;animation:fds-spinner-stroke-animation ease-in-out infinite;animation-duration:2s;transform-origin:center}@media (prefers-reduced-motion:reduce){.fds-spinner,.fds-spinner__circle{animation-duration:6s}}.fds-spinner--neutral .fds-spinner__circle{stroke:var(--ds-color-neutral-border-default)}.fds-spinner--accent .fds-spinner__circle{stroke:var(--ds-color-accent-base-default)}.fds-spinner__background{stroke:var(--ds-color-neutral-surface-default)}@keyframes fds-spinner-rotate-animation{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes fds-spinner-stroke-animation{0%{stroke-dasharray:1px,200px;stroke-dashoffset:0}50%{stroke-dasharray:100px,200px;stroke-dashoffset:-15px;transform:rotate(0deg)}to{stroke-dasharray:1px,200px;stroke-dashoffset:-120px;transform:rotate(15deg)}}}
|
package/dist/switch.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.switch{.fds-switch{--dsc-switch--transition:200ms;--dsc-switch-height:1.75rem;--dsc-switch-focus-border-width:3px;--dsc-switch-check_color:transparent;--dsc-switch-thumb-background-color:var(--ds-color-neutral-background-default);position:relative}@media (prefers-reduced-motion){.switch{--dsc-switch--transition:0}}.fds-switch__label{align-items:center;cursor:pointer;display:grid;gap:var(--ds-spacing-1);grid-template-columns:auto 1fr;min-height:var(--ds-sizing-10);min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}.fds-switch__track{background-color:var(--ds-color-neutral-border-default);border-radius:var(--ds-border-radius-full);display:inline-block;height:var(--dsc-switch-height);margin:auto;margin-right:var(--ds-spacing-1);overflow:visible;pointer-events:none;position:relative;transition:background-color var(--dsc-switch--transition) ease;width:var(--dsc-switch-width)}.fds-switch__description{color:var(--ds-color-neutral-text-subtle);margin-top:var(--ds-spacing-1);padding-left:calc(var(--dsc-switch-width) + var(--ds-spacing-2));width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.fds-switch__readonly__icon{height:1.2em;width:1.2em}.fds-switch__label--right{grid-auto-flow:dense;grid-template-columns:1fr auto}.fds-switch__label--right .fds-switch__track{margin-right:0;order:1}.fds-switch__label--right+.fds-switch__description{padding-left:0}.fds-switch__input{cursor:pointer;height:2.75rem;margin:0;opacity:0;position:absolute;width:2.75rem;z-index:1}.fds-switch--readonly>.fds-switch__label{grid-template-columns:auto -webkit-min-content 1fr;grid-template-columns:auto min-content 1fr}.fds-switch--readonly>.fds-switch__label:where(.fds-switch__label--right){grid-template-columns:-webkit-min-content 1fr auto;grid-template-columns:min-content 1fr auto}.fds-switch--readonly>.fds-switch__input,.fds-switch--readonly>.fds-switch__label{cursor:default}.fds-switch--readonly>.fds-switch__description{margin-left:var(--ds-spacing-1)}.fds-switch--sm,.fds-switch--sm .fds-switch__label{min-height:var(--ds-sizing-6)}.fds-switch--md,.fds-switch--md .fds-switch__label{min-height:var(--ds-sizing-7)}.fds-switch--lg,.fds-switch--lg .fds-switch__label{min-height:var(--ds-sizing-8)}.fds-switch--sm{--dsc-switch-height:var(--ds-sizing-6);--dsc-switch-width:var(--ds-sizing-11)}.fds-switch--sm .fds-switch__input{left:-.25rem;top:-.25rem}.fds-switch--md{--dsc-switch-height:var(--ds-sizing-7);--dsc-switch-width:var(--ds-sizing-13)}.fds-switch--md .fds-switch__input{left:0;top:0}.fds-switch--lg{--dsc-switch-height:var(--ds-sizing-8);--dsc-switch-width:var(--ds-sizing-15)}.fds-switch--lg .fds-switch__input{left:0;top:.25rem}.fds-switch__label:has(.fds-switch__track:only-child){grid-template-columns:auto}.fds-switch__label:has(.fds-switch__track:only-child) .fds-switch__track{margin-right:0}.fds-switch:has(.fds-switch__input:disabled)>.fds-switch__label,.fds-switch__input:disabled{cursor:not-allowed}.fds-switch:has(.fds-switch__input:disabled)>.fds-switch__description,.fds-switch:has(.fds-switch__input:disabled)>.fds-switch__label{opacity:var(--ds-disabled-opacity)}.fds-switch__input:focus-visible+.fds-switch__label .fds-switch__track{box-shadow:0 0 0 var(--dsc-switch-focus-border-width) var(--ds-focus-inner);outline:var(--dsc-switch-focus-border-width) solid var(--ds-focus-outer);outline-offset:var(--dsc-switch-focus-border-width)}.fds-switch__input:not([readonly]):checked+.fds-switch__label .fds-switch__track{background-color:var(--ds-color-accent-base-default)}.fds-switch__thumb{background-color:var(--dsc-switch-thumb-background-color);border-radius:var(--ds-border-radius-full);height:var(--dsc-switch-height);position:absolute;scale:.8;transition:transform var(--dsc-switch--transition) ease;width:var(--dsc-switch-height)}.fds-switch__input:checked+.fds-switch__label .fds-switch__track .fds-switch__thumb{--dsc-switch-check_color:var(--ds-color-accent-base-default);--dsc-switch-thumb-background-color:var(--ds-color-accent-contrast-default);transform:translateX(calc((var(--dsc-switch-width) - var(--dsc-switch-height))*1.2))}.fds-switch__thumb:after{background-color:var(--dsc-switch-check_color);content:"";height:100%;left:50%;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='-3 -3 17 17'%3E%3Cpath fill='%23118849' fill-rule='evenodd' d='M10.134 2.866a1.25 1.25 0 0 1 0 1.768l-4.25 4.25a1.25 1.25 0 0 1-1.768 0l-2.25-2.25a1.25 1.25 0 1 1 1.768-1.768L5 6.232l3.366-3.366a1.25 1.25 0 0 1 1.768 0' clip-rule='evenodd'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='-3 -3 17 17'%3E%3Cpath fill='%23118849' fill-rule='evenodd' d='M10.134 2.866a1.25 1.25 0 0 1 0 1.768l-4.25 4.25a1.25 1.25 0 0 1-1.768 0l-2.25-2.25a1.25 1.25 0 1 1 1.768-1.768L5 6.232l3.366-3.366a1.25 1.25 0 0 1 1.768 0' clip-rule='evenodd'/%3E%3C/svg%3E");position:absolute;top:50%;transform:translate(-50%,-50%);transition:background-color var(--dsc-switch--transition) ease;width:100%}.fds-switch--readonly .fds-switch__input[readonly]+.fds-switch__label .fds-switch__track{background-color:var(--ds-color-neutral-background-subtle);box-shadow:inset 0 0 0 2px var(--ds-color-neutral-border-subtle)}.fds-switch--readonly .fds-switch__input[readonly]+.fds-switch__label .fds-switch__track>.fds-switch__thumb{--dsc-switch-check_color:var(--ds-color-neutral-background-subtle);background-color:var(--ds-color-neutral-border-strong)}@media (hover:hover) and (pointer:fine){.fds-switch__input:not([readonly],:disabled):hover+.fds-switch__label .fds-switch__track>.fds-switch__thumb{transform:translateX(calc((var(--dsc-switch-width) - var(--dsc-switch-height))*.2))}.fds-switch__input:not([readonly],:disabled):hover+.fds-switch__label{color:var(--ds-color-accent-text-subtle)}.fds-switch__input:not(:disabled,[readonly]):checked:hover+.fds-switch__label .fds-switch__track>.fds-switch__thumb{--dsc-switch-check_color:var(--ds-color-accent-base-hover);transform:translateX(calc(var(--dsc-switch-width) - var(--dsc-switch-height)))}.fds-switch__input:not(:checked,:disabled,[readonly]):hover+.fds-switch__label .fds-switch__track{background-color:var(--ds-color-neutral-border-strong)}.fds-switch__input:not(:disabled,[readonly]):checked:hover+.fds-switch__label .fds-switch__track{background-color:var(--ds-color-accent-base-hover)}}}
|
package/dist/table.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.table{.fds-table{--dsc-table-padding:0;--dsc-table-border-radius:var(--ds-border-radius-md);border-collapse:initial;border-spacing:0;color:var(--ds-color-neutral-text-default);position:relative;text-align:left}.fds-table--sticky-header{overflow:auto}.fds-table--border .fds-table__row:last-of-type td{border-bottom:0}.fds-table--sm{--dsc-table-padding:var(--ds-spacing-1) var(--ds-spacing-3)}.fds-table--md{--dsc-table-padding:var(--ds-spacing-2) var(--ds-spacing-3)}.fds-table--lg{--dsc-table-padding:var(--ds-spacing-3) var(--ds-spacing-3)}.fds-table__head{box-sizing:border-box;font:inherit;font-family:inherit;font-weight:500;z-index:0}.fds-table__head,.fds-table__header__cell{border-bottom:2px solid var(--ds-color-neutral-border-subtle);border-spacing:0}.fds-table__header__cell{background-color:var(--ds-color-neutral-background-default);font:inherit;font-family:inherit;padding:var(--dsc-table-padding)}.fds-table--sticky-header .fds-table__head .fds-table__header__cell{position:-webkit-sticky;position:sticky;top:0;z-index:1}.fds-table__header__cell--sortable{padding:0}.fds-table__header__cell--sortable button{align-items:center;background-color:initial;border:none;color:var(--ds-color-neutral-text-default);cursor:pointer;display:flex;font:inherit;font-family:inherit;gap:var(--ds-spacing-1);padding:var(--dsc-table-padding);position:relative;width:100%;z-index:2}.fds-table__header__cell--sorted button{background-color:var(--ds-color-neutral-background-subtle)}.fds-table__header__cell--sortable button:focus-visible{box-shadow:unset;outline-offset:-3px;z-index:3}.fds-table__header__cell--sortable button svg{font-size:1.2em}.fds-table__cell{background-color:var(--ds-color-neutral-background-default);border-bottom:1px solid var(--ds-color-neutral-border-subtle);padding:var(--dsc-table-padding)}.fds-table--zebra .fds-table__row{border-bottom:0}.fds-table--zebra tr:nth-child(2n):not(:hover) .fds-table__cell{background-color:var(--ds-color-neutral-background-subtle)}.fds-table--border{border:1px solid var(--ds-color-neutral-border-default);border-radius:var(--dsc-table-border-radius)}.fds-table--border .fds-table__head .fds-table__header__cell:first-of-type{border-top-left-radius:var(--dsc-table-border-radius);overflow:hidden}.fds-table--border .fds-table__head .fds-table__header__cell:last-of-type{border-top-right-radius:var(--dsc-table-border-radius);overflow:hidden}.fds-table--border .fds-table__row:last-of-type .fds-table__cell:first-of-type{border-bottom-left-radius:var(--dsc-table-border-radius);overflow:hidden}.fds-table--border .fds-table__row:last-of-type .fds-table__cell:last-of-type{border-bottom-right-radius:var(--dsc-table-border-radius);overflow:hidden}@media (hover:hover) and (pointer:fine){.fds-table__header__cell--sortable button:hover,.fds-table__row:hover .fds-table__cell{background-color:var(--ds-color-neutral-surface-default)}}}
|
package/dist/tabs.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.tabs{.fds-tabs__tab{--dsc-tabs__tab-bottom-border-color:transparent;align-items:center;background-color:initial;border:none;border-radius:0;box-sizing:border-box;color:var(--ds-color-neutral-text-subtle);cursor:pointer;display:flex;flex-direction:row;gap:var(--ds-spacing-1);justify-content:center;padding:var(--ds-spacing-2) var(--ds-spacing-3);position:relative;text-align:center}.fds-tabs__content{padding:var(--ds-spacing-5)}.fds-tabs--sm .fds-tabs__content,.fds-tabs--sm .fds-tabs__tab{font:var(--ds-typography-paragraph-short-sm)}.fds-tabs--md .fds-tabs__content,.fds-tabs--md .fds-tabs__tab{font:var(--ds-typography-paragraph-short-md)}.fds-tabs--lg .fds-tabs__content,.fds-tabs--lg .fds-tabs__tab{font:var(--ds-typography-paragraph-short-lg)}.fds-tabs--sm .fds-tabs__tab{padding:var(--ds-spacing-2) var(--ds-spacing-4)}.fds-tabs--md .fds-tabs__tab{padding:var(--ds-spacing-3) var(--ds-spacing-5)}.fds-tabs--lg .fds-tabs__tab{padding:var(--ds-spacing-4) var(--ds-spacing-6)}.fds-tabs--sm .fds-tabs__content{padding:var(--ds-spacing-4)}.fds-tabs--md .fds-tabs__content{padding:var(--ds-spacing-5)}.fds-tabs--lg .fds-tabs__content{padding:var(--ds-spacing-6)}@media (hover:hover) and (pointer:fine){.fds-tabs__tab:hover:not([aria-selected=true]){--dsc-tabs__tab-bottom-border-color:var(--ds-color-neutral-border-subtle);color:var(--ds-color-neutral-text-default)}}.fds-tabs__tab[aria-selected=true]{--dsc-tabs__tab-bottom-border-color:var(--ds-color-accent-base-default);color:var(--ds-color-accent-text-subtle)}.fds-tabs__tab:focus{z-index:2}.fds-tabs__tab:after{background-color:var(--dsc-tabs__tab-bottom-border-color);border-radius:var(--ds-border-radius-full);bottom:0;content:"";display:block;height:3px;left:0;position:absolute;width:100%}.fds-tabs__tablist{border-bottom:var(--ds-border-width-default) solid var(--ds-color-neutral-border-subtle);display:flex;flex-direction:row;position:relative}}
|
package/dist/tag.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.tag{.fds-tag{--dsc-tag-background:var(--ds-color-neutral-background-subtle);--dsc-tag-color:var(--ds-color-neutral-text-default);align-items:center;background-color:var(--dsc-tag-background);border-radius:var(--ds-border-radius-sm);box-sizing:border-box;color:var(--dsc-tag-color);display:flex;min-height:var(--ds-sizing-8);width:-webkit-max-content;width:-moz-max-content;width:max-content;word-break:break-word}.fds-tag,.fds-tag--sm{padding:0 var(--ds-spacing-2)}.fds-tag--sm{min-height:var(--ds-sizing-7)}.fds-tag--md{min-height:var(--ds-sizing-8);padding:0 var(--ds-spacing-2)}.fds-tag--lg{min-height:var(--ds-sizing-9);padding:0 var(--ds-spacing-3)}.fds-tag--neutral{--dsc-tag-background:var(--ds-color-neutral-surface-default);--dsc-tag-color:var(--ds-color-neutral-text-default)}.fds-tag--info{--dsc-tag-background:var(--ds-color-info-surface-default);--dsc-tag-color:var(--ds-color-info-text-default)}.fds-tag--success{--dsc-tag-background:var(--ds-color-success-surface-default);--dsc-tag-color:var(--ds-color-success-text-default)}.fds-tag--warning{--dsc-tag-background:var(--ds-color-warning-surface-default);--dsc-tag-color:var(--ds-color-warning-text-default)}.fds-tag--danger{--dsc-tag-background:var(--ds-color-danger-surface-default);--dsc-tag-color:var(--ds-color-danger-text-default)}.fds-tag--brand1{--dsc-tag-background:var(--ds-color-brand1-surface-default);--dsc-tag-color:var(--ds-color-brand1-text-default)}.fds-tag--brand2{--dsc-tag-background:var(--ds-color-brand2-surface-default);--dsc-tag-color:var(--ds-color-brand2-text-default)}.fds-tag--brand3{--dsc-tag-background:var(--ds-color-brand3-surface-default);--dsc-tag-color:var(--ds-color-brand3-text-default)}}
|
package/dist/textarea.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.textarea{.fds-textarea{display:grid;gap:var(--ds-spacing-2)}.fds-textarea__readonly-icon{height:1.2em;width:1.2em}.fds-textarea__error-message:empty{display:none}.fds-textarea__label{align-items:center;display:inline-flex;flex-direction:row;gap:var(--ds-spacing-1);min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}.fds-textarea__description{color:var(--ds-color-neutral-text-subtle);margin-top:calc(var(--ds-spacing-2)*-1)}.fds-textarea__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--ds-color-neutral-border-default);border-radius:var(--ds-border-radius-md);box-sizing:border-box;flex:0 1 auto;font:inherit;font-family:inherit;min-height:2.5em;padding:var(--ds-spacing-3);position:relative;resize:vertical;width:100%}.fds-textarea--sm .fds-textarea__input{padding:var(--ds-spacing-2)}.fds-textarea--md .fds-textarea__input{padding:var(--ds-spacing-3)}.fds-textarea--lg .fds-textarea__input{padding:var(--ds-spacing-4)}.fds-textarea:has(.fds-textarea__input:disabled){opacity:var(--ds-disabled-opacity)}.fds-textarea__input:disabled{cursor:not-allowed}.fds-textarea__input:-moz-read-only{background:var(--ds-color-neutral-background-subtle);border-color:var(--ds-color-neutral-border-strong)}.fds-textarea__input:read-only{background:var(--ds-color-neutral-background-subtle);border-color:var(--ds-color-neutral-border-strong)}.fds-textarea--error>.fds-textarea__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){.fds-textarea__input:not(:focus-visible,:disabled,[aria-disabled]):hover{border-color:var(--ds-color-accent-border-strong);box-shadow:inset 0 0 0 1px var(--ds-color-accent-border-strong)}}}
|
package/dist/textfield.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.textfield{.fds-textfield{display:grid;gap:var(--ds-spacing-2)}.fds-textfield__adornment{background:var(--ds-color-neutral-background-subtle);border:1px solid var(--ds-color-neutral-border-strong);border-radius:var(--ds-border-radius-md);box-sizing:border-box;color:var(--ds-color-neutral-border-strong);display:inline-block;padding:9px var(--ds-spacing-4)}.fds-textfield__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--ds-color-neutral-background-default);border:1px solid var(--ds-color-neutral-border-default);border-radius:var(--ds-border-radius-md);box-sizing:border-box;color:var(--ds-color-neutral-text-default);flex:0 1 auto;font:inherit;font-family:inherit;padding:0 var(--ds-spacing-3);position:relative;width:100%}.fds-textfield__input:disabled{cursor:not-allowed}.fds-textfield--readonly .fds-textfield__input{background:var(--ds-color-neutral-background-subtle);border-color:var(--ds-color-neutral-border-strong)}.fds-textfield__field{align-items:stretch;border-radius:var(--ds-border-radius-md);display:flex}.fds-textfield__field>:first-child{border-bottom-left-radius:var(--ds-border-radius-md);border-top-left-radius:var(--ds-border-radius-md)}.fds-textfield__field>:last-child{border-bottom-right-radius:var(--ds-border-radius-md);border-top-right-radius:var(--ds-border-radius-md)}.fds-textfield--sm .fds-textfield__adornment{padding:var(--ds-sizing-2) var(--ds-spacing-3)}.fds-textfield--md .fds-textfield__adornment{padding:.65rem var(--ds-spacing-4)}.fds-textfield--lg .fds-textfield__adornment{padding:.85rem var(--ds-spacing-5)}.fds-textfield--sm .fds-textfield__field{height:var(--ds-sizing-10)}.fds-textfield--md .fds-textfield__field{height:var(--ds-sizing-12)}.fds-textfield--lg .fds-textfield__field{height:var(--ds-sizing-14)}.fds-textfield--sm .fds-textfield__input{padding:0 var(--ds-spacing-2)}.fds-textfield--md .fds-textfield__input{padding:0 var(--ds-spacing-3)}.fds-textfield--lg .fds-textfield__input{padding:0 var(--ds-spacing-4)}.fds-textfield__label{align-items:center;display:inline-flex;flex-direction:row;gap:var(--ds-spacing-1);min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}.fds-textfield__description{color:var(--ds-color-neutral-text-subtle);margin-top:calc(var(--ds-spacing-2)*-1)}.fds-textfield:has(.fds-textfield__input:disabled){opacity:var(--ds-disabled-opacity)}.fds-textfield--error .fds-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){.fds-textfield__input:not(:focus-visible,:disabled,[aria-disabled]):hover{border-color:var(--ds-color-accent-border-strong);box-shadow:inset 0 0 0 1px var(--ds-color-accent-border-strong)}}.fds-textfield__input--with-prefix{border-bottom-left-radius:0;border-top-left-radius:0}.fds-textfield__input--with-suffix{border-bottom-right-radius:0;border-top-right-radius:0}.fds-textfield__prefix{border-bottom-right-radius:0;border-right:0;border-top-right-radius:0}.fds-textfield__suffix{border-bottom-left-radius:0;border-left:0;border-top-left-radius:0}.fds-textfield__readonly__icon{height:1.2em;width:1.2em}.fds-textfield__error-message:empty{display:none}}
|
package/dist/togglegroup.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.togglegroup{.fds-togglegroup{background-color:var(--ds-color-neutral-background-default);border:var(--ds-color-neutral-border-default) solid var(--ds-border-width-default);border-radius:var(--ds-border-radius-lg);height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.fds-togglegroup__content{display:inline-grid;gap:var(--ds-spacing-1);grid-auto-columns:1fr;grid-auto-flow:column;padding:var(--ds-spacing-1)}.fds-togglegroup__input{display:none}.fds-togglegroup__item:focus-visible{z-index:1}}
|
package/dist/tooltip.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.tooltip{.fds-tooltip{--dsc-tooltip-background:var(--ds-color-neutral-text-default);background:var(--dsc-tooltip-background);border-radius:var(--ds-border-radius-md);color:var(--ds-color-neutral-background-default);font:var(--ds-typography-paragraph-xs);font-family:inherit;padding:var(--ds-spacing-1) var(--ds-spacing-2)}.fds-tooltip__arrow{fill:var(--dsc-tooltip-background)}}
|
package/dist/utils.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.utils{.fds-sr-only{border:0;clip:rect(0 0 0 0);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.fds-focus:focus-visible{--dsc-focus-border-width:3px;box-shadow:0 0 0 var(--dsc-focus-border-width) var(--ds-focus-inner);outline:var(--dsc-focus-border-width) solid var(--ds-focus-outer);outline-offset:var(--dsc-focus-border-width)}@layer animate-height{.fds-animate-height--closed,.fds-animate-height--openingOrClosing{overflow:hidden}.fds-animate-height--open .fds-animate-height__content{height:auto}.fds-animate-height--closed .fds-animate-height__content{display:none;height:0}}}
|
package/divider.css
CHANGED
package/dropdownmenu.css
CHANGED
package/error-message.css
CHANGED
package/error-summary.css
CHANGED
package/fieldset.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.fieldset {
|
|
2
2
|
.fds-fieldset {
|
|
3
3
|
margin: 0;
|
|
4
4
|
padding: 0;
|
|
@@ -30,8 +30,8 @@
|
|
|
30
30
|
width: 1.2em;
|
|
31
31
|
}
|
|
32
32
|
|
|
33
|
-
.fds-fieldset
|
|
34
|
-
.fds-fieldset
|
|
33
|
+
.fds-fieldset:disabled .fds-fieldset__legend,
|
|
34
|
+
.fds-fieldset:disabled .fds-fieldset__description {
|
|
35
35
|
color: var(--ds-color-neutral-border-subtle);
|
|
36
36
|
}
|
|
37
37
|
|
package/heading.css
CHANGED
package/helptext.css
CHANGED
package/index.css
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
@charset "UTF-8";
|
|
2
2
|
|
|
3
|
-
@layer
|
|
3
|
+
@layer ds.typography, ds.utils, ds.box, ds.btn;
|
|
4
4
|
|
|
5
5
|
/** Import order defines ordinal specificity for layers */
|
|
6
|
+
@import url('./label.css');
|
|
7
|
+
@import url('./heading.css');
|
|
8
|
+
@import url('./paragraph.css');
|
|
9
|
+
@import url('./ingress.css');
|
|
6
10
|
@import url('./button.css');
|
|
7
11
|
@import url('./utils.css');
|
|
8
12
|
@import url('./box.css');
|
|
9
13
|
@import url('./alert.css');
|
|
10
|
-
@import url('./ingress.css');
|
|
11
14
|
@import url('./skiplink.css');
|
|
12
15
|
@import url('./accordion.css');
|
|
13
16
|
@import url('./switch.css');
|
|
14
17
|
@import url('./checkbox.css');
|
|
15
18
|
@import url('./error-message.css');
|
|
16
|
-
@import url('./label.css');
|
|
17
|
-
@import url('./heading.css');
|
|
18
|
-
@import url('./paragraph.css');
|
|
19
19
|
@import url('./radio.css');
|
|
20
20
|
@import url('./search.css');
|
|
21
21
|
@import url('./native-select.css');
|
package/ingress.css
CHANGED
package/label.css
CHANGED
package/link.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.link {
|
|
2
2
|
.fds-link {
|
|
3
3
|
position: relative;
|
|
4
4
|
color: var(--ds-color-accent-text-subtle);
|
|
@@ -22,8 +22,8 @@
|
|
|
22
22
|
}
|
|
23
23
|
|
|
24
24
|
.fds-link:focus-visible {
|
|
25
|
-
color: var(--ds-color-accent-
|
|
26
|
-
background: var(--ds-color-neutral-
|
|
25
|
+
color: var(--ds-color-accent-text-default);
|
|
26
|
+
background: var(--ds-color-neutral-surface-default);
|
|
27
27
|
outline: none;
|
|
28
28
|
}
|
|
29
29
|
|
package/list.css
CHANGED
package/modal.css
CHANGED
package/native-select.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.nativeselect {
|
|
2
2
|
.fds-native-select__wrapper {
|
|
3
3
|
position: relative;
|
|
4
4
|
display: grid;
|
|
@@ -67,11 +67,11 @@
|
|
|
67
67
|
gap: var(--ds-spacing-2);
|
|
68
68
|
}
|
|
69
69
|
|
|
70
|
-
.fds-native-select--disabled {
|
|
71
|
-
opacity: var(--ds-opacity
|
|
70
|
+
.fds-native-select--container:has(.fds-native-select:disabled) {
|
|
71
|
+
opacity: var(--ds-disabled-opacity);
|
|
72
72
|
}
|
|
73
73
|
|
|
74
|
-
.fds-native-select
|
|
74
|
+
.fds-native-select:disabled {
|
|
75
75
|
cursor: not-allowed;
|
|
76
76
|
}
|
|
77
77
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@digdir/designsystemet-css",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.10.0-alpha.1",
|
|
4
4
|
"description": "CSS for Designsystemet",
|
|
5
5
|
"author": "Designsystemet team",
|
|
6
6
|
"repository": "https://github.com/digdir/designsystemet",
|
|
@@ -39,5 +39,5 @@
|
|
|
39
39
|
"postcss-import": "^16.0.1",
|
|
40
40
|
"rimraf": "^5.0.5"
|
|
41
41
|
},
|
|
42
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "280f6f5955fc74fc8ede9c27b267a58713616187"
|
|
43
43
|
}
|
package/pagination.css
CHANGED
package/paragraph.css
CHANGED
package/popover.css
CHANGED
package/radio.css
CHANGED
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.radio {
|
|
2
2
|
.fds-radio {
|
|
3
3
|
--dsc-radio-size: var(--ds-spacing-5);
|
|
4
4
|
--dsc-radio-focus-border-width: 3px;
|
|
5
5
|
--dsc-radio-background: var(--ds-color-neutral-background-default);
|
|
6
6
|
--dsc-radio-border-color: var(--ds-color-neutral-border-strong);
|
|
7
7
|
--dsc-radio-border__hover--size: calc(var(--ds-spacing-3) / 2);
|
|
8
|
-
--dsc-radio-border__hover: 0 0 0 var(--dsc-radio-border__hover--size) var(--ds-color-accent-
|
|
9
|
-
--dsc-radio-focus-color: var(--ds-color-neutral-text-default);
|
|
8
|
+
--dsc-radio-border__hover: 0 0 0 var(--dsc-radio-border__hover--size) var(--ds-color-accent-surface-hover);
|
|
10
9
|
|
|
11
10
|
display: grid;
|
|
12
11
|
}
|
|
@@ -61,35 +60,34 @@
|
|
|
61
60
|
grid-column: 2;
|
|
62
61
|
}
|
|
63
62
|
|
|
64
|
-
.fds-radio--disabled > .fds-radio__input,
|
|
65
|
-
.fds-radio--disabled > .fds-radio__label,
|
|
66
|
-
.fds-radio--disabled > .fds-radio__input::before {
|
|
67
|
-
cursor: not-allowed;
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
.fds-radio--disabled > .fds-radio__label,
|
|
71
|
-
.fds-radio--disabled > .fds-radio__input,
|
|
72
|
-
.fds-radio--disabled > .fds-radio__description {
|
|
73
|
-
opacity: var(--ds-opacity-disabled);
|
|
74
|
-
}
|
|
75
|
-
|
|
76
63
|
.fds-radio--readonly > .fds-radio__input,
|
|
77
64
|
.fds-radio--readonly > .fds-radio__label,
|
|
78
65
|
.fds-radio--readonly > .fds-radio__input::before {
|
|
79
66
|
cursor: default;
|
|
80
67
|
}
|
|
81
68
|
|
|
69
|
+
.fds-radio:has(.fds-radio__input:disabled) > .fds-radio__description {
|
|
70
|
+
opacity: var(--ds-disabled-opacity);
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.fds-radio__input:disabled,
|
|
74
|
+
.fds-radio__input:disabled::before,
|
|
75
|
+
.fds-radio:has(.fds-radio__input:disabled) > .fds-radio__label {
|
|
76
|
+
cursor: not-allowed;
|
|
77
|
+
opacity: var(--fds-opacity-disabled);
|
|
78
|
+
}
|
|
79
|
+
|
|
82
80
|
.fds-radio__input:focus-visible {
|
|
83
81
|
outline-offset: var(--ds-spacing-1);
|
|
84
|
-
outline: var(--dsc-radio-focus-border-width) solid var(--
|
|
82
|
+
outline: var(--dsc-radio-focus-border-width) solid var(--ds-focus-outer);
|
|
85
83
|
box-shadow:
|
|
86
84
|
inset 0 0 0 2px var(--dsc-radio-border-color),
|
|
87
|
-
inset 0 0 0 var(--dsc-radio-focus-border-width) var(--ds-
|
|
85
|
+
inset 0 0 0 var(--dsc-radio-focus-border-width) var(--ds-focus-inner),
|
|
88
86
|
inset 0 0 0 6px var(--dsc-radio-background);
|
|
89
87
|
}
|
|
90
88
|
|
|
91
89
|
.fds-radio__input:checked {
|
|
92
|
-
--dsc-radio-border-color: var(--ds-color-accent-
|
|
90
|
+
--dsc-radio-border-color: var(--ds-color-accent-base-default);
|
|
93
91
|
|
|
94
92
|
background: var(--dsc-radio-border-color);
|
|
95
93
|
}
|
|
@@ -116,12 +114,12 @@
|
|
|
116
114
|
/* Only use hover for non-touch devices to prevent sticky-hovering
|
|
117
115
|
"input:not(:read-only)" does not work so using ".container:not(.readonly) >" instead */
|
|
118
116
|
@media (hover: hover) and (pointer: fine) {
|
|
119
|
-
.fds-radio:not(.fds-radio--readonly
|
|
120
|
-
.fds-radio:not(.fds-radio--readonly
|
|
117
|
+
.fds-radio:not(.fds-radio--readonly) > .fds-radio__label:hover:not(:disabled),
|
|
118
|
+
.fds-radio:not(.fds-radio--readonly) > .fds-radio__input:hover:not(:disabled) + .fds-radio__label {
|
|
121
119
|
color: var(--ds-color-accent-text-subtle);
|
|
122
120
|
}
|
|
123
121
|
|
|
124
|
-
.fds-radio:not(.fds-radio--readonly
|
|
122
|
+
.fds-radio:not(.fds-radio--readonly) > .fds-radio__input:hover:not(:checked, :disabled) {
|
|
125
123
|
--dsc-radio-border-color: var(--ds-color-accent-border-strong);
|
|
126
124
|
|
|
127
125
|
box-shadow:
|
|
@@ -129,9 +127,7 @@
|
|
|
129
127
|
inset 0 0 0 2px var(--dsc-radio-border-color);
|
|
130
128
|
}
|
|
131
129
|
|
|
132
|
-
.fds-radio:not(.fds-radio--readonly
|
|
133
|
-
--dsc-radio-border-color: var(--ds-color-accent-border-strong);
|
|
134
|
-
|
|
130
|
+
.fds-radio:not(.fds-radio--readonly) > .fds-radio__input:hover:checked:not(:disabled) {
|
|
135
131
|
box-shadow:
|
|
136
132
|
var(--dsc-radio-border__hover),
|
|
137
133
|
inset 0 0 0 2px var(--dsc-radio-border-color),
|
package/search.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.search {
|
|
2
2
|
.fds-search {
|
|
3
3
|
display: inline-grid;
|
|
4
4
|
width: 100%;
|
|
@@ -80,8 +80,8 @@
|
|
|
80
80
|
z-index: 1;
|
|
81
81
|
}
|
|
82
82
|
|
|
83
|
-
.fds-search
|
|
84
|
-
opacity: var(--ds-opacity
|
|
83
|
+
.fds-search:has(.fds-search__input:disabled) {
|
|
84
|
+
opacity: var(--ds-disabled-opacity);
|
|
85
85
|
}
|
|
86
86
|
|
|
87
87
|
.fds-search__search-button {
|
package/skeleton.css
CHANGED
package/skiplink.css
CHANGED
package/spinner.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer
|
|
1
|
+
@layer ds.spinner {
|
|
2
2
|
.fds-spinner {
|
|
3
3
|
animation: fds-spinner-rotate-animation linear infinite;
|
|
4
4
|
animation-duration: 2s;
|
|
@@ -24,11 +24,11 @@
|
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
26
|
|
|
27
|
-
.fds-spinner--
|
|
27
|
+
.fds-spinner--neutral .fds-spinner__circle {
|
|
28
28
|
stroke: var(--ds-color-neutral-border-default);
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
-
.fds-spinner--
|
|
31
|
+
.fds-spinner--accent .fds-spinner__circle {
|
|
32
32
|
stroke: var(--ds-color-accent-base-default);
|
|
33
33
|
}
|
|
34
34
|
|