@public-ui/theme-default 3.0.9-rc.1 → 3.0.9-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.cjs +1 -1
  2. package/dist/index.mjs +1 -1
  3. package/package.json +6 -6
package/dist/index.cjs CHANGED
@@ -1246,7 +1246,7 @@ var css_248z$7 = "/* forward the rem function */\n@layer kol-theme-component {\n
1246
1246
 
1247
1247
  var css_248z$6 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tabs {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: var(--grid-template-rows);\n }\n .kol-tabs--align-right {\n --display: grid;\n --grid-template-columns: 1fr auto;\n --button-group-display: grid;\n --button-group-order: 1;\n }\n .kol-tabs--align-left {\n --display: grid;\n --grid-template-columns: auto 1fr;\n --button-group-order: 0;\n }\n .kol-tabs--align-bottom {\n --display: flex;\n --grid-template-rows: 1fr auto;\n --button-group-gap: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n --button-group-order: 1;\n }\n .kol-tabs--align-top {\n --display: flex;\n --grid-template-rows: auto 1fr;\n --button-group-gap: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n --button-group-order: 0;\n }\n .kol-tabs__button-group {\n display: var(--display);\n gap: var(--button-group-gap);\n order: var(--button-group-order);\n flex-wrap: wrap;\n }\n .kol-tabs .kol-button {\n color: var(--color-subtle);\n background-color: transparent;\n border-radius: var(--border-radius);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: 0;\n font-size: calc(18 * 1rem / var(--kolibri-root-font-size, 16));\n font-weight: 700;\n line-height: 1.2;\n border: none;\n font-style: normal;\n }\n .kol-tabs .kol-button:hover {\n color: var(--color-primary);\n }\n .kol-tabs .kol-button.primary, .kol-tabs .kol-button.selected {\n color: var(--color-primary);\n }\n .kol-tabs .kol-button:not(.kol-tabs .kol-button.selected) .kol-span__container {\n padding-bottom: 0.25em;\n }\n .kol-tabs .kol-button.selected .kol-span__container {\n border-bottom: 0.25em solid;\n }\n .kol-tabs .kol-button .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs__content {\n padding: 0.25em 0;\n }\n .kol-tabs__panel {\n height: 100%;\n }\n .kol-tabs .kol-button-wc {\n width: 100%;\n }\n}";
1248
1248
 
1249
- var css_248z$5 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4 * 1rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: stretch;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled, .kol-input-container:has(.kol-input--readonly)):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container:has(.kol-input--readonly), .kol-input-container:has(.kol-textarea--readonly), .kol-input-container--disabled {\n border-color: var(--color-mute-variant);\n border-width: 1px;\n border-bottom: 2px solid var(--color-subtle);\n }\n .kol-input-container:has(.kol-input--readonly) .kol-input-container__container, .kol-input-container:has(.kol-textarea--readonly) .kol-input-container__container, .kol-input-container--disabled .kol-input-container__container {\n padding-top: 1px;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n}\n@layer kol-theme-component {\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter {\n order: 4;\n }\n .kol-form-field__hint {\n order: 5;\n }\n .kol-textarea {\n background-color: transparent;\n display: block;\n height: 100%;\n padding: 0 to-rem(8);\n overflow: auto;\n border: none;\n }\n .kol-textarea::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-textarea::placeholder {\n color: var(--color-subtle);\n }\n}";
1249
+ var css_248z$5 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4 * 1rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: stretch;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled, .kol-input-container:has(.kol-input--readonly)):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container:has(.kol-input--readonly), .kol-input-container:has(.kol-textarea--readonly), .kol-input-container--disabled {\n border-color: var(--color-mute-variant);\n border-width: 1px;\n border-bottom: 2px solid var(--color-subtle);\n }\n .kol-input-container:has(.kol-input--readonly) .kol-input-container__container, .kol-input-container:has(.kol-textarea--readonly) .kol-input-container__container, .kol-input-container--disabled .kol-input-container__container {\n padding-top: 1px;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n}\n@layer kol-theme-component {\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter {\n order: 4;\n }\n .kol-form-field__hint {\n order: 5;\n }\n .kol-textarea {\n background-color: transparent;\n display: block;\n height: 100%;\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n overflow: auto;\n line-height: 1.5em;\n border: none;\n }\n .kol-textarea::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-textarea::placeholder {\n color: var(--color-subtle);\n }\n}";
1250
1250
 
1251
1251
  var css_248z$4 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n :host {\n top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n width: calc(440 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item {\n margin-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
1252
1252
 
package/dist/index.mjs CHANGED
@@ -1244,7 +1244,7 @@ var css_248z$7 = "/* forward the rem function */\n@layer kol-theme-component {\n
1244
1244
 
1245
1245
  var css_248z$6 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tabs {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: var(--grid-template-rows);\n }\n .kol-tabs--align-right {\n --display: grid;\n --grid-template-columns: 1fr auto;\n --button-group-display: grid;\n --button-group-order: 1;\n }\n .kol-tabs--align-left {\n --display: grid;\n --grid-template-columns: auto 1fr;\n --button-group-order: 0;\n }\n .kol-tabs--align-bottom {\n --display: flex;\n --grid-template-rows: 1fr auto;\n --button-group-gap: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n --button-group-order: 1;\n }\n .kol-tabs--align-top {\n --display: flex;\n --grid-template-rows: auto 1fr;\n --button-group-gap: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n --button-group-order: 0;\n }\n .kol-tabs__button-group {\n display: var(--display);\n gap: var(--button-group-gap);\n order: var(--button-group-order);\n flex-wrap: wrap;\n }\n .kol-tabs .kol-button {\n color: var(--color-subtle);\n background-color: transparent;\n border-radius: var(--border-radius);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: 0;\n font-size: calc(18 * 1rem / var(--kolibri-root-font-size, 16));\n font-weight: 700;\n line-height: 1.2;\n border: none;\n font-style: normal;\n }\n .kol-tabs .kol-button:hover {\n color: var(--color-primary);\n }\n .kol-tabs .kol-button.primary, .kol-tabs .kol-button.selected {\n color: var(--color-primary);\n }\n .kol-tabs .kol-button:not(.kol-tabs .kol-button.selected) .kol-span__container {\n padding-bottom: 0.25em;\n }\n .kol-tabs .kol-button.selected .kol-span__container {\n border-bottom: 0.25em solid;\n }\n .kol-tabs .kol-button .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs__content {\n padding: 0.25em 0;\n }\n .kol-tabs__panel {\n height: 100%;\n }\n .kol-tabs .kol-button-wc {\n width: 100%;\n }\n}";
1246
1246
 
1247
- var css_248z$5 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4 * 1rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: stretch;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled, .kol-input-container:has(.kol-input--readonly)):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container:has(.kol-input--readonly), .kol-input-container:has(.kol-textarea--readonly), .kol-input-container--disabled {\n border-color: var(--color-mute-variant);\n border-width: 1px;\n border-bottom: 2px solid var(--color-subtle);\n }\n .kol-input-container:has(.kol-input--readonly) .kol-input-container__container, .kol-input-container:has(.kol-textarea--readonly) .kol-input-container__container, .kol-input-container--disabled .kol-input-container__container {\n padding-top: 1px;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n}\n@layer kol-theme-component {\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter {\n order: 4;\n }\n .kol-form-field__hint {\n order: 5;\n }\n .kol-textarea {\n background-color: transparent;\n display: block;\n height: 100%;\n padding: 0 to-rem(8);\n overflow: auto;\n border: none;\n }\n .kol-textarea::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-textarea::placeholder {\n color: var(--color-subtle);\n }\n}";
1247
+ var css_248z$5 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4 * 1rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: stretch;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled, .kol-input-container:has(.kol-input--readonly)):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container:has(.kol-input--readonly), .kol-input-container:has(.kol-textarea--readonly), .kol-input-container--disabled {\n border-color: var(--color-mute-variant);\n border-width: 1px;\n border-bottom: 2px solid var(--color-subtle);\n }\n .kol-input-container:has(.kol-input--readonly) .kol-input-container__container, .kol-input-container:has(.kol-textarea--readonly) .kol-input-container__container, .kol-input-container--disabled .kol-input-container__container {\n padding-top: 1px;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: var(--color-primary-variant) solid calc(3 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n}\n@layer kol-theme-component {\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter {\n order: 4;\n }\n .kol-form-field__hint {\n order: 5;\n }\n .kol-textarea {\n background-color: transparent;\n display: block;\n height: 100%;\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n overflow: auto;\n line-height: 1.5em;\n border: none;\n }\n .kol-textarea::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-textarea::placeholder {\n color: var(--color-subtle);\n }\n}";
1248
1248
 
1249
1249
  var css_248z$4 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n :host {\n top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n width: calc(440 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item {\n margin-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
1250
1250
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@public-ui/theme-default",
3
- "version": "3.0.9-rc.1",
3
+ "version": "3.0.9-rc.2",
4
4
  "license": "EUPL-1.2",
5
5
  "homepage": "https://public-ui.github.io",
6
6
  "repository": {
@@ -48,7 +48,7 @@
48
48
  "@rollup/plugin-typescript": "12.3.0",
49
49
  "@typescript-eslint/eslint-plugin": "7.18.0",
50
50
  "@typescript-eslint/parser": "7.18.0",
51
- "autoprefixer": "10.4.22",
51
+ "autoprefixer": "10.4.23",
52
52
  "cpy-cli": "6.0.0",
53
53
  "cross-env": "10.1.0",
54
54
  "eslint": "8.57.1",
@@ -59,15 +59,15 @@
59
59
  "prettier-plugin-organize-imports": "4.3.0",
60
60
  "rollup": "4.53.3",
61
61
  "rollup-plugin-postcss": "4.0.2",
62
- "sass-embedded": "1.93.3",
62
+ "sass-embedded": "1.96.0",
63
63
  "stylelint": "16.26.1",
64
64
  "typescript": "5.9.3",
65
65
  "unbuild": "3.6.1",
66
- "@public-ui/components": "3.0.9-rc.1",
67
- "@public-ui/visual-tests": "3.0.9-rc.1"
66
+ "@public-ui/components": "3.0.9-rc.2",
67
+ "@public-ui/visual-tests": "3.0.9-rc.2"
68
68
  },
69
69
  "peerDependencies": {
70
- "@public-ui/components": "3.0.9-rc.1"
70
+ "@public-ui/components": "3.0.9-rc.2"
71
71
  },
72
72
  "exports": {
73
73
  ".": {