@unoff/ui 1.21.3 → 1.22.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/dist/assets/Accordion.css +1 -1
- package/dist/assets/ActionsItem.css +1 -1
- package/dist/assets/ActionsList.css +1 -1
- package/dist/assets/Bar.css +1 -1
- package/dist/assets/Button.css +1 -1
- package/dist/assets/Card.css +1 -1
- package/dist/assets/Chip.css +1 -1
- package/dist/assets/ColorChip.css +1 -1
- package/dist/assets/Consent.css +1 -1
- package/dist/assets/Dialog.css +1 -1
- package/dist/assets/DraggableItem.css +1 -1
- package/dist/assets/DraggableWindow.css +1 -1
- package/dist/assets/Drawer.css +1 -1
- package/dist/assets/Dropdown.css +1 -1
- package/dist/assets/Dropzone.css +1 -1
- package/dist/assets/FormItem.css +1 -1
- package/dist/assets/Icon.css +1 -1
- package/dist/assets/Input.css +1 -1
- package/dist/assets/InputsBar.css +1 -1
- package/dist/assets/KeyboardShortcutItem.css +1 -1
- package/dist/assets/Knob.css +1 -1
- package/dist/assets/Layout.css +1 -1
- package/dist/assets/List.css +1 -1
- package/dist/assets/MembersList.css +1 -1
- package/dist/assets/Message.css +1 -1
- package/dist/assets/MultipleSlider.css +1 -1
- package/dist/assets/Popin.css +1 -1
- package/dist/assets/Section.css +1 -1
- package/dist/assets/SectionTitle.css +1 -1
- package/dist/assets/Select.css +1 -1
- package/dist/assets/SemanticMessage.css +1 -1
- package/dist/assets/SimpleItem.css +1 -1
- package/dist/assets/SimpleSlider.css +1 -1
- package/dist/assets/SortableList.css +1 -1
- package/dist/assets/Tabs.css +1 -1
- package/dist/assets/Thumbnail.css +1 -1
- package/dist/assets/Tooltip.css +1 -1
- package/dist/assets/styles/texts/styles/figma.css +1 -1
- package/dist/assets/styles/texts/styles/framer.css +1 -1
- package/dist/assets/styles/texts/styles/penpot.css +1 -1
- package/dist/assets/styles/texts/styles/sketch.css +1 -1
- package/dist/assets/styles/texts/texts.css +1 -1
- package/dist/assets/styles/tokens/modules/commons.css +1 -0
- package/dist/assets/styles/tokens/modules/figma-colors.css +1 -1
- package/dist/assets/styles/tokens/modules/figma-plugin.css +1 -0
- package/dist/assets/styles/tokens/modules/framer-colors.css +1 -1
- package/dist/assets/styles/tokens/modules/penpot-colors.css +1 -1
- package/dist/assets/styles/tokens/modules/penpot-types.css +1 -1
- package/dist/assets/styles/tokens/modules/sketch-colors.css +1 -1
- package/dist/assets/styles/tokens/modules/sketch-types.css +1 -1
- package/dist/components/actions/button/Button.figma.js +1 -1
- package/dist/components/assets/icon/Icon.figma.js +1 -1
- package/dist/components/dialogs/consent/Consent.d.ts.map +1 -1
- package/dist/components/dialogs/consent/Consent.js.map +1 -1
- package/dist/components/inputs/dropdown/Dropdown.d.ts.map +1 -1
- package/dist/components/inputs/dropdown/Dropdown.figma.js +1 -1
- package/dist/components/inputs/dropdown/Dropdown.js.map +1 -1
- package/dist/components/inputs/dropzone/Dropzone.d.ts +1 -1
- package/dist/components/inputs/dropzone/Dropzone.d.ts.map +1 -1
- package/dist/components/inputs/dropzone/Dropzone.js.map +1 -1
- package/dist/components/inputs/input/Input.figma.js +1 -1
- package/dist/components/lists/actions-list/ActionsList.d.ts.map +1 -1
- package/dist/components/lists/actions-list/ActionsList.js.map +1 -1
- package/dist/components/lists/sortable-list/SortableList.d.ts.map +1 -1
- package/dist/components/lists/sortable-list/SortableList.js.map +1 -1
- package/dist/components/lists/tabs/Tabs.figma.js +1 -1
- package/dist/components/tags/chip/Chip.figma.js +1 -1
- package/dist/components/tags/color-chip/ColorChip.d.ts.map +1 -1
- package/dist/components/tags/color-chip/ColorChip.js.map +1 -1
- package/dist/components/tags/icon-chip/IconChip.d.ts.map +1 -1
- package/dist/components/tags/icon-chip/IconChip.js.map +1 -1
- package/dist/index.d.ts +3 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +108 -106
- package/dist/index.js.map +1 -1
- package/dist/index_react-D2vn0nVd.js +19160 -0
- package/dist/index_react-D2vn0nVd.js.map +1 -0
- package/dist/styles/texts/texts.module.js +14 -14
- package/dist/styles/tokens/modules/commons.module.js +9 -0
- package/dist/styles/tokens/modules/commons.module.js.map +1 -0
- package/dist/styles/tokens/modules/figma-plugin.module.js +9 -0
- package/dist/styles/tokens/modules/figma-plugin.module.js.map +1 -0
- package/dist/styles/tokens/modules/figma-types.module.js +1 -1
- package/dist/styles/tokens/modules/framer-types.module.js +1 -1
- package/dist/types/icon.types.d.ts +1 -1
- package/dist/types/icon.types.d.ts.map +1 -1
- package/dist/types/icon.types.js.map +1 -1
- package/package.json +2 -5
- package/dist/assets/styles/tokens/figma-types.css +0 -1
- package/dist/assets/styles/tokens/framer-types.css +0 -1
- package/dist/assets/styles/tokens/modules/figma-types.css +0 -1
- package/dist/assets/styles/tokens/modules/framer-types.css +0 -1
- package/dist/assets/styles/tokens/modules/globals.css +0 -1
- package/dist/assets/styles/tokens/penpot-types.css +0 -1
- package/dist/assets/styles/tokens/sketch-types.css +0 -1
- package/dist/index_react-BkjUklDQ.js +0 -18392
- package/dist/index_react-BkjUklDQ.js.map +0 -1
- package/dist/styles/tokens/modules/globals.module.js +0 -9
- package/dist/styles/tokens/modules/globals.module.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--color-chip-border-color:
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--color-chip-border-color: rgb(0% 0% 0% / .1);--color-chip-border-offset: var(--size-neg-unit);--color-chip-border-width: var(--size-pos-unit);--color-chip-radius: var(--border-radius-small)}:root[data-theme=sketch]{--color-chip-border-color: rgb(0% 0% 0% / .1);--color-chip-border-offset: var(--size-neg-unit);--color-chip-border-width: var(--size-pos-unit);--color-chip-radius: var(--border-radius-small)}:root[data-theme=figma]{--color-chip-border-color: rgb(0% 0% 0% / .1);--color-chip-border-offset: var(--size-neg-unit);--color-chip-border-width: var(--size-pos-unit);--color-chip-radius: var(--border-radius-small)}:root[data-theme=framer]{--color-chip-border-color: rgb(0% 0% 0% / .1);--color-chip-border-offset: var(--size-neg-unit);--color-chip-border-width: var(--size-pos-unit);--color-chip-radius: var(--border-radius-small)}.color-chip{position:relative;flex:none;cursor:default;outline:var(--color-chip-border-width) solid var(--color-chip-border-color);outline-offset:var(--color-chip-border-offset);border-radius:var(--color-chip-radius);-webkit-user-select:none;user-select:none}.color-chip--rounded{--color-chip-radius: var(--border-radius-full)}
|
package/dist/assets/Consent.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--consent-background-color: var(--penpot-color-overlay-default);--consent-banner-background-color: var(--penpot-color-background-primary);--consent-banner-border-color: var(--penpot-color-background-quaternary);--consent-banner-border-style: solid;--consent-banner-border-width: var(--size-pos-unit);--consent-banner-gap: var(--size-pos-xxsmall);--consent-banner-max-width: 400px;--consent-banner-padding-bottom: var(--size-pos-xxsmall);--consent-banner-padding-left: var(--size-pos-xsmall);--consent-banner-padding-right: var(--size-pos-xsmall);--consent-banner-padding-top: var(--size-pos-xxsmall);--consent-list-max-width: 400px;--consent-list-padding-bottom: var(--size-null);--consent-list-padding-left: var(--size-pos-xsmall);--consent-list-padding-right: var(--size-null);--consent-list-padding-top: var(--size-null)}:root[data-theme=sketch]{--consent-background-color: var(--sketch-color-overlay-default);--consent-banner-background-color: var(--sketch-color-background-primary);--consent-banner-border-color: var(--sketch-color-border-primary);--consent-banner-border-width: var(--size-pos-unit);--consent-banner-gap: var(--size-pos-xxsmall);--consent-banner-max-width: 400px;--consent-banner-padding-bottom: var(--size-pos-xxsmall);--consent-banner-padding-left: var(--size-pos-xsmall);--consent-banner-padding-right: var(--size-pos-xsmall);--consent-banner-padding-top: var(--size-pos-xxsmall);--consent-list-max-width: 400px;--consent-list-padding-bottom: var(--size-null);--consent-list-padding-left: var(--size-pos-xsmall);--consent-list-padding-right: var(--size-null);--consent-list-padding-top: var(--size-null)}:root[data-theme=figma]{--consent-background-color:
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--consent-background-color: var(--penpot-color-overlay-default);--consent-banner-background-color: var(--penpot-color-background-primary);--consent-banner-border-color: var(--penpot-color-background-quaternary);--consent-banner-border-style: solid;--consent-banner-border-width: var(--size-pos-unit);--consent-banner-gap: var(--size-pos-xxsmall);--consent-banner-max-width: 400px;--consent-banner-padding-bottom: var(--size-pos-xxsmall);--consent-banner-padding-left: var(--size-pos-xsmall);--consent-banner-padding-right: var(--size-pos-xsmall);--consent-banner-padding-top: var(--size-pos-xxsmall);--consent-list-max-width: 400px;--consent-list-padding-bottom: var(--size-null);--consent-list-padding-left: var(--size-pos-xsmall);--consent-list-padding-right: var(--size-null);--consent-list-padding-top: var(--size-null)}:root[data-theme=sketch]{--consent-background-color: var(--sketch-color-overlay-default);--consent-banner-background-color: var(--sketch-color-background-primary);--consent-banner-border-color: var(--sketch-color-border-primary);--consent-banner-border-width: var(--size-pos-unit);--consent-banner-gap: var(--size-pos-xxsmall);--consent-banner-max-width: 400px;--consent-banner-padding-bottom: var(--size-pos-xxsmall);--consent-banner-padding-left: var(--size-pos-xsmall);--consent-banner-padding-right: var(--size-pos-xsmall);--consent-banner-padding-top: var(--size-pos-xxsmall);--consent-list-max-width: 400px;--consent-list-padding-bottom: var(--size-null);--consent-list-padding-left: var(--size-pos-xsmall);--consent-list-padding-right: var(--size-null);--consent-list-padding-top: var(--size-null)}:root[data-theme=figma]{--consent-background-color: rgb(0% 0% 0% / .5);--consent-banner-background-color: var(--figma-color-bg-default);--consent-banner-border-color: var(--figma-color-border-default);--consent-banner-border-width: var(--size-pos-unit);--consent-banner-gap: var(--size-pos-xxsmall);--consent-banner-max-width: 400px;--consent-banner-padding-bottom: var(--size-pos-xxsmall);--consent-banner-padding-left: var(--size-pos-xsmall);--consent-banner-padding-right: var(--size-pos-xsmall);--consent-banner-padding-top: var(--size-pos-xxsmall);--consent-list-max-width: 400px;--consent-list-padding-bottom: var(--size-null);--consent-list-padding-left: var(--size-pos-xsmall);--consent-list-padding-right: var(--size-null);--consent-list-padding-top: var(--size-null)}:root[data-theme=framer]{--consent-background-color: rgb(0% 0% 0% / .5);--consent-banner-background-color: var(--framer-color-bg-default);--consent-banner-border-color: var(--framer-color-divider);--consent-banner-border-width: var(--size-pos-unit);--consent-banner-gap: var(--size-pos-xxsmall);--consent-banner-max-width: 400px;--consent-banner-padding-bottom: var(--size-pos-xxsmall);--consent-banner-padding-left: var(--size-pos-xsmall);--consent-banner-padding-right: var(--size-pos-xsmall);--consent-banner-padding-top: var(--size-pos-xxsmall);--consent-list-max-width: 400px;--consent-list-padding-bottom: var(--size-null);--consent-list-padding-left: var(--size-pos-xsmall);--consent-list-padding-right: var(--size-null);--consent-list-padding-top: var(--size-null)}.consent{display:flex;position:fixed;justify-content:center;align-items:end;z-index:5;cursor:default;box-sizing:border-box;margin:0;inset:0;border:none;background-color:var(--consent-background-color);padding:0;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;user-select:none}.consent .consent__banner{display:flex;flex-direction:column;gap:var(--consent-banner-gap);border-top:var(--consent-banner-border-width) solid var(--consent-banner-border-color);background-color:var(--consent-banner-background-color);padding:var(--consent-banner-padding-top) var(--consent-banner-padding-right) var(--consent-banner-padding-bottom) var(--consent-banner-padding-left);width:100%;max-height:100%;pointer-events:all}.consent .consent__banner__message{max-width:var(--consent-banner-max-width);overflow:hidden auto}.consent .consent__banner__content{overflow:hidden auto}.consent .consent__banner__list{display:flex;flex-direction:column;padding:var(--consent-list-padding-top) var(--consent-list-padding-right) var(--consent-list-padding-bottom) var(--consent-list-padding-left);list-style-type:none}.consent .consent__banner__item__icon{flex:none}.consent .consent__banner__item__description{max-width:var(--consent-list-max-width)}.consent .consent__banner>.bar{flex:none}@media(max-width:460px){.consent .consent__banner__message{flex:1}.consent .consent__banner__actions{flex-direction:column;align-items:end}}
|
package/dist/assets/Dialog.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--dialog-background-color: var(--penpot-color-overlay-default);--dialog-cover-padding-bottom: var(--size-pos-xsmall);--dialog-cover-padding-left: var(--size-pos-medium);--dialog-cover-padding-right: var(--size-null);--dialog-cover-padding-top: var(--size-pos-xsmall);--dialog-cover-ratio: 8 / 5;--dialog-cover-width: 248px;--dialog-form-gap: var(--size-pos-xxxsmall);--dialog-form-padding-bottom: var(--size-pos-xxsmall);--dialog-form-padding-left: var(--size-pos-small);--dialog-form-padding-right: var(--size-pos-medium);--dialog-form-padding-top: var(--size-pos-xxsmall);--dialog-padding-bottom: var(--size-pos-medium);--dialog-padding-left: var(--size-pos-medium);--dialog-padding-right: var(--size-pos-medium);--dialog-padding-top: var(--size-pos-medium);--dialog-text-gap: var(--size-pos-xxsmall);--dialog-text-padding-bottom: var(--size-pos-xsmall);--dialog-text-padding-left: var(--size-pos-medium);--dialog-text-padding-right: var(--size-pos-medium);--dialog-text-padding-top: var(--size-pos-xsmall)}:root[data-theme=sketch]{--dialog-background-color: var(--sketch-color-overlay-default);--dialog-cover-padding-bottom: var(--size-pos-xsmall);--dialog-cover-padding-left: var(--size-pos-medium);--dialog-cover-padding-right: var(--size-null);--dialog-cover-padding-top: var(--size-pos-xsmall);--dialog-cover-ratio: 8 / 5;--dialog-cover-width: 248px;--dialog-form-gap: var(--size-pos-xxxsmall);--dialog-form-padding-bottom: var(--size-pos-xxsmall);--dialog-form-padding-left: var(--size-pos-small);--dialog-form-padding-right: var(--size-pos-medium);--dialog-form-padding-top: var(--size-pos-xxsmall);--dialog-padding-bottom: var(--size-pos-medium);--dialog-padding-left: var(--size-pos-medium);--dialog-padding-right: var(--size-pos-medium);--dialog-padding-top: var(--size-pos-medium);--dialog-text-gap: var(--size-pos-xxsmall);--dialog-text-padding-bottom: var(--size-pos-xsmall);--dialog-text-padding-left: var(--size-pos-medium);--dialog-text-padding-right: var(--size-pos-medium);--dialog-text-padding-top: var(--size-pos-xsmall)}:root[data-theme=figma]{--dialog-background-color:
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--dialog-background-color: var(--penpot-color-overlay-default);--dialog-cover-padding-bottom: var(--size-pos-xsmall);--dialog-cover-padding-left: var(--size-pos-medium);--dialog-cover-padding-right: var(--size-null);--dialog-cover-padding-top: var(--size-pos-xsmall);--dialog-cover-ratio: 8 / 5;--dialog-cover-width: 248px;--dialog-form-gap: var(--size-pos-xxxsmall);--dialog-form-padding-bottom: var(--size-pos-xxsmall);--dialog-form-padding-left: var(--size-pos-small);--dialog-form-padding-right: var(--size-pos-medium);--dialog-form-padding-top: var(--size-pos-xxsmall);--dialog-padding-bottom: var(--size-pos-medium);--dialog-padding-left: var(--size-pos-medium);--dialog-padding-right: var(--size-pos-medium);--dialog-padding-top: var(--size-pos-medium);--dialog-text-gap: var(--size-pos-xxsmall);--dialog-text-padding-bottom: var(--size-pos-xsmall);--dialog-text-padding-left: var(--size-pos-medium);--dialog-text-padding-right: var(--size-pos-medium);--dialog-text-padding-top: var(--size-pos-xsmall)}:root[data-theme=sketch]{--dialog-background-color: var(--sketch-color-overlay-default);--dialog-cover-padding-bottom: var(--size-pos-xsmall);--dialog-cover-padding-left: var(--size-pos-medium);--dialog-cover-padding-right: var(--size-null);--dialog-cover-padding-top: var(--size-pos-xsmall);--dialog-cover-ratio: 8 / 5;--dialog-cover-width: 248px;--dialog-form-gap: var(--size-pos-xxxsmall);--dialog-form-padding-bottom: var(--size-pos-xxsmall);--dialog-form-padding-left: var(--size-pos-small);--dialog-form-padding-right: var(--size-pos-medium);--dialog-form-padding-top: var(--size-pos-xxsmall);--dialog-padding-bottom: var(--size-pos-medium);--dialog-padding-left: var(--size-pos-medium);--dialog-padding-right: var(--size-pos-medium);--dialog-padding-top: var(--size-pos-medium);--dialog-text-gap: var(--size-pos-xxsmall);--dialog-text-padding-bottom: var(--size-pos-xsmall);--dialog-text-padding-left: var(--size-pos-medium);--dialog-text-padding-right: var(--size-pos-medium);--dialog-text-padding-top: var(--size-pos-xsmall)}:root[data-theme=figma]{--dialog-background-color: rgb(0% 0% 0% / .5);--dialog-cover-padding-bottom: var(--size-pos-xsmall);--dialog-cover-padding-left: var(--size-pos-xsmall);--dialog-cover-padding-right: var(--size-pos-xsmall);--dialog-cover-padding-top: var(--size-pos-xsmall);--dialog-cover-ratio: 8 / 5;--dialog-cover-width: 248px;--dialog-form-gap: var(--size-pos-xxxsmall);--dialog-form-padding-bottom: var(--size-pos-xxsmall);--dialog-form-padding-left: var(--size-pos-xxsmall);--dialog-form-padding-right: var(--size-pos-xsmall);--dialog-form-padding-top: var(--size-pos-xxsmall);--dialog-padding-bottom: var(--size-pos-medium);--dialog-padding-left: var(--size-pos-medium);--dialog-padding-right: var(--size-pos-medium);--dialog-padding-top: var(--size-pos-medium);--dialog-text-gap: var(--size-pos-xxsmall);--dialog-text-padding-bottom: var(--size-pos-xsmall);--dialog-text-padding-left: var(--size-pos-xsmall);--dialog-text-padding-right: var(--size-pos-xsmall);--dialog-text-padding-top: var(--size-pos-xsmall)}:root[data-theme=framer]{--dialog-background-color: rgb(0% 0% 0% / .5);--dialog-cover-padding-bottom: var(--size-pos-xsmall);--dialog-cover-padding-left: var(--size-pos-xsmall);--dialog-cover-padding-right: var(--size-pos-xsmall);--dialog-cover-padding-top: var(--size-pos-xsmall);--dialog-cover-ratio: 8 / 5;--dialog-cover-width: 248px;--dialog-form-gap: var(--size-pos-xxxsmall);--dialog-form-padding-bottom: var(--size-pos-xxsmall);--dialog-form-padding-left: var(--size-pos-xxsmall);--dialog-form-padding-right: var(--size-pos-xsmall);--dialog-form-padding-top: var(--size-pos-xxsmall);--dialog-padding-bottom: var(--size-pos-medium);--dialog-padding-left: var(--size-pos-medium);--dialog-padding-right: var(--size-pos-medium);--dialog-padding-top: var(--size-pos-medium);--dialog-text-gap: var(--size-pos-xxsmall);--dialog-text-padding-bottom: var(--size-pos-xsmall);--dialog-text-padding-left: var(--size-pos-msmall);--dialog-text-padding-right: var(--size-pos-msmall);--dialog-text-padding-top: var(--size-pos-xsmall)}.dialog{display:flex;position:fixed;justify-content:center;align-items:center;z-index:4;cursor:default;box-sizing:border-box;margin:0;inset:0;border:none;background-color:var(--dialog-background-color);padding:var(--dialog-padding);width:100%;height:100%;-webkit-user-select:none;user-select:none}.dialog{--dialog-padding: var(--dialog-padding-top) var(--dialog-padding-right) var(--dialog-padding-bottom) var(--dialog-padding-left)}.dialog--right{justify-content:end;align-items:start;--dialog-padding: 0}.dialog .dialog__cover{display:flex;flex:1 0 var(--dialog-cover-width);justify-content:center;align-items:center;aspect-ratio:var(--dialog-cover-ratio);max-width:var(--dialog-cover-width);overflow:hidden}.dialog .dialog__cover--padding{padding:var(--dialog-cover-padding-top) var(--dialog-cover-padding-right) var(--dialog-cover-padding-bottom) var(--dialog-cover-padding-left)}.dialog .dialog__text{display:flex;flex:1;flex-direction:column;gap:var(--dialog-text-gap);margin:0;padding:var(--dialog-text-padding-top) var(--dialog-text-padding-right) var(--dialog-text-padding-bottom) var(--dialog-text-padding-left)}.dialog .dialog__text p{margin:0}.dialog .dialog__form{display:flex;flex:1;flex-direction:column;gap:var(--dialog-form-gap);margin:0;padding:var(--dialog-form-padding-top) var(--dialog-form-padding-right) var(--dialog-form-padding-bottom) var(--dialog-form-padding-left)}@media(max-width:460px){.dialog .dialog__cover{flex:auto;box-sizing:border-box;width:100%;max-width:none}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--draggable-item-background-color-default: var(--penpot-color-background-primary);--draggable-item-background-color-pressed: var(--penpot-color-accent-primary-muted);--draggable-item-background-color-selected: var(--penpot-color-accent-primary-muted);--draggable-item-gap: var(--size-pos-xxsmall);--draggable-item-ghost-color: var(--penpot-color-accent-primary);--draggable-item-ghost-height: var(--size-pos-xunit);--draggable-item-ghost-inset: var(--size-neg-unit);--draggable-item-padding-bottom: var(--size-pos-xunit);--draggable-item-padding-left: var(--size-pos-xsmall);--draggable-item-padding-right: var(--size-pos-xsmall);--draggable-item-padding-top: var(--size-pos-xunit);--draggable-item-param-width-compact: 112px;--draggable-item-param-width-square: var(--size-pos-medium);--draggable-item-template-columns: repeat(76, 1fr);--draggable-item-template-rows: var(--size-pos-medium)}:root[data-theme=sketch]{--draggable-item-background-color-default: var(--sketch-color-background-primary);--draggable-item-background-color-pressed: var(--sketch-color-accent-disabled);--draggable-item-background-color-selected: var(--sketch-color-accent-disabled);--draggable-item-gap: var(--size-pos-xxsmall);--draggable-item-ghost-color: var(--sketch-color-accent-primary);--draggable-item-ghost-height: var(--size-pos-xunit);--draggable-item-ghost-inset: var(--size-neg-unit);--draggable-item-padding-bottom: var(--size-pos-xunit);--draggable-item-padding-left: var(--size-pos-xsmall);--draggable-item-padding-right: var(--size-pos-xsmall);--draggable-item-padding-top: var(--size-pos-xunit);--draggable-item-param-width-compact: 112px;--draggable-item-param-width-square: var(--size-pos-medium);--draggable-item-template-columns: repeat(76, 1fr);--draggable-item-template-rows: var(--size-pos-medium)}:root[data-theme=figma]{--draggable-item-background-color-default: var(--figma-color-bg);--draggable-item-background-color-pressed: var(--figma-color-bg-pressed);--draggable-item-background-color-selected: var(--figma-color-bg-selected);--draggable-item-gap: var(--size-pos-xxsmall);--draggable-item-ghost-color: var(--figma-color-border-selected);--draggable-item-ghost-height: var(--size-pos-xunit);--draggable-item-ghost-inset: var(--size-neg-unit);--draggable-item-padding-bottom: var(--size-pos-xunit);--draggable-item-padding-left: var(--size-pos-xsmall);--draggable-item-padding-right: var(--size-pos-xsmall);--draggable-item-padding-top: var(--size-pos-xunit);--draggable-item-param-width-compact: 112px;--draggable-item-param-width-square: var(--size-pos-medium);--draggable-item-template-columns: repeat(76, 1fr);--draggable-item-template-rows: var(--size-pos-medium)}:root[data-theme=framer]{--draggable-item-background-color-default: var(--framer-color-bg);--draggable-item-background-color-pressed: var(--framer-color-bg-secondary);--draggable-item-background-color-selected: var(--framer-color-tint-dimmed);--draggable-item-gap: var(--size-pos-xxsmall);--draggable-item-ghost-color: var(--framer-color-tint);--draggable-item-ghost-height: var(--size-pos-xunit);--draggable-item-ghost-inset: var(--size-neg-unit);--draggable-item-padding-bottom: var(--size-pos-xunit);--draggable-item-padding-left: var(--size-pos-xsmall);--draggable-item-padding-right: var(--size-pos-xsmall);--draggable-item-padding-top: var(--size-pos-xunit);--draggable-item-param-width-compact: 112px;--draggable-item-param-width-square: var(--size-pos-medium);--draggable-item-template-columns: repeat(76, 1fr);--draggable-item-template-rows: var(--size-pos-medium)}.draggable-item{display:grid;position:relative;grid-template-rows:var(--draggable-item-template-rows);grid-template-columns:var(--draggable-item-template-columns);background-color:var(--draggable-item-background-color);padding:var(--draggable-item-padding-top) var(--draggable-item-padding-right) var(--draggable-item-padding-bottom) var(--draggable-item-padding-left)}.draggable-item{--draggable-item-background-color: var( --draggable-item-background-color-default )}.draggable-item[draggable=true]{--draggable-item-background-color: var( --draggable-item-background-color-selected );--icon-button-default-background-color-default: var( --icon-button-default-background-color-onselected );--icon-button-default-background-color-hover: var( --icon-button-default-background-color-onselected-hover );--input-background-color-default: var( --input-background-color-onselected-default );--input-border-color-default: var(--input-border-color-onselected-default);--input-border-width-default: var(--input-border-width-onselected-default);--input-border-offset-default: var( --input-border-offset-onselected-default );--input-background-color-default-hover: var( --input-background-color-onselected-hover );--input-border-color-hover: var(--input-border-color-onselected-hover);--input-border-width-hover: var(--input-border-width-onselected-hover);--input-border-offset-hover: var(--input-border-offset-onselected-hover)}.draggable-item[draggable=true]:active{cursor:grabbing}.draggable-item--dragged:active>div{pointer-events:none}.draggable-item--above:before{position:absolute;top:var(--draggable-item-ghost-inset);left:0;z-index:99;background-color:var(--draggable-item-ghost-color);width:100%;height:var(--draggable-item-ghost-height);content:""}.draggable-item--below:before{position:absolute;bottom:var(--draggable-item-ghost-inset);left:0;z-index:99;background-color:var(--draggable-item-ghost-color);width:100%;height:var(--draggable-item-ghost-height);content:""}.draggable-item .draggable-item__primary{display:flex;grid-row:1/1;grid-column:1/77;justify-content:space-between}.draggable-item .draggable-item__left,.draggable-item .draggable-item__right{display:flex;align-items:center;gap:var(--draggable-item-gap);max-width:100%}.draggable-item .draggable-item__param{max-width:100%}.draggable-item .draggable-item__param--compact{width:var(--draggable-item-param-width-compact)}.draggable-item .draggable-item__param--square{display:flex;justify-content:center;align-items:center;width:var(--draggable-item-param-width-square)}.draggable-item .draggable-item__buttons--compact{grid-column:span 4/37}
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--draggable-item-background-color-default: var(--penpot-color-background-primary);--draggable-item-background-color-pressed: var(--penpot-color-accent-primary-muted);--draggable-item-background-color-selected: var(--penpot-color-accent-primary-muted);--draggable-item-gap: var(--size-pos-xxsmall);--draggable-item-ghost-color: var(--penpot-color-accent-primary-default);--draggable-item-ghost-height: var(--size-pos-xunit);--draggable-item-ghost-inset: var(--size-neg-unit);--draggable-item-padding-bottom: var(--size-pos-xunit);--draggable-item-padding-left: var(--size-pos-xsmall);--draggable-item-padding-right: var(--size-pos-xsmall);--draggable-item-padding-top: var(--size-pos-xunit);--draggable-item-param-width-compact: 112px;--draggable-item-param-width-square: var(--size-pos-medium);--draggable-item-template-columns: repeat(76, 1fr);--draggable-item-template-rows: var(--size-pos-medium)}:root[data-theme=sketch]{--draggable-item-background-color-default: var(--sketch-color-background-primary);--draggable-item-background-color-pressed: var(--sketch-color-accent-disabled);--draggable-item-background-color-selected: var(--sketch-color-accent-disabled);--draggable-item-gap: var(--size-pos-xxsmall);--draggable-item-ghost-color: var(--sketch-color-accent-primary);--draggable-item-ghost-height: var(--size-pos-xunit);--draggable-item-ghost-inset: var(--size-neg-unit);--draggable-item-padding-bottom: var(--size-pos-xunit);--draggable-item-padding-left: var(--size-pos-xsmall);--draggable-item-padding-right: var(--size-pos-xsmall);--draggable-item-padding-top: var(--size-pos-xunit);--draggable-item-param-width-compact: 112px;--draggable-item-param-width-square: var(--size-pos-medium);--draggable-item-template-columns: repeat(76, 1fr);--draggable-item-template-rows: var(--size-pos-medium)}:root[data-theme=figma]{--draggable-item-background-color-default: var(--figma-color-bg-default);--draggable-item-background-color-pressed: var(--figma-color-bg-pressed);--draggable-item-background-color-selected: var(--figma-color-bg-selected-default);--draggable-item-gap: var(--size-pos-xxsmall);--draggable-item-ghost-color: var(--figma-color-border-selected-default);--draggable-item-ghost-height: var(--size-pos-xunit);--draggable-item-ghost-inset: var(--size-neg-unit);--draggable-item-padding-bottom: var(--size-pos-xunit);--draggable-item-padding-left: var(--size-pos-xsmall);--draggable-item-padding-right: var(--size-pos-xsmall);--draggable-item-padding-top: var(--size-pos-xunit);--draggable-item-param-width-compact: 112px;--draggable-item-param-width-square: var(--size-pos-medium);--draggable-item-template-columns: repeat(76, 1fr);--draggable-item-template-rows: var(--size-pos-medium)}:root[data-theme=framer]{--draggable-item-background-color-default: var(--framer-color-bg-default);--draggable-item-background-color-pressed: var(--framer-color-bg-secondary);--draggable-item-background-color-selected: var(--framer-color-tint-dimmed);--draggable-item-gap: var(--size-pos-xxsmall);--draggable-item-ghost-color: var(--framer-color-tint-default);--draggable-item-ghost-height: var(--size-pos-xunit);--draggable-item-ghost-inset: var(--size-neg-unit);--draggable-item-padding-bottom: var(--size-pos-xunit);--draggable-item-padding-left: var(--size-pos-xsmall);--draggable-item-padding-right: var(--size-pos-xsmall);--draggable-item-padding-top: var(--size-pos-xunit);--draggable-item-param-width-compact: 112px;--draggable-item-param-width-square: var(--size-pos-medium);--draggable-item-template-columns: repeat(76, 1fr);--draggable-item-template-rows: var(--size-pos-medium)}.draggable-item{display:grid;position:relative;grid-template-rows:var(--draggable-item-template-rows);grid-template-columns:var(--draggable-item-template-columns);background-color:var(--draggable-item-background-color);padding:var(--draggable-item-padding-top) var(--draggable-item-padding-right) var(--draggable-item-padding-bottom) var(--draggable-item-padding-left)}.draggable-item{--draggable-item-background-color: var( --draggable-item-background-color-default )}.draggable-item[draggable=true]{--draggable-item-background-color: var( --draggable-item-background-color-selected );--icon-button-default-background-color-default: var( --icon-button-default-background-color-onselected );--icon-button-default-background-color-hover: var( --icon-button-default-background-color-onselected-hover );--input-background-color-default: var( --input-background-color-onselected-default );--input-border-color-default: var(--input-border-color-onselected-default);--input-border-width-default: var(--input-border-width-onselected-default);--input-border-offset-default: var( --input-border-offset-onselected-default );--input-background-color-default-hover: var( --input-background-color-onselected-hover );--input-border-color-hover: var(--input-border-color-onselected-hover);--input-border-width-hover: var(--input-border-width-onselected-hover);--input-border-offset-hover: var(--input-border-offset-onselected-hover)}.draggable-item[draggable=true]:active{cursor:grabbing}.draggable-item--dragged:active>div{pointer-events:none}.draggable-item--above:before{position:absolute;top:var(--draggable-item-ghost-inset);left:0;z-index:99;background-color:var(--draggable-item-ghost-color);width:100%;height:var(--draggable-item-ghost-height);content:""}.draggable-item--below:before{position:absolute;bottom:var(--draggable-item-ghost-inset);left:0;z-index:99;background-color:var(--draggable-item-ghost-color);width:100%;height:var(--draggable-item-ghost-height);content:""}.draggable-item .draggable-item__primary{display:flex;grid-row:1/1;grid-column:1/77;justify-content:space-between}.draggable-item .draggable-item__left,.draggable-item .draggable-item__right{display:flex;align-items:center;gap:var(--draggable-item-gap);max-width:100%}.draggable-item .draggable-item__param{max-width:100%}.draggable-item .draggable-item__param--compact{width:var(--draggable-item-param-width-compact)}.draggable-item .draggable-item__param--square{display:flex;justify-content:center;align-items:center;width:var(--draggable-item-param-width-square)}.draggable-item .draggable-item__buttons--compact{grid-column:span 4/37}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--draggable-window-background-color: var(--penpot-color-background-primary);--draggable-window-border-color: var(--penpot-color-background-quaternary);--draggable-window-border-offset: var(--size-neg-unit);--draggable-window-border-width: var(--size-pos-unit);--draggable-window-content-gap: var(--size-pos-xxxsmall);--draggable-window-content-padding-bottom: var(--size-pos-xxsmall);--draggable-window-content-padding-left: var(--size-pos-xxsmall);--draggable-window-content-padding-right: var(--size-pos-xxsmall);--draggable-window-content-padding-top: var(--size-pos-xxsmall);--draggable-window-header-border-color: transparent;--draggable-window-header-border-width: var(--size-null);--draggable-window-radius: var(--border-radius-xxlarge);--draggable-window-shadow: none;--draggable-window-width: 320px}:root[data-theme=sketch]{--draggable-window-background-color: var(--sketch-color-background-primary);--draggable-window-border-color: var(--sketch-color-border-primary);--draggable-window-border-offset: var(--size-neg-unit);--draggable-window-border-width: var(--size-pos-unit);--draggable-window-content-gap: var(--size-pos-xxxsmall);--draggable-window-content-padding-bottom: var(--size-pos-xxsmall);--draggable-window-content-padding-left: var(--size-pos-xxsmall);--draggable-window-content-padding-right: var(--size-pos-xxsmall);--draggable-window-content-padding-top: var(--size-pos-xxsmall);--draggable-window-header-border-color: var(--sketch-color-border-disabled);--draggable-window-header-border-width: var(--size-pos-unit);--draggable-window-radius: var(--border-radius-xxxlarge);--draggable-window-shadow: var(--elevation-500-modal-window);--draggable-window-width: 320px}:root[data-theme=figma]{--draggable-window-background-color: var(--figma-color-bg);--draggable-window-border-color: transparent;--draggable-window-border-offset: var(--size-null);--draggable-window-border-width: var(--size-null);--draggable-window-content-gap: var(--size-pos-xxxsmall);--draggable-window-content-padding-bottom: var(--size-pos-xxsmall);--draggable-window-content-padding-left: var(--size-pos-xxsmall);--draggable-window-content-padding-right: var(--size-pos-xxsmall);--draggable-window-content-padding-top: var(--size-pos-xxsmall);--draggable-window-header-border-color: var(--figma-color-border);--draggable-window-header-border-width: var(--size-pos-unit);--draggable-window-radius: var(--border-radius-xxlarge);--draggable-window-shadow: var(--elevation-500-modal-window);--draggable-window-width: 296px}:root[data-theme=framer]{--draggable-window-background-color: var(--framer-color-bg);--draggable-window-border-color: transparent;--draggable-window-border-offset: var(--size-null);--draggable-window-border-width: var(--size-null);--draggable-window-content-gap: var(--size-pos-xxxsmall);--draggable-window-content-padding-bottom: var(--size-pos-xmsmall);--draggable-window-content-padding-left: var(--size-pos-xmsmall);--draggable-window-content-padding-right: var(--size-pos-xmsmall);--draggable-window-content-padding-top: var(--size-pos-xmsmall);--draggable-window-header-border-color: var(--framer-color-divider);--draggable-window-header-border-width: var(--size-pos-unit);--draggable-window-radius: var(--border-radius-xxlarge);--draggable-window-shadow: var(--elevation-500-modal-window);--draggable-window-width: 296px}.draggable-window{position:absolute;z-index:3;outline:var(--draggable-window-border-width) solid var(--draggable-window-border-color);outline-offset:var(--draggable-window-border-offset);box-shadow:var(--draggable-window-shadow);border-radius:var(--draggable-window-radius);background-color:var(--draggable-window-background-color);width:var(--draggable-window-width);max-width:100%}.draggable-window__header{--bar-border: var(--draggable-window-header-border);cursor:move}.draggable-window__header .section-title{pointer-events:none}.draggable-window__content{display:flex;flex-direction:column;gap:var(--draggable-window-content-gap);padding:var(--draggable-window-content-padding-top) var(--draggable-window-content-padding-right) var(--draggable-window-content-padding-bottom) var(--draggable-window-content-padding-left)}
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--draggable-window-background-color: var(--penpot-color-background-primary);--draggable-window-border-color: var(--penpot-color-background-quaternary);--draggable-window-border-offset: var(--size-neg-unit);--draggable-window-border-width: var(--size-pos-unit);--draggable-window-content-gap: var(--size-pos-xxxsmall);--draggable-window-content-padding-bottom: var(--size-pos-xxsmall);--draggable-window-content-padding-left: var(--size-pos-xxsmall);--draggable-window-content-padding-right: var(--size-pos-xxsmall);--draggable-window-content-padding-top: var(--size-pos-xxsmall);--draggable-window-header-border-color: var(--grey-transparent);--draggable-window-header-border-width: var(--size-null);--draggable-window-radius: var(--border-radius-xxlarge);--draggable-window-shadow: none;--draggable-window-width: 320px}:root[data-theme=sketch]{--draggable-window-background-color: var(--sketch-color-background-primary);--draggable-window-border-color: var(--sketch-color-border-primary);--draggable-window-border-offset: var(--size-neg-unit);--draggable-window-border-width: var(--size-pos-unit);--draggable-window-content-gap: var(--size-pos-xxxsmall);--draggable-window-content-padding-bottom: var(--size-pos-xxsmall);--draggable-window-content-padding-left: var(--size-pos-xxsmall);--draggable-window-content-padding-right: var(--size-pos-xxsmall);--draggable-window-content-padding-top: var(--size-pos-xxsmall);--draggable-window-header-border-color: var(--sketch-color-border-disabled);--draggable-window-header-border-width: var(--size-pos-unit);--draggable-window-radius: var(--border-radius-xxxlarge);--draggable-window-shadow: var(--elevation-500-modal-window);--draggable-window-width: 320px}:root[data-theme=figma]{--draggable-window-background-color: var(--figma-color-bg-default);--draggable-window-border-color: var(--grey-transparent);--draggable-window-border-offset: var(--size-null);--draggable-window-border-width: var(--size-null);--draggable-window-content-gap: var(--size-pos-xxxsmall);--draggable-window-content-padding-bottom: var(--size-pos-xxsmall);--draggable-window-content-padding-left: var(--size-pos-xxsmall);--draggable-window-content-padding-right: var(--size-pos-xxsmall);--draggable-window-content-padding-top: var(--size-pos-xxsmall);--draggable-window-header-border-color: var(--figma-color-border-default);--draggable-window-header-border-width: var(--size-pos-unit);--draggable-window-radius: var(--border-radius-xxlarge);--draggable-window-shadow: var(--elevation-500-modal-window);--draggable-window-width: 296px}:root[data-theme=framer]{--draggable-window-background-color: var(--framer-color-bg-default);--draggable-window-border-color: var(--grey-transparent);--draggable-window-border-offset: var(--size-null);--draggable-window-border-width: var(--size-null);--draggable-window-content-gap: var(--size-pos-xxxsmall);--draggable-window-content-padding-bottom: var(--size-pos-xmsmall);--draggable-window-content-padding-left: var(--size-pos-xmsmall);--draggable-window-content-padding-right: var(--size-pos-xmsmall);--draggable-window-content-padding-top: var(--size-pos-xmsmall);--draggable-window-header-border-color: var(--framer-color-divider);--draggable-window-header-border-width: var(--size-pos-unit);--draggable-window-radius: var(--border-radius-xxlarge);--draggable-window-shadow: var(--elevation-500-modal-window);--draggable-window-width: 296px}.draggable-window{position:absolute;z-index:3;outline:var(--draggable-window-border-width) solid var(--draggable-window-border-color);outline-offset:var(--draggable-window-border-offset);box-shadow:var(--draggable-window-shadow);border-radius:var(--draggable-window-radius);background-color:var(--draggable-window-background-color);width:var(--draggable-window-width);max-width:100%}.draggable-window__header{--bar-border: var(--draggable-window-header-border);cursor:move}.draggable-window__header .section-title{pointer-events:none}.draggable-window__content{display:flex;flex-direction:column;gap:var(--draggable-window-content-gap);padding:var(--draggable-window-content-padding-top) var(--draggable-window-content-padding-right) var(--draggable-window-content-padding-bottom) var(--draggable-window-content-padding-left)}
|
package/dist/assets/Drawer.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--drawer-background-color: var(--penpot-color-background-primary);--drawer-border-color: transparent;--drawer-border-style: solid;--drawer-border-width: var(--size-null);--drawer-knob-position: var(--size-neg-xxxsmall);--drawer-knob-size: var(--size-pos-xxsmall)}:root[data-theme=sketch]{--drawer-background-color: var(--sketch-color-background-primary);--drawer-border-color: var(--sketch-color-border-primary);--drawer-border-width: var(--size-pos-unit);--drawer-knob-position: var(--size-neg-xxxsmall);--drawer-knob-size: var(--size-pos-xxsmall)}:root[data-theme=figma]{--drawer-background-color: var(--figma-color-bg);--drawer-border-color: var(--figma-color-border);--drawer-border-width: var(--size-pos-unit);--drawer-knob-position: var(--size-neg-xxxsmall);--drawer-knob-size: var(--size-pos-xxsmall)}:root[data-theme=framer]{--drawer-background-color: var(--framer-color-bg);--drawer-border-color: var(--framer-color-divider);--drawer-border-width: var(--size-pos-unit);--drawer-knob-position: var(--size-neg-xxxsmall);--drawer-knob-size: var(--size-pos-xxsmall)}.drawer{display:flex;position:relative;flex-direction:column;background-color:var(--drawer-background-color);--drawer-border: var(--drawer-border-width) solid var(--drawer-border-color)}.drawer--scrolling{overflow:hidden auto}.drawer__knob{position:absolute;z-index:2;cursor:ns-resize}.drawer__knob--top,.drawer__knob--bottom{cursor:ns-resize;width:100%;height:var(--drawer-knob-size)}.drawer__knob--left,.drawer__knob--right{cursor:ew-resize;width:var(--drawer-knob-size);height:100%}.drawer__knob--top{bottom:var(--drawer-knob-position)}.drawer__knob--right{left:var(--drawer-knob-position)}.drawer__knob--bottom{top:var(--drawer-knob-position)}.drawer__knob--left{right:var(--drawer-knob-position)}
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--drawer-background-color: var(--penpot-color-background-primary);--drawer-border-color: var(--grey-transparent);--drawer-border-style: solid;--drawer-border-width: var(--size-null);--drawer-knob-position: var(--size-neg-xxxsmall);--drawer-knob-size: var(--size-pos-xxsmall)}:root[data-theme=sketch]{--drawer-background-color: var(--sketch-color-background-primary);--drawer-border-color: var(--sketch-color-border-primary);--drawer-border-width: var(--size-pos-unit);--drawer-knob-position: var(--size-neg-xxxsmall);--drawer-knob-size: var(--size-pos-xxsmall)}:root[data-theme=figma]{--drawer-background-color: var(--figma-color-bg-default);--drawer-border-color: var(--figma-color-border-default);--drawer-border-width: var(--size-pos-unit);--drawer-knob-position: var(--size-neg-xxxsmall);--drawer-knob-size: var(--size-pos-xxsmall)}:root[data-theme=framer]{--drawer-background-color: var(--framer-color-bg-default);--drawer-border-color: var(--framer-color-divider);--drawer-border-width: var(--size-pos-unit);--drawer-knob-position: var(--size-neg-xxxsmall);--drawer-knob-size: var(--size-pos-xxsmall)}.drawer{display:flex;position:relative;flex-direction:column;background-color:var(--drawer-background-color);--drawer-border: var(--drawer-border-width) solid var(--drawer-border-color)}.drawer--scrolling{overflow:hidden auto}.drawer__knob{position:absolute;z-index:2;cursor:ns-resize}.drawer__knob--top,.drawer__knob--bottom{cursor:ns-resize;width:100%;height:var(--drawer-knob-size)}.drawer__knob--left,.drawer__knob--right{cursor:ew-resize;width:var(--drawer-knob-size);height:100%}.drawer__knob--top{bottom:var(--drawer-knob-position)}.drawer__knob--right{left:var(--drawer-knob-position)}.drawer__knob--bottom{top:var(--drawer-knob-position)}.drawer__knob--left{right:var(--drawer-knob-position)}
|
package/dist/assets/Dropdown.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--dropdown-background-color-default: var(--penpot-color-background-tertiary);--dropdown-background-color-disabled: var(--penpot-color-background-primary);--dropdown-background-color-focus: var(--penpot-color-background-tertiary);--dropdown-background-color-hover: var(--penpot-color-background-quaternary);--dropdown-background-color-on-selected: var(--penpot-color-background-quaternary);--dropdown-border-color-default: color(srgb 0 0 0 / 0);--dropdown-border-color-disabled: var(--penpot-color-background-quaternary);--dropdown-border-color-focus: var(--penpot-color-accent-primary);--dropdown-border-color-hover: color(srgb 0 0 0 / 0);--dropdown-border-color-on-selected: var(--penpot-color-accent-primary);--dropdown-border-offset-default: var(--size-null);--dropdown-border-offset-disabled: var(--size-pos-unit);--dropdown-border-offset-focus: var(--size-pos-unit);--dropdown-border-offset-hover: var(--size-null);--dropdown-border-width-default: var(--size-null);--dropdown-border-width-disabled: var(--size-pos-unit);--dropdown-border-width-focus: var(--size-pos-unit);--dropdown-border-width-hover: var(--size-null);--dropdown-caret-color-default: var(--penpot-color-icon-default);--dropdown-caret-color-disabled: var(--penpot-color-icon-default);--dropdown-caret-color-focus: var(--penpot-color-icon-default);--dropdown-caret-color-hover: var(--penpot-color-icon-default);--dropdown-caret-height: var(--size-pos-xsmall);--dropdown-caret-width: var(--size-pos-xsmall);--dropdown-gap: var(--size-pos-xxxsmall);--dropdown-height: var(--size-pos-medium);--dropdown-padding-bottom: var(--size-null);--dropdown-padding-left: var(--size-pos-xxsmall);--dropdown-padding-right: var(--size-pos-xxsmall);--dropdown-padding-top: var(--size-null);--dropdown-radius: var(--border-radius-xlarge);--dropdown-status-gap: var(--size-pos-xxsmall);--dropdown-status-height: var(--size-pos-medium);--dropdown-status-margin-bottom: var(--size-null);--dropdown-status-margin-left: var(--size-pos-xxsmall);--dropdown-status-margin-right: var(--size-null);--dropdown-status-margin-top: var(--size-null);--dropdown-text-color-default: var(--penpot-color-foreground-primary);--dropdown-text-color-disabled: var(--penpot-color-foreground-secondary);--dropdown-text-color-focus: var(--penpot-color-foreground-primary);--dropdown-text-color-hover: var(--penpot-color-foreground-primary)}:root[data-theme=sketch]{--dropdown-background-color-default: var(--sketch-color-background-tertiary);--dropdown-background-color-disabled: var(--sketch-color-background-secondary);--dropdown-background-color-focus: var(--sketch-color-background-tertiary);--dropdown-background-color-hover: var(--sketch-color-background-secondary);--dropdown-border-color-default: transparent;--dropdown-border-color-disabled: transparent;--dropdown-border-color-focus: var(--sketch-color-accent-primary);--dropdown-border-color-hover: transparent;--dropdown-border-offset-default: var(--size-null);--dropdown-border-offset-disabled: var(--size-null);--dropdown-border-offset-focus: var(--size-neg-unit);--dropdown-border-offset-hover: var(--size-null);--dropdown-border-width-default: var(--size-null);--dropdown-border-width-disabled: var(--size-null);--dropdown-border-width-focus: var(--size-pos-unit);--dropdown-border-width-hover: var(--size-null);--dropdown-caret-color-default: var(--sketch-color-foreground-tertiary);--dropdown-caret-color-disabled: var(--sketch-color-foreground-disabled);--dropdown-caret-color-focus: var(--sketch-color-foreground-tertiary);--dropdown-caret-color-hover: var(--sketch-color-foreground-tertiary);--dropdown-caret-height: var(--size-pos-xsmall);--dropdown-caret-width: var(--size-pos-xsmall);--dropdown-gap: var(--size-pos-xxxsmall);--dropdown-height: var(--size-pos-medium);--dropdown-padding-bottom: var(--size-pos-xxsmall);--dropdown-padding-left: var(--size-pos-xxsmall);--dropdown-padding-right: var(--size-pos-xxsmall);--dropdown-padding-top: var(--size-pos-xxsmall);--dropdown-radius: var(--border-radius-large);--dropdown-status-gap: var(--size-pos-xxsmall);--dropdown-status-height: var(--size-pos-medium);--dropdown-status-margin-bottom: var(--size-null);--dropdown-status-margin-left: var(--size-pos-xxsmall);--dropdown-status-margin-right: var(--size-null);--dropdown-status-margin-top: var(--size-null);--dropdown-text-color-default: var(--sketch-color-foreground-primary);--dropdown-text-color-disabled: var(--sketch-color-foreground-disabled);--dropdown-text-color-focus: var(--sketch-color-foreground-primary);--dropdown-text-color-hover: var(--sketch-color-foreground-primary)}:root[data-theme=figma]{--dropdown-background-color-default: var(--figma-color-bg);--dropdown-background-color-disabled: var(--figma-color-bg);--dropdown-background-color-focus: var(--figma-color-bg);--dropdown-background-color-hover: var(--figma-color-bg);--dropdown-background-color-on-selected: var(--figma-color-bg-selected);--dropdown-border-color-default: var(--figma-color-border);--dropdown-border-color-disabled: var(--figma-color-border-disabled);--dropdown-border-color-focus: var(--figma-color-border-selected);--dropdown-border-color-hover: var(--figma-color-border);--dropdown-border-color-on-selected: var(--figma-color-bg-selected);--dropdown-border-offset-default: var(--size-neg-unit);--dropdown-border-offset-disabled: var(--size-neg-unit);--dropdown-border-offset-focus: var(--size-neg-unit);--dropdown-border-offset-hover: var(--size-neg-unit);--dropdown-border-width-default: var(--size-pos-unit);--dropdown-border-width-disabled: var(--size-pos-unit);--dropdown-border-width-focus: var(--size-pos-unit);--dropdown-border-width-hover: var(--size-pos-unit);--dropdown-caret-color-default: var(--figma-color-icon);--dropdown-caret-color-disabled: var(--figma-color-icon-disabled);--dropdown-caret-color-focus: var(--figma-color-icon);--dropdown-caret-color-hover: var(--figma-color-icon);--dropdown-caret-height: var(--size-pos-xsmall);--dropdown-caret-width: var(--size-pos-xsmall);--dropdown-gap: var(--size-pos-xxxsmall);--dropdown-height: var(--size-pos-small);--dropdown-padding-bottom: var(--size-null);--dropdown-padding-left: var(--size-pos-xxsmall);--dropdown-padding-right: var(--size-pos-xxxsmall);--dropdown-padding-top: var(--size-null);--dropdown-radius: var(--border-radius-medium);--dropdown-status-gap: var(--size-pos-xxsmall);--dropdown-status-height: var(--size-pos-small);--dropdown-status-margin-bottom: var(--size-null);--dropdown-status-margin-left: var(--size-pos-xxsmall);--dropdown-status-margin-right: var(--size-null);--dropdown-status-margin-top: var(--size-null);--dropdown-text-color-default: var(--figma-color-text);--dropdown-text-color-disabled: var(--figma-color-text-disabled);--dropdown-text-color-focus: var(--figma-color-text);--dropdown-text-color-hover: var(--figma-color-text)}:root[data-theme=framer]{--dropdown-background-color-default: var(--framer-color-bg-secondary);--dropdown-background-color-disabled: var(--framer-color-bg-tertiary);--dropdown-background-color-focus: var(--framer-color-bg-secondary);--dropdown-background-color-hover: var(--framer-color-bg-tertiary);--dropdown-background-color-on-selected: var(--framer-color-bg-secondary);--dropdown-border-color-default: transparent;--dropdown-border-color-disabled: transparent;--dropdown-border-color-focus: var(--framer-color-tint);--dropdown-border-color-hover: transparent;--dropdown-border-color-on-selected: transparent;--dropdown-border-offset-default: var(--size-null);--dropdown-border-offset-disabled: var(--size-null);--dropdown-border-offset-focus: var(--size-neg-unit);--dropdown-border-offset-hover: var(--size-null);--dropdown-border-width-default: var(--size-null);--dropdown-border-width-disabled: var(--size-null);--dropdown-border-width-focus: var(--size-pos-unit);--dropdown-border-width-hover: var(--size-null);--dropdown-caret-color-default: var(--framer-color-text-tertiary);--dropdown-caret-color-disabled: var(--framer-color-text-tertiary);--dropdown-caret-color-focus: var(--framer-color-text-tertiary);--dropdown-caret-color-hover: var(--framer-color-text-tertiary);--dropdown-caret-height: var(--size-pos-xsmall);--dropdown-caret-width: var(--size-pos-xsmall);--dropdown-gap: var(--size-pos-xxsmall);--dropdown-height: var(--size-pos-medium);--dropdown-padding-bottom: var(--size-null);--dropdown-padding-left: var(--size-pos-xxsmall);--dropdown-padding-right: var(--size-pos-xxxsmall);--dropdown-padding-top: var(--size-null);--dropdown-radius: var(--border-radius-xlarge);--dropdown-status-gap: var(--size-pos-xxsmall);--dropdown-status-height: var(--size-pos-medium);--dropdown-status-margin-bottom: var(--size-null);--dropdown-status-margin-left: var(--size-pos-xxsmall);--dropdown-status-margin-right: var(--size-null);--dropdown-status-margin-top: var(--size-null);--dropdown-text-color-default: var(--framer-color-text);--dropdown-text-color-disabled: var(--framer-color-text-tertiary);--dropdown-text-color-focus: var(--framer-color-text);--dropdown-text-color-hover: var(--framer-color-text)}.select-menu{display:flex;position:relative;align-items:center;cursor:default;-webkit-user-select:none;user-select:none}.select-menu.select-menu--right{justify-content:end}.select-menu.select-menu--left{justify-content:start}.select-menu.select-menu--fill{justify-content:stretch}.select-menu.select-menu--fill .select-menu__button{justify-content:space-between;width:100%}.select-menu .select-menu__button{display:flex;position:relative;align-items:center;gap:var(--dropdown-gap);outline:var(--dropdown-border-width) solid var(--dropdown-border-color);outline-offset:var(--dropdown-border-offset);border:none;border-radius:var(--dropdown-radius);background-color:var(--dropdown-background-color);padding:var(--dropdown-padding-top) var(--dropdown-padding-right) var(--dropdown-padding-bottom) var(--dropdown-padding-left);width:auto;max-width:100%;height:var(--dropdown-height)}.select-menu .select-menu__button{--dropdown-background-color: var(--dropdown-background-color-default);--dropdown-border-color: var(--dropdown-border-color-default);--dropdown-border-width: var(--dropdown-border-width-default);--dropdown-border-offset: var(--dropdown-border-offset-default);--dropdown-caret-color: var(--dropdown-caret-color-default);--dropdown-text-color: var(--dropdown-text-color-default)}.select-menu .select-menu__button:hover{--dropdown-background-color: var(--dropdown-background-color-hover);--dropdown-border-color: var(--dropdown-border-color-hover);--dropdown-border-width: var(--dropdown-border-width-hover);--dropdown-border-offset: var(--dropdown-border-offset-hover);--dropdown-caret-color: var(--dropdown-caret-color-hover);--dropdown-text-color: var(--dropdown-text-color-hover)}.select-menu .select-menu__button:focus{--dropdown-background-color: var(--dropdown-background-color-focus);--dropdown-border-color: var(--dropdown-border-color-focus);--dropdown-border-width: var(--dropdown-border-width-focus);--dropdown-border-offset: var(--dropdown-border-offset-focus);--dropdown-caret-color: var(--dropdown-caret-color-focus);--dropdown-text-color: var(--dropdown-text-color-focus)}.select-menu .select-menu__button:disabled{--dropdown-background-color: var(--dropdown-background-color-disabled);--dropdown-border-color: var(--dropdown-border-color-disabled);--dropdown-border-width: var(--dropdown-border-width-disabled);--dropdown-border-offset: var(--dropdown-border-offset-disabled);--dropdown-caret-color: var(--dropdown-caret-color-disabled);--dropdown-text-color: var(--dropdown-text-color-disabled)}.select-menu .select-menu__label{--text-color-primary: var(--dropdown-text-color);pointer-events:none}.select-menu .select-menu__item-label{flex:1}.select-menu .select-menu__caret{display:flex;justify-content:center;align-items:center;width:var(--dropdown-caret-width);height:var(--dropdown-caret-width);pointer-events:none;--icon-picto-color: var(--dropdown-caret-color)}.select-menu .select-menu__status{display:flex;align-items:center;gap:var(--dropdown-status-gap);margin:var(--dropdown-status-margin-top) var(--dropdown-status-margin-right) var(--dropdown-status-margin-bottom) var(--dropdown-status-margin-left);height:var(--dropdown-status-height)}.floating-menu .select-menu__menu{position:relative}
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--dropdown-background-color-default: var(--penpot-color-background-tertiary);--dropdown-background-color-disabled: var(--penpot-color-background-primary);--dropdown-background-color-focus: var(--penpot-color-background-tertiary);--dropdown-background-color-hover: var(--penpot-color-background-quaternary);--dropdown-background-color-on-selected: var(--penpot-color-background-quaternary);--dropdown-border-color-default: var(--grey-transparent);--dropdown-border-color-disabled: var(--penpot-color-background-quaternary);--dropdown-border-color-focus: var(--penpot-color-accent-primary-default);--dropdown-border-color-hover: var(--grey-transparent);--dropdown-border-color-on-selected: var(--penpot-color-accent-primary-default);--dropdown-border-offset-default: var(--size-null);--dropdown-border-offset-disabled: var(--size-pos-unit);--dropdown-border-offset-focus: var(--size-pos-unit);--dropdown-border-offset-hover: var(--size-null);--dropdown-border-width-default: var(--size-null);--dropdown-border-width-disabled: var(--size-pos-unit);--dropdown-border-width-focus: var(--size-pos-unit);--dropdown-border-width-hover: var(--size-null);--dropdown-caret-color-default: var(--penpot-color-icon-default);--dropdown-caret-color-disabled: var(--penpot-color-icon-default);--dropdown-caret-color-focus: var(--penpot-color-icon-default);--dropdown-caret-color-hover: var(--penpot-color-icon-default);--dropdown-caret-height: var(--size-pos-xsmall);--dropdown-caret-width: var(--size-pos-xsmall);--dropdown-gap: var(--size-pos-xxxsmall);--dropdown-height: var(--size-pos-medium);--dropdown-padding-bottom: var(--size-null);--dropdown-padding-left: var(--size-pos-xxsmall);--dropdown-padding-right: var(--size-pos-xxsmall);--dropdown-padding-top: var(--size-null);--dropdown-radius: var(--border-radius-xlarge);--dropdown-status-gap: var(--size-pos-xxsmall);--dropdown-status-height: var(--size-pos-medium);--dropdown-status-margin-bottom: var(--size-null);--dropdown-status-margin-left: var(--size-pos-xxsmall);--dropdown-status-margin-right: var(--size-null);--dropdown-status-margin-top: var(--size-null);--dropdown-text-color-default: var(--penpot-color-foreground-primary);--dropdown-text-color-disabled: var(--penpot-color-foreground-secondary);--dropdown-text-color-focus: var(--penpot-color-foreground-primary);--dropdown-text-color-hover: var(--penpot-color-foreground-primary)}:root[data-theme=sketch]{--dropdown-background-color-default: var(--sketch-color-background-tertiary);--dropdown-background-color-disabled: var(--sketch-color-background-secondary);--dropdown-background-color-focus: var(--sketch-color-background-tertiary);--dropdown-background-color-hover: var(--sketch-color-background-secondary);--dropdown-background-color-on-selected: var(--sketch-color-accent-tertiary);--dropdown-border-color-default: var(--grey-transparent);--dropdown-border-color-disabled: var(--grey-transparent);--dropdown-border-color-focus: var(--sketch-color-accent-primary);--dropdown-border-color-hover: var(--grey-transparent);--dropdown-border-color-on-selected: var(--sketch-color-accent-primary);--dropdown-border-offset-default: var(--size-null);--dropdown-border-offset-disabled: var(--size-null);--dropdown-border-offset-focus: var(--size-neg-unit);--dropdown-border-offset-hover: var(--size-null);--dropdown-border-width-default: var(--size-null);--dropdown-border-width-disabled: var(--size-null);--dropdown-border-width-focus: var(--size-pos-unit);--dropdown-border-width-hover: var(--size-null);--dropdown-caret-color-default: var(--sketch-color-foreground-tertiary);--dropdown-caret-color-disabled: var(--sketch-color-foreground-disabled);--dropdown-caret-color-focus: var(--sketch-color-foreground-tertiary);--dropdown-caret-color-hover: var(--sketch-color-foreground-tertiary);--dropdown-caret-height: var(--size-pos-xsmall);--dropdown-caret-width: var(--size-pos-xsmall);--dropdown-gap: var(--size-pos-xxxsmall);--dropdown-height: var(--size-pos-medium);--dropdown-padding-bottom: var(--size-pos-xxsmall);--dropdown-padding-left: var(--size-pos-xxsmall);--dropdown-padding-right: var(--size-pos-xxsmall);--dropdown-padding-top: var(--size-pos-xxsmall);--dropdown-radius: var(--border-radius-large);--dropdown-status-gap: var(--size-pos-xxsmall);--dropdown-status-height: var(--size-pos-medium);--dropdown-status-margin-bottom: var(--size-null);--dropdown-status-margin-left: var(--size-pos-xxsmall);--dropdown-status-margin-right: var(--size-null);--dropdown-status-margin-top: var(--size-null);--dropdown-text-color-default: var(--sketch-color-foreground-primary);--dropdown-text-color-disabled: var(--sketch-color-foreground-disabled);--dropdown-text-color-focus: var(--sketch-color-foreground-primary);--dropdown-text-color-hover: var(--sketch-color-foreground-primary)}:root[data-theme=figma]{--dropdown-background-color-default: var(--figma-color-bg-default);--dropdown-background-color-disabled: var(--figma-color-bg-default);--dropdown-background-color-focus: var(--figma-color-bg-default);--dropdown-background-color-hover: var(--figma-color-bg-default);--dropdown-background-color-on-selected: var(--figma-color-bg-selected-default);--dropdown-border-color-default: var(--figma-color-border-default);--dropdown-border-color-disabled: var(--figma-color-border-disabled-default);--dropdown-border-color-focus: var(--figma-color-border-selected-default);--dropdown-border-color-hover: var(--figma-color-border-default);--dropdown-border-color-on-selected: var(--figma-color-bg-selected-default);--dropdown-border-offset-default: var(--size-neg-unit);--dropdown-border-offset-disabled: var(--size-neg-unit);--dropdown-border-offset-focus: var(--size-neg-unit);--dropdown-border-offset-hover: var(--size-neg-unit);--dropdown-border-width-default: var(--size-pos-unit);--dropdown-border-width-disabled: var(--size-pos-unit);--dropdown-border-width-focus: var(--size-pos-unit);--dropdown-border-width-hover: var(--size-pos-unit);--dropdown-caret-color-default: var(--figma-color-icon-default);--dropdown-caret-color-disabled: var(--figma-color-icon-disabled);--dropdown-caret-color-focus: var(--figma-color-icon-default);--dropdown-caret-color-hover: var(--figma-color-icon-default);--dropdown-caret-height: var(--size-pos-xsmall);--dropdown-caret-width: var(--size-pos-xsmall);--dropdown-gap: var(--size-pos-xxxsmall);--dropdown-height: var(--size-pos-small);--dropdown-padding-bottom: var(--size-null);--dropdown-padding-left: var(--size-pos-xxsmall);--dropdown-padding-right: var(--size-pos-xxxsmall);--dropdown-padding-top: var(--size-null);--dropdown-radius: var(--border-radius-medium);--dropdown-status-gap: var(--size-pos-xxsmall);--dropdown-status-height: var(--size-pos-small);--dropdown-status-margin-bottom: var(--size-null);--dropdown-status-margin-left: var(--size-pos-xxsmall);--dropdown-status-margin-right: var(--size-null);--dropdown-status-margin-top: var(--size-null);--dropdown-text-color-default: var(--figma-color-text-default);--dropdown-text-color-disabled: var(--figma-color-text-disabled);--dropdown-text-color-focus: var(--figma-color-text-default);--dropdown-text-color-hover: var(--figma-color-text-default)}:root[data-theme=framer]{--dropdown-background-color-default: var(--framer-color-bg-secondary);--dropdown-background-color-disabled: var(--framer-color-bg-tertiary);--dropdown-background-color-focus: var(--framer-color-bg-secondary);--dropdown-background-color-hover: var(--framer-color-bg-tertiary);--dropdown-background-color-on-selected: var(--framer-color-bg-secondary);--dropdown-border-color-default: var(--grey-transparent);--dropdown-border-color-disabled: var(--grey-transparent);--dropdown-border-color-focus: var(--framer-color-tint-default);--dropdown-border-color-hover: var(--grey-transparent);--dropdown-border-color-on-selected: var(--grey-transparent);--dropdown-border-offset-default: var(--size-null);--dropdown-border-offset-disabled: var(--size-null);--dropdown-border-offset-focus: var(--size-neg-unit);--dropdown-border-offset-hover: var(--size-null);--dropdown-border-width-default: var(--size-null);--dropdown-border-width-disabled: var(--size-null);--dropdown-border-width-focus: var(--size-pos-unit);--dropdown-border-width-hover: var(--size-null);--dropdown-caret-color-default: var(--framer-color-text-tertiary);--dropdown-caret-color-disabled: var(--framer-color-text-tertiary);--dropdown-caret-color-focus: var(--framer-color-text-tertiary);--dropdown-caret-color-hover: var(--framer-color-text-tertiary);--dropdown-caret-height: var(--size-pos-xsmall);--dropdown-caret-width: var(--size-pos-xsmall);--dropdown-gap: var(--size-pos-xxsmall);--dropdown-height: var(--size-pos-medium);--dropdown-padding-bottom: var(--size-null);--dropdown-padding-left: var(--size-pos-xxsmall);--dropdown-padding-right: var(--size-pos-xxxsmall);--dropdown-padding-top: var(--size-null);--dropdown-radius: var(--border-radius-xlarge);--dropdown-status-gap: var(--size-pos-xxsmall);--dropdown-status-height: var(--size-pos-medium);--dropdown-status-margin-bottom: var(--size-null);--dropdown-status-margin-left: var(--size-pos-xxsmall);--dropdown-status-margin-right: var(--size-null);--dropdown-status-margin-top: var(--size-null);--dropdown-text-color-default: var(--framer-color-text-default);--dropdown-text-color-disabled: var(--framer-color-text-tertiary);--dropdown-text-color-focus: var(--framer-color-text-default);--dropdown-text-color-hover: var(--framer-color-text-default)}.select-menu{display:flex;position:relative;align-items:center;cursor:default;-webkit-user-select:none;user-select:none}.select-menu.select-menu--right{justify-content:end}.select-menu.select-menu--left{justify-content:start}.select-menu.select-menu--fill{justify-content:stretch}.select-menu.select-menu--fill .select-menu__button{justify-content:space-between;width:100%}.select-menu .select-menu__button{display:flex;position:relative;align-items:center;gap:var(--dropdown-gap);outline:var(--dropdown-border-width) solid var(--dropdown-border-color);outline-offset:var(--dropdown-border-offset);border:none;border-radius:var(--dropdown-radius);background-color:var(--dropdown-background-color);padding:var(--dropdown-padding-top) var(--dropdown-padding-right) var(--dropdown-padding-bottom) var(--dropdown-padding-left);width:auto;max-width:100%;height:var(--dropdown-height)}.select-menu .select-menu__button{--dropdown-background-color: var(--dropdown-background-color-default);--dropdown-border-color: var(--dropdown-border-color-default);--dropdown-border-width: var(--dropdown-border-width-default);--dropdown-border-offset: var(--dropdown-border-offset-default);--dropdown-caret-color: var(--dropdown-caret-color-default);--dropdown-text-color: var(--dropdown-text-color-default)}.select-menu .select-menu__button:hover{--dropdown-background-color: var(--dropdown-background-color-hover);--dropdown-border-color: var(--dropdown-border-color-hover);--dropdown-border-width: var(--dropdown-border-width-hover);--dropdown-border-offset: var(--dropdown-border-offset-hover);--dropdown-caret-color: var(--dropdown-caret-color-hover);--dropdown-text-color: var(--dropdown-text-color-hover)}.select-menu .select-menu__button:focus{--dropdown-background-color: var(--dropdown-background-color-focus);--dropdown-border-color: var(--dropdown-border-color-focus);--dropdown-border-width: var(--dropdown-border-width-focus);--dropdown-border-offset: var(--dropdown-border-offset-focus);--dropdown-caret-color: var(--dropdown-caret-color-focus);--dropdown-text-color: var(--dropdown-text-color-focus)}.select-menu .select-menu__button:disabled{--dropdown-background-color: var(--dropdown-background-color-disabled);--dropdown-border-color: var(--dropdown-border-color-disabled);--dropdown-border-width: var(--dropdown-border-width-disabled);--dropdown-border-offset: var(--dropdown-border-offset-disabled);--dropdown-caret-color: var(--dropdown-caret-color-disabled);--dropdown-text-color: var(--dropdown-text-color-disabled)}.select-menu .select-menu__label{--text-color-primary: var(--dropdown-text-color);pointer-events:none}.select-menu .select-menu__item-label{flex:1}.select-menu .select-menu__caret{display:flex;justify-content:center;align-items:center;width:var(--dropdown-caret-width);height:var(--dropdown-caret-width);pointer-events:none;--icon-picto-color: var(--dropdown-caret-color)}.select-menu .select-menu__status{display:flex;align-items:center;gap:var(--dropdown-status-gap);margin:var(--dropdown-status-margin-top) var(--dropdown-status-margin-right) var(--dropdown-status-margin-bottom) var(--dropdown-status-margin-left);height:var(--dropdown-status-height)}.floating-menu .select-menu__menu{position:relative}
|
package/dist/assets/Dropzone.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--dropzone-background-color-default: var(--penpot-color-background-primary);--dropzone-background-color-disabled: var(--penpot-color-background-secondary);--dropzone-background-color-
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--dropzone-background-color-default: var(--penpot-color-background-primary);--dropzone-background-color-disabled: var(--penpot-color-background-secondary);--dropzone-background-color-hover: var(--penpot-color-accent-primary-muted);--dropzone-border-color-default: var(--penpot-color-background-quaternary);--dropzone-border-color-disabled: var(--penpot-color-background-tertiary);--dropzone-border-color-hover: var(--penpot-color-accent-primary-default);--dropzone-border-offset-default: var(--size-neg-unit);--dropzone-border-offset-disabled: var(--size-neg-unit);--dropzone-border-offset-hover: var(--size-neg-xunit);--dropzone-border-style-default: dashed;--dropzone-border-style-disabled: dashed;--dropzone-border-style-hover: solid;--dropzone-border-width-default: var(--size-pos-unit);--dropzone-border-width-disabled: var(--size-pos-unit);--dropzone-border-width-hover: var(--size-pos-xunit);--dropzone-gap: var(--size-pos-xxsmall);--dropzone-min-height: 200px;--dropzone-min-width: 200px;--dropzone-padding-bottom: var(--size-pos-small);--dropzone-padding-left: var(--size-pos-small);--dropzone-padding-right: var(--size-pos-small);--dropzone-padding-top: var(--size-pos-small);--dropzone-radius: var(--border-radius-medium)}:root[data-theme=sketch]{--dropzone-background-color-default: var(--sketch-color-background-primary);--dropzone-background-color-disabled: var(--sketch-color-background-disabled);--dropzone-background-color-hover: var(--sketch-color-accent-disabled);--dropzone-border-color-default: var(--sketch-color-border-secondary);--dropzone-border-color-disabled: var(--sketch-color-border-disabled);--dropzone-border-color-hover: var(--sketch-color-accent-primary);--dropzone-border-offset-default: var(--size-neg-unit);--dropzone-border-offset-disabled: var(--size-neg-unit);--dropzone-border-offset-hover: var(--size-neg-xunit);--dropzone-border-style-default: dashed;--dropzone-border-style-disabled: dashed;--dropzone-border-style-hover: solid;--dropzone-border-width-default: var(--size-pos-unit);--dropzone-border-width-disabled: var(--size-pos-unit);--dropzone-border-width-hover: var(--size-pos-xunit);--dropzone-gap: var(--size-pos-xxsmall);--dropzone-min-height: 200px;--dropzone-min-width: 200px;--dropzone-padding-bottom: var(--size-pos-small);--dropzone-padding-left: var(--size-pos-small);--dropzone-padding-right: var(--size-pos-small);--dropzone-padding-top: var(--size-pos-small);--dropzone-radius: var(--border-radius-medium)}:root[data-theme=figma]{--dropzone-background-color-default: var(--figma-color-bg-default);--dropzone-background-color-disabled: var(--figma-color-bg-secondary);--dropzone-background-color-hover: var(--figma-color-bg-selected-default);--dropzone-border-color-default: var(--figma-color-border-default);--dropzone-border-color-disabled: var(--figma-color-border-disabled-default);--dropzone-border-color-hover: var(--figma-color-border-selected-default);--dropzone-border-offset-default: var(--size-neg-unit);--dropzone-border-offset-disabled: var(--size-neg-unit);--dropzone-border-offset-hover: var(--size-neg-xunit);--dropzone-border-style-default: dashed;--dropzone-border-style-disabled: dashed;--dropzone-border-style-hover: solid;--dropzone-border-width-default: var(--size-pos-unit);--dropzone-border-width-disabled: var(--size-pos-unit);--dropzone-border-width-hover: var(--size-pos-xunit);--dropzone-gap: var(--size-pos-xxsmall);--dropzone-min-height: 200px;--dropzone-min-width: 200px;--dropzone-padding-bottom: var(--size-pos-small);--dropzone-padding-left: var(--size-pos-small);--dropzone-padding-right: var(--size-pos-small);--dropzone-padding-top: var(--size-pos-small);--dropzone-radius: var(--border-radius-medium)}:root[data-theme=framer]{--dropzone-background-color-default: var(--framer-color-bg-default);--dropzone-background-color-disabled: var(--framer-color-bg-secondary);--dropzone-background-color-hover: var(--framer-color-tint-dimmed);--dropzone-border-color-default: var(--framer-color-divider);--dropzone-border-color-disabled: var(--framer-color-bg-tertiary);--dropzone-border-color-hover: var(--framer-color-tint-default);--dropzone-border-offset-default: var(--size-neg-unit);--dropzone-border-offset-disabled: var(--size-neg-unit);--dropzone-border-offset-hover: var(--size-neg-xunit);--dropzone-border-style-default: dashed;--dropzone-border-style-disabled: dashed;--dropzone-border-style-hover: solid;--dropzone-border-width-default: var(--size-pos-unit);--dropzone-border-width-disabled: var(--size-pos-unit);--dropzone-border-width-hover: var(--size-pos-xunit);--dropzone-gap: var(--size-pos-xxsmall);--dropzone-min-height: 200px;--dropzone-min-width: 200px;--dropzone-padding-bottom: var(--size-pos-small);--dropzone-padding-left: var(--size-pos-small);--dropzone-padding-right: var(--size-pos-small);--dropzone-padding-top: var(--size-pos-small);--dropzone-radius: var(--border-radius-xlarge)}.dropzone{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--dropzone-gap);cursor:default;outline:var(--dropzone-border-width) var(--dropzone-border-style) var(--dropzone-border-color);outline-offset:var(--dropzone-border-offset);border-radius:var(--dropzone-radius);background-color:var(--dropzone-background-color);padding:var(--dropzone-padding-top) var(--dropzone-padding-right) var(--dropzone-padding-bottom) var(--dropzone-padding-left);-webkit-user-select:none;user-select:none}.dropzone{--dropzone-border-color: var(--dropzone-border-color-default);--dropzone-border-width: var(--dropzone-border-width-default);--dropzone-border-offset: var(--dropzone-border-offset-default);--dropzone-border-style: var(--dropzone-border-style-default);--dropzone-background-color: var(--dropzone-background-color-default)}.dropzone--dragged-over{--semantic-message-background-color: var(--dropzone-background-color-hover);--dropzone-border-width: var(--dropzone-border-width-hover);--dropzone-border-offset: var(--dropzone-border-offset-hover);--dropzone-border-style: var(--dropzone-border-style-hover);--dropzone-border-color: var(--dropzone-border-color-hover);--dropzone-background-color: var(--dropzone-background-color-hover)}.dropzone--disabled{cursor:not-allowed;pointer-events:none;--semantic-message-background-color: var( --dropzone-background-color-disabled );--dropzone-border-width: var(--dropzone-border-width-disabled);--dropzone-border-offset: var(--dropzone-border-offset-disabled);--dropzone-border-style: var(--dropzone-border-style-disabled);--dropzone-border-color: var(--dropzone-border-color-disabled);--dropzone-background-color: var(--dropzone-background-color-disabled)}
|
package/dist/assets/FormItem.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--form-item-chip-margin-default-bottom: var(--size-null);--form-item-chip-margin-default-left: var(--size-null);--form-item-chip-margin-default-right: var(--size-null);--form-item-chip-margin-default-top: var(--size-pos-xunit);--form-item-chip-margin-multiline-bottom: var(--size-null);--form-item-chip-margin-multiline-left: var(--size-null);--form-item-chip-margin-multiline-right: var(--size-null);--form-item-chip-margin-multiline-top: var(--size-pos-xunit);--form-item-gap: var(--size-pos-xxsmall);--form-item-helper-padding-bottom: var(--size-null);--form-item-helper-padding-left: var(--size-pos-xxsmall);--form-item-helper-padding-right: var(--size-pos-xxsmall);--form-item-helper-padding-top: var(--size-null);--form-item-icon-color-disabled: var(--penpot-color-foreground-disabled);--form-item-label-margin-default-bottom: var(--size-null);--form-item-label-margin-default-left: var(--size-null);--form-item-label-margin-default-right: var(--size-null);--form-item-label-margin-default-top: var(--size-pos-xxsmall);--form-item-label-margin-multiline-bottom: var(--size-null);--form-item-label-margin-multiline-left: var(--size-null);--form-item-label-margin-multiline-right: var(--size-null);--form-item-label-margin-multiline-top: var(--size-pos-xxsmall);--form-item-label-width: 112px;--form-item-min-
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--form-item-chip-margin-default-bottom: var(--size-null);--form-item-chip-margin-default-left: var(--size-null);--form-item-chip-margin-default-right: var(--size-null);--form-item-chip-margin-default-top: var(--size-pos-xunit);--form-item-chip-margin-multiline-bottom: var(--size-null);--form-item-chip-margin-multiline-left: var(--size-null);--form-item-chip-margin-multiline-right: var(--size-null);--form-item-chip-margin-multiline-top: var(--size-pos-xunit);--form-item-gap: var(--size-pos-xxsmall);--form-item-helper-padding-bottom: var(--size-null);--form-item-helper-padding-left: var(--size-pos-xxsmall);--form-item-helper-padding-right: var(--size-pos-xxsmall);--form-item-helper-padding-top: var(--size-null);--form-item-icon-color-disabled: var(--penpot-color-foreground-disabled);--form-item-label-margin-default-bottom: var(--size-null);--form-item-label-margin-default-left: var(--size-null);--form-item-label-margin-default-right: var(--size-null);--form-item-label-margin-default-top: var(--size-pos-xxsmall);--form-item-label-margin-multiline-bottom: var(--size-null);--form-item-label-margin-multiline-left: var(--size-null);--form-item-label-margin-multiline-right: var(--size-null);--form-item-label-margin-multiline-top: var(--size-pos-xxsmall);--form-item-label-width: 112px;--form-item-min-height: var(--size-pos-medium);--form-item-padding-bottom: var(--size-pos-xxxsmall);--form-item-padding-left: var(--size-pos-xxsmall);--form-item-padding-right: var(--size-null);--form-item-padding-top: var(--size-pos-xxxsmall);--form-item-text-color-default: var(--penpot-color-foreground-primary);--form-item-text-color-disabled: var(--penpot-color-foreground-disabled)}:root[data-theme=sketch]{--form-item-chip-margin-default-bottom: var(--size-null);--form-item-chip-margin-default-left: var(--size-null);--form-item-chip-margin-default-right: var(--size-null);--form-item-chip-margin-default-top: 6px;--form-item-chip-margin-multiline-bottom: var(--size-null);--form-item-chip-margin-multiline-left: var(--size-null);--form-item-chip-margin-multiline-right: var(--size-null);--form-item-chip-margin-multiline-top: 6px;--form-item-gap: var(--size-pos-xxsmall);--form-item-helper-padding-bottom: var(--size-null);--form-item-helper-padding-left: var(--size-pos-xxsmall);--form-item-helper-padding-right: var(--size-pos-xxsmall);--form-item-helper-padding-top: var(--size-null);--form-item-icon-color-disabled: var(--sketch-color-foreground-disabled);--form-item-label-margin-default-bottom: var(--size-null);--form-item-label-margin-default-left: var(--size-null);--form-item-label-margin-default-right: var(--size-null);--form-item-label-margin-default-top: var(--size-pos-xxsmall);--form-item-label-margin-multiline-bottom: var(--size-null);--form-item-label-margin-multiline-left: var(--size-null);--form-item-label-margin-multiline-right: var(--size-null);--form-item-label-margin-multiline-top: var(--size-pos-xxsmall);--form-item-label-width: 120px;--form-item-min-height: var(--size-pos-medium);--form-item-padding-bottom: var(--size-pos-xxxsmall);--form-item-padding-left: var(--size-pos-xxsmall);--form-item-padding-right: var(--size-null);--form-item-padding-top: var(--size-pos-xxxsmall);--form-item-text-color-default: var(--sketch-color-foreground-primary);--form-item-text-color-disabled: var(--sketch-color-foreground-disabled)}:root[data-theme=figma]{--form-item-chip-margin-default-bottom: var(--size-null);--form-item-chip-margin-default-left: var(--size-null);--form-item-chip-margin-default-right: var(--size-null);--form-item-chip-margin-default-top: var(--size-pos-xunit);--form-item-chip-margin-multiline-bottom: var(--size-null);--form-item-chip-margin-multiline-left: var(--size-null);--form-item-chip-margin-multiline-right: var(--size-null);--form-item-chip-margin-multiline-top: var(--size-pos-xunit);--form-item-gap: var(--size-pos-xxsmall);--form-item-helper-padding-bottom: var(--size-null);--form-item-helper-padding-left: var(--size-pos-xxxsmall);--form-item-helper-padding-right: var(--size-pos-xxxsmall);--form-item-helper-padding-top: var(--size-null);--form-item-icon-color-disabled: var(--figma-color-icon-disabled);--form-item-label-margin-default-bottom: var(--size-null);--form-item-label-margin-default-left: var(--size-null);--form-item-label-margin-default-right: var(--size-null);--form-item-label-margin-default-top: var(--size-pos-xxxsmall);--form-item-label-margin-multiline-bottom: var(--size-null);--form-item-label-margin-multiline-left: var(--size-null);--form-item-label-margin-multiline-right: var(--size-null);--form-item-label-margin-multiline-top: var(--size-pos-xxsmall);--form-item-label-width: var(--size-pos-huge);--form-item-min-height: var(--size-pos-small);--form-item-padding-bottom: var(--size-pos-xunit);--form-item-padding-left: var(--size-pos-xxsmall);--form-item-padding-right: var(--size-null);--form-item-padding-top: var(--size-pos-xunit);--form-item-text-color-default: var(--figma-color-text-default);--form-item-text-color-disabled: var(--figma-color-text-disabled)}:root[data-theme=framer]{--form-item-chip-margin-default-bottom: var(--size-null);--form-item-chip-margin-default-left: var(--size-null);--form-item-chip-margin-default-right: var(--size-null);--form-item-chip-margin-default-top: 6px;--form-item-chip-margin-multiline-bottom: var(--size-null);--form-item-chip-margin-multiline-left: var(--size-null);--form-item-chip-margin-multiline-right: var(--size-null);--form-item-chip-margin-multiline-top: var(--size-pos-xunit);--form-item-gap: var(--size-pos-xxsmall);--form-item-helper-padding-bottom: var(--size-null);--form-item-helper-padding-left: var(--size-pos-xxxsmall);--form-item-helper-padding-right: var(--size-pos-xxxsmall);--form-item-helper-padding-top: var(--size-null);--form-item-icon-color-disabled: var(--framer-color-text-tertiary);--form-item-label-margin-default-bottom: var(--size-null);--form-item-label-margin-default-left: var(--size-null);--form-item-label-margin-default-right: var(--size-null);--form-item-label-margin-default-top: var(--size-pos-xxsmall);--form-item-label-margin-multiline-bottom: var(--size-null);--form-item-label-margin-multiline-left: var(--size-null);--form-item-label-margin-multiline-right: var(--size-null);--form-item-label-margin-multiline-top: var(--size-pos-xxsmall);--form-item-label-width: var(--size-pos-huge);--form-item-min-height: var(--size-pos-medium);--form-item-padding-bottom: var(--size-pos-xunit);--form-item-padding-left: var(--size-pos-xxsmall);--form-item-padding-right: var(--size-null);--form-item-padding-top: var(--size-pos-xunit);--form-item-text-color-default: var(--framer-color-text-default);--form-item-text-color-disabled: var(--framer-color-text-tertiary)}.form-item{display:flex;flex-direction:column;--text-color-primary: var(--form-item-text-color-default);--message-padding: var(--form-item-helper-padding-top) var(--form-item-helper-padding-left) var(--form-item-helper-padding-bottom) var(--form-item-helper-padding-right)}.form-item__row{display:inline-flex;position:relative;align-items:start;gap:var(--form-item-gap);cursor:default;padding:var(--form-item-padding-top) var(--form-item-padding-right) var(--form-item-padding-bottom) var(--form-item-padding-left);min-width:var(--form-item-min-width);-webkit-user-select:none;user-select:none}.form-item__row .form-item__label{margin:var(--form-item-label-margin)}.form-item__row .form-item__chip{margin:var(--form-item-chip-margin)}.form-item{--form-item-label-margin: var(--form-item-label-margin-default-top) var(--form-item-label-margin-default-right) var(--form-item-label-margin-default-bottom) var(--form-item-label-margin-default-left);--form-item-chip-margin: var(--form-item-chip-margin-default-top) var(--form-item-chip-margin-default-right) var(--form-item-chip-margin-default-bottom) var(--form-item-chip-margin-default-left)}.form-item--multiline{--form-item-label-margin: var(--form-item-label-margin-multiline-top) var(--form-item-label-margin-multiline-right) var(--form-item-label-margin-multiline-bottom) var(--form-item-label-margin-multiline-left);--form-item-chip-margin: var(--form-item-chip-margin-multiline-top) var(--form-item-chip-margin-multiline-right) var(--form-item-chip-margin-multiline-bottom) var(--form-item-chip-margin-multiline-left)}.form-item--fill .form-item__label{flex:0 1 var(--form-item-label-width);min-width:var(--form-item-label-width)}.form-item--fill .form-item__input{flex:1;min-width:0}.form-item--fill .input--number,.form-item--fill .input--color{width:fit-content}.form-item--blocked{--text-color-primary: var(--form-item-text-color-disabled);--message-text-color: var(--form-item-text-color-disabled);--message-icon-color: var(--form-item-text-color-disabled);pointer-events:none}.form-item--baseline .form-item__row{align-items:baseline}.form-item--baseline .form-item__label,.form-item--baseline .form-item__chip{margin:0}
|
package/dist/assets/Icon.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--icon-height: var(--size-pos-small);--icon-letter-color: var(--penpot-color-icon-default);--icon-letter-text-size: var(--font-size-small);--icon-picto-color: var(--penpot-color-icon-default);--icon-width: var(--size-pos-small)}:root[data-theme=sketch]{--icon-height: var(--size-pos-small);--icon-letter-color: var(--sketch-color-foreground-tertiary);--icon-letter-text-size: var(--font-size-small);--icon-picto-color: var(--sketch-color-foreground-tertiary);--icon-width: var(--size-pos-small)}:root[data-theme=figma]{--icon-height: var(--size-pos-small);--icon-letter-color: var(--figma-color-text);--icon-letter-text-size: var(--font-size-xsmall);--icon-picto-color: var(--figma-color-icon);--icon-width: var(--size-pos-small)}:root[data-theme=framer]{--icon-height: var(--size-pos-small);--icon-letter-color: var(--framer-color-text);--icon-letter-text-size: var(--font-size-xxxsmall);--icon-picto-color: var(--framer-color-text);--icon-width: var(--size-pos-small)}.icon-box{display:flex;flex:none;justify-content:center;align-items:center;width:var(--icon-width);height:var(--icon-height);pointer-events:none;-webkit-user-select:none;user-select:none}.icon-box--picto{background-color:var(--icon-picto-color)}.icon-box--letter span{color:var(--icon-letter-color);font-size:var(--icon-letter-text-size)!important}
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--icon-height: var(--size-pos-small);--icon-letter-color: var(--penpot-color-icon-default);--icon-letter-text-size: var(--font-size-small);--icon-picto-color: var(--penpot-color-icon-default);--icon-width: var(--size-pos-small)}:root[data-theme=sketch]{--icon-height: var(--size-pos-small);--icon-letter-color: var(--sketch-color-foreground-tertiary);--icon-letter-text-size: var(--font-size-small);--icon-picto-color: var(--sketch-color-foreground-tertiary);--icon-width: var(--size-pos-small)}:root[data-theme=figma]{--icon-height: var(--size-pos-small);--icon-letter-color: var(--figma-color-text-default);--icon-letter-text-size: var(--font-size-xsmall);--icon-picto-color: var(--figma-color-icon-default);--icon-width: var(--size-pos-small)}:root[data-theme=framer]{--icon-height: var(--size-pos-small);--icon-letter-color: var(--framer-color-text-default);--icon-letter-text-size: var(--font-size-xxxsmall);--icon-picto-color: var(--framer-color-text-default);--icon-width: var(--size-pos-small)}.icon-box{display:flex;flex:none;justify-content:center;align-items:center;width:var(--icon-width);height:var(--icon-height);pointer-events:none;-webkit-user-select:none;user-select:none}.icon-box--picto{background-color:var(--icon-picto-color)}.icon-box--letter span{color:var(--icon-letter-color);font-size:var(--icon-letter-text-size)!important}
|
package/dist/assets/Input.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--input-background-color-default: var(--penpot-color-background-tertiary);--input-background-color-disabled: var(--penpot-color-background-primary);--input-background-color-empty-default: var(--penpot-color-background-tertiary);--input-background-color-empty-error-default: var(--penpot-color-background-tertiary);--input-background-color-empty-error-focus: var(--penpot-color-background-tertiary);--input-background-color-empty-error-hover: var(--penpot-color-background-quaternary);--input-background-color-empty-focus: var(--penpot-color-background-tertiary);--input-background-color-empty-hover: var(--penpot-color-background-quaternary);--input-background-color-error-default: var(--penpot-color-background-tertiary);--input-background-color-error-focus: var(--penpot-color-background-tertiary);--input-background-color-error-hover: var(--penpot-color-background-quaternary);--input-background-color-focus: var(--penpot-color-background-tertiary);--input-background-color-hover: var(--penpot-color-background-quaternary);--input-background-color-onselected-default: var(--penpot-color-background-tertiary);--input-background-color-onselected-hover: var(--penpot-color-background-tertiary);--input-border-color-default: transparent;--input-border-color-disabled: var(--penpot-color-background-quaternary);--input-border-color-empty-default: transparent;--input-border-color-empty-error-default: var(--penpot-color-accent-error);--input-border-color-empty-error-focus: var(--penpot-color-foreground-error);--input-border-color-empty-error-hover: var(--penpot-color-accent-error);--input-border-color-empty-focus: var(--penpot-color-accent-primary);--input-border-color-empty-hover: color(srgb 0 0 0 / 0);--input-border-color-error-default: var(--penpot-color-accent-error);--input-border-color-error-focus: var(--penpot-color-foreground-error);--input-border-color-error-hover: var(--penpot-color-accent-error);--input-border-color-focus: var(--penpot-color-accent-primary);--input-border-color-hover: color(srgb 0 0 0 / 0);--input-border-color-onselected-default: var(--penpot-color-accent-primary);--input-border-color-onselected-hover: var(--penpot-color-accent-primary);--input-border-offset-default: var(--size-null);--input-border-offset-disabled: var(--size-pos-unit);--input-border-offset-empty-default: var(--size-null);--input-border-offset-empty-error-default: var(--size-pos-unit);--input-border-offset-empty-error-focus: var(--size-pos-unit);--input-border-offset-empty-error-hover: var(--size-pos-unit);--input-border-offset-empty-focus: var(--size-pos-unit);--input-border-offset-empty-hover: var(--size-null);--input-border-offset-error-default: var(--size-pos-unit);--input-border-offset-error-focus: var(--size-pos-unit);--input-border-offset-error-hover: var(--size-pos-unit);--input-border-offset-focus: var(--size-pos-unit);--input-border-offset-hover: var(--size-null);--input-border-offset-onselected-default: var(--size-pos-unit);--input-border-offset-onselected-hover: var(--size-pos-unit);--input-border-width-default: var(--size-null);--input-border-width-disabled: var(--size-pos-unit);--input-border-width-empty-default: var(--size-null);--input-border-width-empty-error-default: var(--size-pos-unit);--input-border-width-empty-error-focus: var(--size-pos-unit);--input-border-width-empty-error-hover: var(--size-pos-unit);--input-border-width-empty-focus: var(--size-pos-unit);--input-border-width-empty-hover: var(--size-null);--input-border-width-error-default: var(--size-pos-unit);--input-border-width-error-focus: var(--size-pos-unit);--input-border-width-error-hover: var(--size-pos-unit);--input-border-width-focus: var(--size-pos-unit);--input-border-width-hover: var(--size-null);--input-border-width-onselected-default: var(--size-pos-unit);--input-border-width-onselected-hover: var(--size-pos-unit);--input-clearable-right: 6px;--input-clearable-top: 6px;--input-color-chip-border-default: inset 0 0 0 var(--size-pos-unit) color(srgb 0 0 0 / .1);--input-color-chip-border-focus: inset 0 0 0 var(--size-pos-xunit) var(--penpot-color-accent-primary);--input-color-chip-height: var(--size-pos-xsmall);--input-color-chip-left: var(--size-pos-xxsmall);--input-color-chip-opacity-default: 1;--input-color-chip-opacity-disabled: .5;--input-color-chip-radius: var(--border-radius-medium);--input-color-chip-width: var(--size-pos-xsmall);--input-color-width: 108px;--input-gap: var(--size-pos-xxsmall);--input-height: var(--size-pos-medium);--input-icon-color: var(--penpot-color-icon-default);--input-icon-height: var(--size-pos-medium);--input-icon-width: var(--size-pos-medium);--input-number-width: 108px;--input-padding-clearable-bottom: var(--size-pos-medium);--input-padding-clearable-left: var(--size-pos-medium);--input-padding-clearable-right: var(--size-pos-medium);--input-padding-clearable-top: var(--size-pos-medium);--input-padding-default-bottom: var(--size-pos-xxsmall);--input-padding-default-left: var(--size-pos-xxsmall);--input-padding-default-right: var(--size-pos-xxsmall);--input-padding-default-top: var(--size-pos-xxsmall);--input-padding-unit-bottom: var(--size-pos-small);--input-padding-unit-left: var(--size-pos-small);--input-padding-unit-right: var(--size-pos-small);--input-padding-unit-top: var(--size-pos-small);--input-padding-with-color-bottom: var(--size-pos-small);--input-padding-with-color-left: var(--size-pos-medium);--input-padding-with-color-right: var(--size-pos-small);--input-padding-with-color-top: var(--size-pos-small);--input-padding-with-icon-bottom: var(--size-pos-small);--input-padding-with-icon-left: var(--size-pos-medium);--input-padding-with-icon-right: var(--size-pos-small);--input-padding-with-icon-top: var(--size-pos-small);--input-radius: var(--border-radius-xlarge);--input-status-gap: var(--size-pos-xxsmall);--input-status-height-default: var(--size-pos-medium);--input-status-height-long-text: var(--size-pos-medium);--input-text-color-default: var(--penpot-color-foreground-primary);--input-text-color-disabled: var(--penpot-color-foreground-secondary);--input-text-color-empty-default: var(--penpot-color-foreground-primary);--input-text-color-empty-error-default: var(--penpot-color-foreground-primary);--input-text-color-empty-error-focus: var(--penpot-color-foreground-primary);--input-text-color-empty-error-hover: var(--penpot-color-foreground-primary);--input-text-color-empty-focus: var(--penpot-color-foreground-primary);--input-text-color-empty-hover: var(--penpot-color-foreground-primary);--input-text-color-error-default: var(--penpot-color-foreground-primary);--input-text-color-error-focus: var(--penpot-color-foreground-primary);--input-text-color-error-hover: var(--penpot-color-foreground-primary);--input-text-color-focus: var(--penpot-color-foreground-primary);--input-text-color-hover: var(--penpot-color-foreground-primary);--input-text-font-family: var(--font-stack);--input-text-font-size: var(--font-size-small);--input-text-font-weight: var(--font-weight-normal);--input-text-letter-spacing: var(--font-letter-spacing-pos-large);--input-text-line-height: var(--font-line-height-default);--input-text-placeholder-color-default: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-disabled: var(--penpot-color-foreground-disabled);--input-text-placeholder-color-empty-default: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-empty-error-default: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-empty-error-focus: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-empty-error-hover: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-empty-focus: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-empty-hover: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-error-default: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-error-focus: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-error-hover: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-focus: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-hover: var(--penpot-color-foreground-secondary);--input-textarea-background-color: var(--penpot-color-background-tertiary);--input-textarea-border-color: color(srgb 0 0 0 / 0);--input-textarea-border-offset: var(--size-null);--input-textarea-border-width: var(--size-null);--input-textarea-min-height: var(--size-pos-xxlarge);--input-textarea-padding-bottom: var(--size-pos-xxsmall);--input-textarea-padding-left: var(--size-pos-xxsmall);--input-textarea-padding-right: var(--size-pos-xxsmall);--input-textarea-padding-top: var(--size-pos-xxsmall);--input-textarea-text-color: var(--penpot-color-foreground-primary);--input-textarea-text-placeholder-color: var(--penpot-color-foreground-secondary)}:root[data-theme=sketch]{--input-background-color-default: var(--sketch-color-background-tertiary);--input-background-color-disabled: var(--sketch-color-background-primary);--input-background-color-empty-default: var(--sketch-color-background-tertiary);--input-background-color-empty-error-default: var(--sketch-color-background-tertiary);--input-background-color-empty-error-focus: var(--sketch-color-background-tertiary);--input-background-color-empty-error-hover: var(--sketch-color-background-disabled);--input-background-color-empty-focus: var(--sketch-color-background-tertiary);--input-background-color-empty-hover: var(--sketch-color-background-disabled);--input-background-color-error-default: var(--sketch-color-background-tertiary);--input-background-color-error-focus: var(--sketch-color-background-tertiary);--input-background-color-error-hover: var(--sketch-color-background-disabled);--input-background-color-focus: var(--sketch-color-background-tertiary);--input-background-color-hover: var(--sketch-color-background-disabled);--input-background-color-onselected-default: var(--sketch-color-background-tertiary);--input-background-color-onselected-hover: var(--sketch-color-background-tertiary);--input-border-color-default: transparent;--input-border-color-disabled: var(--sketch-color-border-disabled);--input-border-color-empty-default: transparent;--input-border-color-empty-error-default: var(--sketch-color-accent-error);--input-border-color-empty-error-focus: var(--sketch-color-foreground-error);--input-border-color-empty-error-hover: var(--sketch-color-accent-error);--input-border-color-empty-focus: var(--sketch-color-accent-primary);--input-border-color-empty-hover: transparent;--input-border-color-error-default: var(--sketch-color-accent-error);--input-border-color-error-focus: var(--sketch-color-foreground-error);--input-border-color-error-hover: var(--sketch-color-accent-error);--input-border-color-focus: var(--sketch-color-accent-primary);--input-border-color-hover: transparent;--input-border-color-onselected-default: var(--sketch-color-accent-primary);--input-border-color-onselected-hover: var(--sketch-color-accent-primary);--input-border-offset-default: var(--size-null);--input-border-offset-disabled: var(--size-neg-unit);--input-border-offset-empty-default: var(--size-null);--input-border-offset-empty-error-default: var(--size-neg-unit);--input-border-offset-empty-error-focus: var(--size-neg-unit);--input-border-offset-empty-error-hover: var(--size-neg-unit);--input-border-offset-empty-focus: var(--size-neg-unit);--input-border-offset-empty-hover: var(--size-null);--input-border-offset-error-default: var(--size-neg-unit);--input-border-offset-error-focus: var(--size-neg-unit);--input-border-offset-error-hover: var(--size-neg-unit);--input-border-offset-focus: var(--size-neg-unit);--input-border-offset-hover: var(--size-null);--input-border-offset-onselected-default: var(--size-neg-unit);--input-border-offset-onselected-hover: var(--size-neg-unit);--input-border-width-default: var(--size-null);--input-border-width-disabled: var(--size-pos-unit);--input-border-width-empty-default: var(--size-null);--input-border-width-empty-error-default: var(--size-pos-unit);--input-border-width-empty-error-focus: var(--size-pos-unit);--input-border-width-empty-error-hover: var(--size-pos-unit);--input-border-width-empty-focus: var(--size-pos-unit);--input-border-width-empty-hover: var(--size-null);--input-border-width-error-default: var(--size-pos-unit);--input-border-width-error-focus: var(--size-pos-unit);--input-border-width-error-hover: var(--size-pos-unit);--input-border-width-focus: var(--size-pos-unit);--input-border-width-hover: var(--size-null);--input-border-width-onselected-default: var(--size-pos-unit);--input-border-width-onselected-hover: var(--size-pos-unit);--input-clearable-right: var(--size-pos-xxxsmall);--input-clearable-top: var(--size-pos-xxxsmall);--input-color-chip-border-default: inset 0 0 0 var(--size-pos-unit) color(srgb 0 0 0 / .1);--input-color-chip-border-focus: inset 0 0 0 var(--size-pos-unit) var(--sketch-color-accent-primary);--input-color-chip-height: var(--size-pos-xsmall);--input-color-chip-left: var(--size-pos-xxsmall);--input-color-chip-opacity-default: 1;--input-color-chip-opacity-disabled: .5;--input-color-chip-radius: var(--border-radius-small);--input-color-chip-width: var(--size-pos-xsmall);--input-color-width: 108px;--input-gap: var(--size-pos-xxsmall);--input-height: var(--size-pos-medium);--input-icon-color: var(--sketch-color-foreground-tertiary);--input-icon-height: var(--size-pos-medium);--input-icon-width: var(--size-pos-medium);--input-number-width: 108px;--input-padding-clearable-bottom: var(--size-pos-medium);--input-padding-clearable-left: var(--size-pos-medium);--input-padding-clearable-right: var(--size-pos-medium);--input-padding-clearable-top: var(--size-pos-medium);--input-padding-default-bottom: var(--size-pos-xxsmall);--input-padding-default-left: var(--size-pos-xxsmall);--input-padding-default-right: var(--size-pos-xxsmall);--input-padding-default-top: var(--size-pos-xxsmall);--input-padding-unit-bottom: var(--size-pos-medium);--input-padding-unit-left: var(--size-pos-medium);--input-padding-unit-right: var(--size-pos-medium);--input-padding-unit-top: var(--size-pos-medium);--input-padding-with-color-bottom: var(--size-pos-medium);--input-padding-with-color-left: var(--size-pos-medium);--input-padding-with-color-right: var(--size-pos-medium);--input-padding-with-color-top: var(--size-pos-medium);--input-padding-with-icon-bottom: var(--size-pos-medium);--input-padding-with-icon-left: var(--size-pos-medium);--input-padding-with-icon-right: var(--size-pos-medium);--input-padding-with-icon-top: var(--size-pos-medium);--input-radius: var(--border-radius-large);--input-status-gap: var(--size-pos-xxsmall);--input-status-height-default: var(--size-pos-medium);--input-status-height-long-text: var(--size-pos-medium);--input-text-color-default: var(--sketch-color-foreground-primary);--input-text-color-disabled: var(--sketch-color-foreground-tertiary);--input-text-color-empty-default: var(--sketch-color-foreground-primary);--input-text-color-empty-error-default: var(--sketch-color-foreground-primary);--input-text-color-empty-error-focus: var(--sketch-color-foreground-primary);--input-text-color-empty-error-hover: var(--sketch-color-foreground-primary);--input-text-color-empty-focus: var(--sketch-color-foreground-primary);--input-text-color-empty-hover: var(--sketch-color-foreground-primary);--input-text-color-error-default: var(--sketch-color-foreground-primary);--input-text-color-error-focus: var(--sketch-color-foreground-primary);--input-text-color-error-hover: var(--sketch-color-foreground-primary);--input-text-color-focus: var(--sketch-color-foreground-primary);--input-text-color-hover: var(--sketch-color-foreground-primary);--input-text-font-family: var(--font-stack);--input-text-font-size: var(--font-size-medium);--input-text-font-weight: var(--font-weight-normal);--input-text-letter-spacing: var(--font-letter-spacing-pos-medium);--input-text-line-height: var(--font-line-height-default);--input-text-placeholder-color-default: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-disabled: var(--sketch-color-foreground-disabled);--input-text-placeholder-color-empty-default: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-empty-error-default: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-empty-error-focus: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-empty-error-hover: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-empty-focus: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-empty-hover: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-error-default: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-error-focus: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-error-hover: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-focus: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-hover: var(--sketch-color-foreground-tertiary);--input-textarea-background-color: var(--sketch-color-background-tertiary);--input-textarea-border-color: transparent;--input-textarea-border-offset: var(--size-null);--input-textarea-border-width: var(--size-null);--input-textarea-min-height: var(--size-pos-xxlarge);--input-textarea-padding-bottom: var(--size-pos-xxsmall);--input-textarea-padding-left: var(--size-pos-xxsmall);--input-textarea-padding-right: var(--size-pos-xxsmall);--input-textarea-padding-top: var(--size-pos-xxsmall);--input-textarea-text-color: var(--sketch-color-foreground-primary);--input-textarea-text-placeholder-color: var(--sketch-color-foreground-tertiary)}:root[data-theme=figma]{--input-background-color-default: var(--figma-color-bg-secondary);--input-background-color-disabled: var(--figma-color-bg-tertiary);--input-background-color-empty-default: var(--figma-color-bg-secondary);--input-background-color-empty-error-default: var(--figma-color-bg-secondary);--input-background-color-empty-error-focus: var(--figma-color-bg-secondary);--input-background-color-empty-error-hover: var(--figma-color-bg-secondary);--input-background-color-empty-focus: var(--figma-color-bg-secondary);--input-background-color-empty-hover: var(--figma-color-bg-secondary);--input-background-color-error-default: var(--figma-color-bg-secondary);--input-background-color-error-focus: var(--figma-color-bg-secondary);--input-background-color-error-hover: var(--figma-color-bg-secondary);--input-background-color-focus: var(--figma-color-bg-secondary);--input-background-color-hover: var(--figma-color-bg-secondary);--input-background-color-onselected-default: var(--figma-color-bg);--input-background-color-onselected-hover: var(--figma-color-bg);--input-border-color-default: transparent;--input-border-color-disabled: var(--figma-color-border-disabled);--input-border-color-empty-default: transparent;--input-border-color-empty-error-default: var(--figma-color-border-danger);--input-border-color-empty-error-focus: var(--figma-color-border-danger-strong);--input-border-color-empty-error-hover: var(--figma-color-border-danger);--input-border-color-empty-focus: var(--figma-color-border-selected);--input-border-color-empty-hover: var(--figma-color-border);--input-border-color-error-default: var(--figma-color-border-danger);--input-border-color-error-focus: var(--figma-color-border-danger-strong);--input-border-color-error-hover: var(--figma-color-border-danger);--input-border-color-focus: var(--figma-color-border-selected);--input-border-color-hover: var(--figma-color-border);--input-border-color-onselected-default: var(--figma-color-border-selected);--input-border-color-onselected-hover: var(--figma-color-border-selected);--input-border-offset-default: var(--size-null);--input-border-offset-disabled: var(--size-neg-unit);--input-border-offset-empty-default: var(--size-null);--input-border-offset-empty-error-default: var(--size-neg-unit);--input-border-offset-empty-error-focus: var(--size-neg-unit);--input-border-offset-empty-error-hover: var(--size-neg-unit);--input-border-offset-empty-focus: var(--size-neg-unit);--input-border-offset-empty-hover: var(--size-neg-unit);--input-border-offset-error-default: var(--size-neg-unit);--input-border-offset-error-focus: var(--size-neg-unit);--input-border-offset-error-hover: var(--size-neg-unit);--input-border-offset-focus: var(--size-neg-unit);--input-border-offset-hover: var(--size-neg-unit);--input-border-offset-onselected-default: var(--size-neg-unit);--input-border-offset-onselected-hover: var(--size-neg-unit);--input-border-width-default: var(--size-null);--input-border-width-disabled: var(--size-pos-unit);--input-border-width-empty-default: var(--size-null);--input-border-width-empty-error-default: var(--size-pos-unit);--input-border-width-empty-error-focus: var(--size-pos-unit);--input-border-width-empty-error-hover: var(--size-pos-unit);--input-border-width-empty-focus: var(--size-pos-unit);--input-border-width-empty-hover: var(--size-pos-unit);--input-border-width-error-default: var(--size-pos-unit);--input-border-width-error-focus: var(--size-pos-unit);--input-border-width-error-hover: var(--size-pos-unit);--input-border-width-focus: var(--size-pos-unit);--input-border-width-hover: var(--size-pos-unit);--input-border-width-onselected-default: var(--size-pos-unit);--input-border-width-onselected-hover: var(--size-pos-unit);--input-clearable-right: var(--size-pos-xunit);--input-clearable-top: var(--size-pos-xunit);--input-color-chip-border-default: inset 0 0 0 var(--size-pos-unit) color(srgb 0 0 0 / .1);--input-color-chip-border-focus: inset 0 0 0 var(--size-pos-unit) var(--figma-color-border-selected);--input-color-chip-height: var(--size-pos-xsmall);--input-color-chip-left: var(--size-pos-xxxsmall);--input-color-chip-opacity-default: 1;--input-color-chip-opacity-disabled: .5;--input-color-chip-radius: var(--border-radius-small);--input-color-chip-width: var(--size-pos-xsmall);--input-color-width: 96px;--input-gap: var(--size-pos-xxsmall);--input-height: var(--size-pos-small);--input-icon-color: var(--figma-color-icon-disabled);--input-icon-height: var(--size-pos-small);--input-icon-width: var(--size-pos-small);--input-number-width: 96px;--input-padding-clearable-bottom: var(--size-pos-medium);--input-padding-clearable-left: var(--size-pos-medium);--input-padding-clearable-right: var(--size-pos-medium);--input-padding-clearable-top: var(--size-pos-medium);--input-padding-default-bottom: var(--size-pos-xxsmall);--input-padding-default-left: var(--size-pos-xxsmall);--input-padding-default-right: var(--size-pos-xxsmall);--input-padding-default-top: var(--size-pos-xxsmall);--input-padding-unit-bottom: var(--size-pos-small);--input-padding-unit-left: var(--size-pos-small);--input-padding-unit-right: var(--size-pos-small);--input-padding-unit-top: var(--size-pos-small);--input-padding-with-color-bottom: var(--size-pos-small);--input-padding-with-color-left: var(--size-pos-small);--input-padding-with-color-right: var(--size-pos-small);--input-padding-with-color-top: var(--size-pos-small);--input-padding-with-icon-bottom: var(--size-pos-small);--input-padding-with-icon-left: var(--size-pos-small);--input-padding-with-icon-right: var(--size-pos-small);--input-padding-with-icon-top: var(--size-pos-small);--input-radius: var(--border-radius-medium);--input-status-gap: var(--size-pos-xxsmall);--input-status-height-default: var(--size-pos-small);--input-status-height-long-text: var(--size-pos-small);--input-text-color-default: var(--figma-color-text);--input-text-color-disabled: var(--figma-color-text-disabled);--input-text-color-empty-default: var(--figma-color-text);--input-text-color-empty-error-default: var(--figma-color-text);--input-text-color-empty-error-focus: var(--figma-color-text);--input-text-color-empty-error-hover: var(--figma-color-text);--input-text-color-empty-focus: var(--figma-color-text);--input-text-color-empty-hover: var(--figma-color-text);--input-text-color-error-default: var(--figma-color-text);--input-text-color-error-focus: var(--figma-color-text);--input-text-color-error-hover: var(--figma-color-text);--input-text-color-focus: var(--figma-color-text);--input-text-color-hover: var(--figma-color-text);--input-text-font-family: var(--font-stack);--input-text-font-size: var(--font-size-xsmall);--input-text-font-weight: var(--font-weight-normal);--input-text-letter-spacing: var(--font-letter-spacing-pos-xlarge);--input-text-line-height: var(--font-line-height-default);--input-text-placeholder-color-default: var(--figma-color-text-secondary);--input-text-placeholder-color-disabled: var(--figma-color-text-disabled);--input-text-placeholder-color-empty-default: var(--figma-color-text-secondary);--input-text-placeholder-color-empty-error-default: var(--figma-color-text-secondary);--input-text-placeholder-color-empty-error-focus: var(--figma-color-text-secondary);--input-text-placeholder-color-empty-error-hover: var(--figma-color-text-secondary);--input-text-placeholder-color-empty-focus: var(--figma-color-text-secondary);--input-text-placeholder-color-empty-hover: var(--figma-color-text-secondary);--input-text-placeholder-color-error-default: var(--figma-color-text-secondary);--input-text-placeholder-color-error-focus: var(--figma-color-text-secondary);--input-text-placeholder-color-error-hover: var(--figma-color-text-secondary);--input-text-placeholder-color-focus: var(--figma-color-text-secondary);--input-text-placeholder-color-hover: var(--figma-color-text-secondary);--input-textarea-background-color: var(--figma-color-bg-secondary);--input-textarea-border-color: var(--figma-color-border);--input-textarea-border-offset: var(--size-neg-unit);--input-textarea-border-width: var(--size-pos-unit);--input-textarea-min-height: var(--size-pos-xxlarge);--input-textarea-padding-bottom: var(--size-pos-xxsmall);--input-textarea-padding-left: var(--size-pos-xxsmall);--input-textarea-padding-right: var(--size-pos-xxsmall);--input-textarea-padding-top: var(--size-pos-xxsmall);--input-textarea-text-color: var(--figma-color-text);--input-textarea-text-placeholder-color: var(--figma-color-text-secondary)}:root[data-theme=framer]{--input-background-color-default: var(--framer-color-bg-secondary);--input-background-color-disabled: var(--framer-color-bg-tertiary);--input-background-color-empty-default: var(--framer-color-bg-secondary);--input-background-color-empty-error-default: var(--framer-color-bg-secondary);--input-background-color-empty-error-focus: var(--framer-color-bg-secondary);--input-background-color-empty-error-hover: var(--framer-color-bg-secondary);--input-background-color-empty-focus: var(--framer-color-bg-secondary);--input-background-color-empty-hover: var(--framer-color-bg-secondary);--input-background-color-error-default: var(--framer-color-bg-secondary);--input-background-color-error-focus: var(--framer-color-bg-secondary);--input-background-color-error-hover: var(--framer-color-bg-secondary);--input-background-color-focus: var(--framer-color-bg-secondary);--input-background-color-hover: var(--framer-color-bg-secondary);--input-background-color-onselected-default: var(--framer-color-bg-secondary);--input-background-color-onselected-hover: var(--framer-color-bg-secondary);--input-border-color-default: transparent;--input-border-color-disabled: transparent;--input-border-color-empty-default: transparent;--input-border-color-empty-error-default: var(--framer-color-destructive);--input-border-color-empty-error-focus: var(--framer-color-destructive-extra-dark);--input-border-color-empty-error-hover: var(--framer-color-destructive);--input-border-color-empty-focus: var(--framer-color-tint);--input-border-color-empty-hover: transparent;--input-border-color-error-default: var(--framer-color-destructive);--input-border-color-error-focus: var(--framer-color-destructive-extra-dark);--input-border-color-error-hover: var(--framer-color-destructive);--input-border-color-focus: var(--framer-color-tint);--input-border-color-hover: transparent;--input-border-color-onselected-default: var(--framer-color-tint);--input-border-color-onselected-hover: var(--framer-color-tint);--input-border-offset-default: var(--size-null);--input-border-offset-disabled: var(--size-neg-unit);--input-border-offset-empty-default: var(--size-null);--input-border-offset-empty-error-default: var(--size-neg-unit);--input-border-offset-empty-error-focus: var(--size-neg-unit);--input-border-offset-empty-error-hover: var(--size-neg-unit);--input-border-offset-empty-focus: var(--size-neg-unit);--input-border-offset-empty-hover: var(--size-neg-unit);--input-border-offset-error-default: var(--size-neg-unit);--input-border-offset-error-focus: var(--size-neg-unit);--input-border-offset-error-hover: var(--size-neg-unit);--input-border-offset-focus: var(--size-neg-unit);--input-border-offset-hover: var(--size-neg-unit);--input-border-offset-onselected-default: var(--size-neg-unit);--input-border-offset-onselected-hover: var(--size-neg-unit);--input-border-width-default: var(--size-null);--input-border-width-disabled: var(--size-pos-unit);--input-border-width-empty-default: var(--size-null);--input-border-width-empty-error-default: var(--size-pos-unit);--input-border-width-empty-error-focus: var(--size-pos-unit);--input-border-width-empty-error-hover: var(--size-pos-unit);--input-border-width-empty-focus: var(--size-pos-unit);--input-border-width-empty-hover: var(--size-pos-unit);--input-border-width-error-default: var(--size-pos-unit);--input-border-width-error-focus: var(--size-pos-unit);--input-border-width-error-hover: var(--size-pos-unit);--input-border-width-focus: var(--size-pos-unit);--input-border-width-hover: var(--size-pos-unit);--input-border-width-onselected-default: var(--size-pos-unit);--input-border-width-onselected-hover: var(--size-pos-unit);--input-clearable-right: var(--size-pos-xxxsmall);--input-clearable-top: var(--size-pos-xxxsmall);--input-color-chip-border-default: inset 0 0 0 var(--size-pos-unit) color(srgb 0 0 0 / .1);--input-color-chip-border-focus: inset 0 0 0 var(--size-pos-unit) var(--framer-color-tint);--input-color-chip-height: var(--size-pos-small);--input-color-chip-left: var(--size-pos-xxxsmall);--input-color-chip-opacity-default: 1;--input-color-chip-opacity-disabled: .5;--input-color-chip-radius: var(--border-radius-medium);--input-color-chip-width: var(--size-pos-small);--input-color-width: 112px;--input-gap: var(--size-pos-xxsmall);--input-height: var(--size-pos-medium);--input-icon-color: var(--framer-color-text-tertiary);--input-icon-height: var(--size-pos-medium);--input-icon-width: var(--size-pos-medium);--input-number-width: 112px;--input-padding-clearable-bottom: var(--size-pos-medium);--input-padding-clearable-left: var(--size-pos-medium);--input-padding-clearable-right: var(--size-pos-medium);--input-padding-clearable-top: var(--size-pos-medium);--input-padding-default-bottom: var(--size-pos-xxsmall);--input-padding-default-left: var(--size-pos-xxsmall);--input-padding-default-right: var(--size-pos-xxsmall);--input-padding-default-top: var(--size-pos-xxsmall);--input-padding-unit-bottom: var(--size-pos-small);--input-padding-unit-left: var(--size-pos-small);--input-padding-unit-right: var(--size-pos-small);--input-padding-unit-top: var(--size-pos-small);--input-padding-with-color-bottom: var(--size-pos-small);--input-padding-with-color-left: var(--size-pos-xmedium);--input-padding-with-color-right: var(--size-pos-small);--input-padding-with-color-top: var(--size-pos-small);--input-padding-with-icon-bottom: var(--size-pos-small);--input-padding-with-icon-left: var(--size-pos-medium);--input-padding-with-icon-right: var(--size-pos-msmall);--input-padding-with-icon-top: var(--size-pos-small);--input-radius: var(--border-radius-xlarge);--input-status-gap: var(--size-pos-xxsmall);--input-status-height-default: var(--size-pos-medium);--input-status-height-long-text: var(--size-pos-medium);--input-text-color-default: var(--framer-color-text);--input-text-color-disabled: var(--framer-color-text-tertiary);--input-text-color-empty-default: var(--framer-color-text);--input-text-color-empty-error-default: var(--framer-color-text);--input-text-color-empty-error-focus: var(--framer-color-text);--input-text-color-empty-error-hover: var(--framer-color-text);--input-text-color-empty-focus: var(--framer-color-text);--input-text-color-empty-hover: var(--framer-color-text);--input-text-color-error-default: var(--framer-color-text);--input-text-color-error-focus: var(--framer-color-text);--input-text-color-error-hover: var(--framer-color-text);--input-text-color-focus: var(--framer-color-text);--input-text-color-hover: var(--framer-color-text);--input-text-font-family: var(--font-stack);--input-text-font-size: var(--font-size-small);--input-text-font-weight: var(--font-weight-medium);--input-text-letter-spacing: var(--font-letter-spacing-pos-large);--input-text-line-height: var(--font-line-height-default);--input-text-placeholder-color-default: var(--framer-color-text-secondary);--input-text-placeholder-color-disabled: var(--framer-color-text-tertiary);--input-text-placeholder-color-empty-default: var(--framer-color-text-secondary);--input-text-placeholder-color-empty-error-default: var(--framer-color-text-secondary);--input-text-placeholder-color-empty-error-focus: var(--framer-color-text-secondary);--input-text-placeholder-color-empty-error-hover: var(--framer-color-text-secondary);--input-text-placeholder-color-empty-focus: var(--framer-color-text-secondary);--input-text-placeholder-color-empty-hover: var(--framer-color-text-secondary);--input-text-placeholder-color-error-default: var(--framer-color-text-secondary);--input-text-placeholder-color-error-focus: var(--framer-color-text-secondary);--input-text-placeholder-color-error-hover: var(--framer-color-text-secondary);--input-text-placeholder-color-focus: var(--framer-color-text-secondary);--input-text-placeholder-color-hover: var(--framer-color-text-secondary);--input-textarea-background-color: var(--framer-color-bg-secondary);--input-textarea-border-color: transparent;--input-textarea-border-offset: var(--size-null);--input-textarea-border-width: var(--size-null);--input-textarea-min-height: var(--size-pos-xxlarge);--input-textarea-padding-bottom: var(--size-pos-xxsmall);--input-textarea-padding-left: var(--size-pos-xxsmall);--input-textarea-padding-right: var(--size-pos-xxsmall);--input-textarea-padding-top: var(--size-pos-xxsmall);--input-textarea-text-color: var(--framer-color-text);--input-textarea-text-placeholder-color: var(--framer-color-text-secondary)}.textarea{display:flex;position:relative;align-items:center;cursor:inherit;padding:var(--input-textarea-padding-top) var(--input-textarea-padding-right) var(--input-textarea-padding-bottom) var(--input-textarea-padding-left);width:100%;min-height:var(--input-textarea-min-height);overflow:visible;overflow:hidden auto;resize:none;font-weight:var(--input-text-font-weight);font-size:var(--input-text-font-size);line-height:var(--input-text-line-height);font-family:var(--input-text-font-family);letter-spacing:var(--input-text-letter-spacing);--input-border-width: var(--input-border-width-empty-default);--input-border-offset: var(--input-border-offset-empty-default);--input-border-color: var(--input-border-color-empty-default)}.textarea--monospace{font-family:monospace}.input{display:flex;position:relative;align-items:start;gap:var(--input-gap);cursor:default;-webkit-user-select:none;user-select:none}.input.input--blocked{pointer-events:none}.input--with-icon .input__field{padding-left:var(--input-padding-with-icon-left)}.input--with-color .input__field{padding-left:var(--input-padding-with-color-left)}.input input{cursor:inherit;-webkit-user-select:none;user-select:none}.input input[type=color i]{position:absolute;top:50%;left:var(--input-color-chip-left);transform:translateY(-50%);appearance:none;opacity:var(--input-color-chip-opacity);z-index:1;outline:none;border:none;background-color:transparent;padding:0;width:var(--input-color-chip-width);height:var(--input-color-chip-height)}.input input[type=color i]::-webkit-color-swatch-wrapper{padding:0}.input input[type=color i]::-webkit-color-swatch{box-shadow:var(--input-color-chip-border);border:none;border-radius:var(--input-color-chip-radius)}.input input[type=color i]::-webkit-color-swatch{--input-color-chip-border: var(--input-color-chip-border-default)}@media(prefers-color-scheme:dark){.input input[type=color i]{color-scheme:dark}}@media(prefers-color-scheme:light){.input input[type=color i]{color-scheme:light}}.input input[type=color i]{--input-color-chip-opacity: var(--input-color-chip-opacity-default)}.input input[type=color i]:focus::-webkit-color-swatch{--input-color-chip-border: var(--input-color-chip-border-focus)}.input input[type=color i]:focus~.input__field{--input-background-color: var(--input-background-color-focus);--input-border-width: var(--input-border-width-focus);--input-border-offset: var(--input-border-offset-focus);--input-border-color: var(--input-border-color-focus);--input-text-color: var(--input-text-color-focus);--input-text-placeholder-color: var(--input-text-placeholder-color-focus)}.input input[type=number]{width:var(--input-number-width)}.input input[type=color]~.input__field{width:var(--input-color-width)}.input input[type=number]::-webkit-inner-spin-button{display:none}.input input[type=number]{appearance:textfield}.input__wrapper{position:relative;flex:1}.input.input--flex .input__wrapper{flex:1}.input__icon,.input__unit{display:flex;position:absolute;justify-content:center;align-items:center;z-index:2;width:var(--input-icon-width);height:var(--input-icon-height);--icon-letter-color: var(--input-icon-color);--icon-picto-color: var(--input-icon-color)}.input__icon{top:0;left:0}.input__unit{top:0;right:0;pointer-events:none}.input__field{display:flex;position:relative;align-items:center;box-sizing:border-box;outline:var(--input-border-width) solid var(--input-border-color);outline-offset:var(--input-border-offset);border:none;border-radius:var(--input-radius);background-color:var(--input-background-color);padding:var(--input-padding-default-top) var(--input-padding-default-right) var(--input-padding-default-bottom) var(--input-padding-default-left);width:100%;height:var(--input-height);overflow:visible;color:var(--input-text-color);font-weight:var(--input-text-font-weight);font-size:var(--input-text-font-size);line-height:var(--input-text-line-height);font-family:var(--input-text-font-family);letter-spacing:var(--input-text-letter-spacing)}.input__field{--input-border-width: var(--input-border-width-default);--input-border-offset: var(--input-border-offset-default);--input-border-color: var(--input-border-color-default);--input-background-color: var(--input-background-color-default);--input-text-color: var(--input-text-color-default)}.input__field::placeholder{color:var(--input-text-placeholder-color)}.input__field:disabled{pointer-events:none}.input__field:placeholder-shown{--input-background-color: var(--input-background-color-empty-default);--input-border-width: var(--input-border-width-empty-default);--input-border-offset: var(--input-border-offset-empty-default);--input-border-color: var(--input-border-color-empty-default);--input-text-color: var(--input-text-color-empty-default);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-default )}.input__field:placeholder-shown:hover{--input-background-color: var(--input-background-color-empty-hover);--input-border-width: var(--input-border-width-empty-hover);--input-border-offset: var(--input-border-offset-empty-hover);--input-border-color: var(--input-border-color-empty-hover);--input-text-color: var(--input-text-color-empty-hover);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-hover )}.input__field:placeholder-shown:focus{--input-background-color: var(--input-background-color-empty-focus);--input-border-width: var(--input-border-width-empty-focus);--input-border-offset: var(--input-border-offset-empty-focus);--input-border-color: var(--input-border-color-empty-focus);--input-text-color: var(--input-text-color-empty-focus);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-focus )}.input__field--error:placeholder-shown{--input-background-color: var( --input-background-color-empty-error-default );--input-border-width: var(--input-border-width-empty-error-default);--input-border-offset: var(--input-border-offset-empty-error-default);--input-border-color: var(--input-border-color-empty-error-default);--input-text-color: var(--input-text-color-empty-error-default);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-error-default )}.input__field--error:placeholder-shown:hover{--input-background-color: var(--input-background-color-empty-error-hover);--input-border-width: var(--input-border-width-empty-error-hover);--input-border-offset: var(--input-border-offset-empty-error-hover);--input-border-color: var(--input-border-color-empty-error-hover);--input-text-color: var(--input-text-color-empty-error-hover);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-error-hover )}.input__field--error:placeholder-shown:focus{--input-background-color: var(--input-background-color-empty-error-focus);--input-border-width: var(--input-border-width-empty-error-focus);--input-border-offset: var(--input-border-offset-empty-error-focus);--input-border-color: var(--input-border-color-empty-error-focus);--input-text-color: var(--input-text-color-empty-error-focus);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-error-focus )}.input__field:hover{--input-background-color: var(--input-background-color-hover);--input-border-width: var(--input-border-width-hover);--input-border-offset: var(--input-border-offset-hover);--input-border-color: var(--input-border-color-hover);--input-text-color: var(--input-text-color-hover);--input-text-placeholder-color: var(--input-text-placeholder-color-hover)}.input__field:focus{--input-background-color: var(--input-background-color-focus);--input-border-width: var(--input-border-width-focus);--input-border-offset: var(--input-border-offset-focus);--input-border-color: var(--input-border-color-focus);--input-text-color: var(--input-text-color-focus);--input-text-placeholder-color: var(--input-text-placeholder-color-focus)}.input__field--error{--input-background-color: var(--input-background-color-error-default);--input-border-width: var(--input-border-width-error-default);--input-border-offset: var(--input-border-offset-error-default);--input-border-color: var(--input-border-color-error-default);--input-text-color: var(--input-text-color-error-default);--input-text-placeholder-color: var( --input-text-placeholder-color-error-default )}.input__field--error:hover{--input-background-color: var(--input-background-color-error-hover);--input-border-width: var(--input-border-width-error-hover);--input-border-offset: var(--input-border-offset-error-hover);--input-border-color: var(--input-border-color-error-hover);--input-text-color: var(--input-text-color-error-hover);--input-text-placeholder-color: var( --input-text-placeholder-color-error-hover )}.input__field--error:focus{--input-background-color: var(--input-background-color-error-focus);--input-border-width: var(--input-border-width-error-focus);--input-border-offset: var(--input-border-offset-error-focus);--input-border-color: var(--input-border-color-error-focus);--input-text-color: var(--input-text-color-error-focus);--input-text-placeholder-color: var( --input-text-placeholder-color-error-focus )}.input__field:disabled{--input-background-color: var(--input-background-color-disabled);--input-border-width: var(--input-border-width-disabled);--input-border-offset: var(--input-border-offset-disabled);--input-border-color: var(--input-border-color-disabled);--input-text-color: var(--input-text-color-disabled);--input-text-placeholder-color: var( --input-text-placeholder-color-disabled )}.input__field--no-frame,.input__field--no-frame:focus{outline:none;background-color:transparent}.input__field--flex{width:100%!important}.input__field--clearable{padding-right:var(--input-padding-clearable-right)}.input__field--unit{padding-right:var(--input-padding-unit-right)}.input__color:hover~.input__field{--input-background-color: var(--input-background-color-hover);--input-border-width: var(--input-border-width-hover);--input-border-offset: var(--input-border-offset-hover);--input-border-color: var(--input-border-color-hover);--input-text-color: var(--input-text-color-hover);--input-text-placeholder-color: var(--input-text-placeholder-color-hover)}.input__color:disabled[type=color i]{--input-color-chip-opacity: var(--input-color-chip-opacity-disabled);pointer-events:none}.input__clear{position:absolute;top:var(--input-clearable-top);right:var(--input-clearable-right)}.input__status{display:flex;align-items:center;gap:var(--input-status-gap);height:var(--input-status-height)}.input__status{--input-status-height: var(--input-status-height-default)}.input--long-text{--input-status-height: var(--input-status-height-long-text)}
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--input-background-color-default: var(--penpot-color-background-tertiary);--input-background-color-disabled: var(--penpot-color-background-primary);--input-background-color-empty-default: var(--penpot-color-background-tertiary);--input-background-color-empty-error-default: var(--penpot-color-background-tertiary);--input-background-color-empty-error-focus: var(--penpot-color-background-tertiary);--input-background-color-empty-error-hover: var(--penpot-color-background-quaternary);--input-background-color-empty-focus: var(--penpot-color-background-tertiary);--input-background-color-empty-hover: var(--penpot-color-background-quaternary);--input-background-color-error-default: var(--penpot-color-background-tertiary);--input-background-color-error-focus: var(--penpot-color-background-tertiary);--input-background-color-error-hover: var(--penpot-color-background-quaternary);--input-background-color-focus: var(--penpot-color-background-tertiary);--input-background-color-hover: var(--penpot-color-background-quaternary);--input-background-color-onselected-default: var(--penpot-color-background-tertiary);--input-background-color-onselected-hover: var(--penpot-color-background-tertiary);--input-border-color-default: var(--grey-transparent);--input-border-color-disabled: var(--penpot-color-background-quaternary);--input-border-color-empty-default: var(--grey-transparent);--input-border-color-empty-error-default: var(--penpot-color-accent-error);--input-border-color-empty-error-focus: var(--penpot-color-foreground-error);--input-border-color-empty-error-hover: var(--penpot-color-accent-error);--input-border-color-empty-focus: var(--penpot-color-accent-primary-default);--input-border-color-empty-hover: var(--grey-transparent);--input-border-color-error-default: var(--penpot-color-accent-error);--input-border-color-error-focus: var(--penpot-color-foreground-error);--input-border-color-error-hover: var(--penpot-color-accent-error);--input-border-color-focus: var(--penpot-color-accent-primary-default);--input-border-color-hover: var(--grey-transparent);--input-border-color-onselected-default: var(--penpot-color-accent-primary-default);--input-border-color-onselected-hover: var(--penpot-color-accent-primary-default);--input-border-offset-default: var(--size-null);--input-border-offset-disabled: var(--size-pos-unit);--input-border-offset-empty-default: var(--size-null);--input-border-offset-empty-error-default: var(--size-pos-unit);--input-border-offset-empty-error-focus: var(--size-pos-unit);--input-border-offset-empty-error-hover: var(--size-pos-unit);--input-border-offset-empty-focus: var(--size-pos-unit);--input-border-offset-empty-hover: var(--size-null);--input-border-offset-error-default: var(--size-pos-unit);--input-border-offset-error-focus: var(--size-pos-unit);--input-border-offset-error-hover: var(--size-pos-unit);--input-border-offset-focus: var(--size-pos-unit);--input-border-offset-hover: var(--size-null);--input-border-offset-onselected-default: var(--size-pos-unit);--input-border-offset-onselected-hover: var(--size-pos-unit);--input-border-width-default: var(--size-null);--input-border-width-disabled: var(--size-pos-unit);--input-border-width-empty-default: var(--size-null);--input-border-width-empty-error-default: var(--size-pos-unit);--input-border-width-empty-error-focus: var(--size-pos-unit);--input-border-width-empty-error-hover: var(--size-pos-unit);--input-border-width-empty-focus: var(--size-pos-unit);--input-border-width-empty-hover: var(--size-null);--input-border-width-error-default: var(--size-pos-unit);--input-border-width-error-focus: var(--size-pos-unit);--input-border-width-error-hover: var(--size-pos-unit);--input-border-width-focus: var(--size-pos-unit);--input-border-width-hover: var(--size-null);--input-border-width-onselected-default: var(--size-pos-unit);--input-border-width-onselected-hover: var(--size-pos-unit);--input-clearable-right: 6px;--input-clearable-top: 6px;--input-color-width: 108px;--input-color-chip-border-default: inset 0px 0px 0px 1px color(srgb 0 0 0 / .1);--input-color-chip-border-focus: inset 0px 0px 0px 2px color(srgb .49411764705882355 1 .9607843137254902 / 1);--input-color-chip-height: var(--size-pos-xsmall);--input-color-chip-left: var(--size-pos-xxsmall);--input-color-chip-opacity-default: var(--alpha-1000);--input-color-chip-opacity-disabled: var(--alpha-500);--input-color-chip-radius: var(--border-radius-medium);--input-color-chip-width: var(--size-pos-xsmall);--input-gap: var(--size-pos-xxsmall);--input-height: var(--size-pos-medium);--input-icon-color: var(--penpot-color-icon-default);--input-icon-height: var(--size-pos-medium);--input-icon-width: var(--size-pos-medium);--input-number-width: 108px;--input-padding-clearable-bottom: var(--size-pos-medium);--input-padding-clearable-left: var(--size-pos-medium);--input-padding-clearable-right: var(--size-pos-medium);--input-padding-clearable-top: var(--size-pos-medium);--input-padding-default-bottom: var(--size-pos-xxsmall);--input-padding-default-left: var(--size-pos-xxsmall);--input-padding-default-right: var(--size-pos-xxsmall);--input-padding-default-top: var(--size-pos-xxsmall);--input-padding-unit-bottom: var(--size-pos-small);--input-padding-unit-left: var(--size-pos-small);--input-padding-unit-right: var(--size-pos-small);--input-padding-unit-top: var(--size-pos-small);--input-padding-with-color-bottom: var(--size-pos-small);--input-padding-with-color-left: var(--size-pos-medium);--input-padding-with-color-right: var(--size-pos-small);--input-padding-with-color-top: var(--size-pos-small);--input-padding-with-icon-bottom: var(--size-pos-small);--input-padding-with-icon-left: var(--size-pos-medium);--input-padding-with-icon-right: var(--size-pos-small);--input-padding-with-icon-top: var(--size-pos-small);--input-radius: var(--border-radius-xlarge);--input-status-gap: var(--size-pos-xxsmall);--input-status-height-default: var(--size-pos-medium);--input-status-height-long-text: var(--size-pos-medium);--input-text-color-default: var(--penpot-color-foreground-primary);--input-text-color-disabled: var(--penpot-color-foreground-secondary);--input-text-color-empty-default: var(--penpot-color-foreground-primary);--input-text-color-empty-error-default: var(--penpot-color-foreground-primary);--input-text-color-empty-error-focus: var(--penpot-color-foreground-primary);--input-text-color-empty-error-hover: var(--penpot-color-foreground-primary);--input-text-color-empty-focus: var(--penpot-color-foreground-primary);--input-text-color-empty-hover: var(--penpot-color-foreground-primary);--input-text-color-error-default: var(--penpot-color-foreground-primary);--input-text-color-error-focus: var(--penpot-color-foreground-primary);--input-text-color-error-hover: var(--penpot-color-foreground-primary);--input-text-color-focus: var(--penpot-color-foreground-primary);--input-text-color-hover: var(--penpot-color-foreground-primary);--input-text-font-family: var(--text-font-family);--input-text-font-size: var(--font-size-small);--input-text-font-weight: var(--font-weight-normal);--input-text-letter-spacing: var(--font-letter-spacing-pos-large);--input-text-line-height: var(--font-line-height-default);--input-text-placeholder-color-default: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-disabled: var(--penpot-color-foreground-disabled);--input-text-placeholder-color-empty-default: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-empty-error-default: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-empty-error-focus: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-empty-error-hover: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-empty-focus: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-empty-hover: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-error-default: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-error-focus: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-error-hover: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-focus: var(--penpot-color-foreground-secondary);--input-text-placeholder-color-hover: var(--penpot-color-foreground-secondary);--input-textarea-background-color: var(--penpot-color-background-tertiary);--input-textarea-border-color: var(--grey-transparent);--input-textarea-border-offset: var(--size-null);--input-textarea-border-width: var(--size-null);--input-textarea-min-height: var(--size-pos-xxlarge);--input-textarea-padding-bottom: var(--size-pos-xxsmall);--input-textarea-padding-left: var(--size-pos-xxsmall);--input-textarea-padding-right: var(--size-pos-xxsmall);--input-textarea-padding-top: var(--size-pos-xxsmall);--input-textarea-text-color: var(--penpot-color-foreground-primary);--input-textarea-text-placeholder-color: var(--penpot-color-foreground-secondary)}:root[data-theme=sketch]{--input-background-color-default: var(--sketch-color-background-tertiary);--input-background-color-disabled: var(--sketch-color-background-primary);--input-background-color-empty-default: var(--sketch-color-background-tertiary);--input-background-color-empty-error-default: var(--sketch-color-background-tertiary);--input-background-color-empty-error-focus: var(--sketch-color-background-tertiary);--input-background-color-empty-error-hover: var(--sketch-color-background-disabled);--input-background-color-empty-focus: var(--sketch-color-background-tertiary);--input-background-color-empty-hover: var(--sketch-color-background-disabled);--input-background-color-error-default: var(--sketch-color-background-tertiary);--input-background-color-error-focus: var(--sketch-color-background-tertiary);--input-background-color-error-hover: var(--sketch-color-background-disabled);--input-background-color-focus: var(--sketch-color-background-tertiary);--input-background-color-hover: var(--sketch-color-background-disabled);--input-background-color-onselected-default: var(--sketch-color-background-tertiary);--input-background-color-onselected-hover: var(--sketch-color-background-tertiary);--input-border-color-default: var(--grey-transparent);--input-border-color-disabled: var(--sketch-color-border-disabled);--input-border-color-empty-default: var(--grey-transparent);--input-border-color-empty-error-default: var(--sketch-color-accent-error);--input-border-color-empty-error-focus: var(--sketch-color-foreground-error);--input-border-color-empty-error-hover: var(--sketch-color-accent-error);--input-border-color-empty-focus: var(--sketch-color-accent-primary);--input-border-color-empty-hover: var(--grey-transparent);--input-border-color-error-default: var(--sketch-color-accent-error);--input-border-color-error-focus: var(--sketch-color-foreground-error);--input-border-color-error-hover: var(--sketch-color-accent-error);--input-border-color-focus: var(--sketch-color-accent-primary);--input-border-color-hover: var(--grey-transparent);--input-border-color-onselected-default: var(--sketch-color-accent-primary);--input-border-color-onselected-hover: var(--sketch-color-accent-primary);--input-border-offset-default: var(--size-null);--input-border-offset-disabled: var(--size-neg-unit);--input-border-offset-empty-default: var(--size-null);--input-border-offset-empty-error-default: var(--size-neg-unit);--input-border-offset-empty-error-focus: var(--size-neg-unit);--input-border-offset-empty-error-hover: var(--size-neg-unit);--input-border-offset-empty-focus: var(--size-neg-unit);--input-border-offset-empty-hover: var(--size-null);--input-border-offset-error-default: var(--size-neg-unit);--input-border-offset-error-focus: var(--size-neg-unit);--input-border-offset-error-hover: var(--size-neg-unit);--input-border-offset-focus: var(--size-neg-unit);--input-border-offset-hover: var(--size-null);--input-border-offset-onselected-default: var(--size-neg-unit);--input-border-offset-onselected-hover: var(--size-neg-unit);--input-border-width-default: var(--size-null);--input-border-width-disabled: var(--size-pos-unit);--input-border-width-empty-default: var(--size-null);--input-border-width-empty-error-default: var(--size-pos-unit);--input-border-width-empty-error-focus: var(--size-pos-unit);--input-border-width-empty-error-hover: var(--size-pos-unit);--input-border-width-empty-focus: var(--size-pos-unit);--input-border-width-empty-hover: var(--size-null);--input-border-width-error-default: var(--size-pos-unit);--input-border-width-error-focus: var(--size-pos-unit);--input-border-width-error-hover: var(--size-pos-unit);--input-border-width-focus: var(--size-pos-unit);--input-border-width-hover: var(--size-null);--input-border-width-onselected-default: var(--size-pos-unit);--input-border-width-onselected-hover: var(--size-pos-unit);--input-clearable-right: var(--size-pos-xxxsmall);--input-clearable-top: var(--size-pos-xxxsmall);--input-color-width: 108px;--input-color-chip-border-default: inset 0px 0px 0px 1px color(srgb 0 0 0 / .1);--input-color-chip-border-focus: inset 0px 0px 0px 1px color(srgb .9490196078431372 .403921568627451 .14901960784313725 / 1);--input-color-chip-height: var(--size-pos-xsmall);--input-color-chip-left: var(--size-pos-xxsmall);--input-color-chip-opacity-default: var(--alpha-1000);--input-color-chip-opacity-disabled: var(--alpha-500);--input-color-chip-radius: var(--border-radius-small);--input-color-chip-width: var(--size-pos-xsmall);--input-gap: var(--size-pos-xxsmall);--input-height: var(--size-pos-medium);--input-icon-color: var(--sketch-color-foreground-tertiary);--input-icon-height: var(--size-pos-medium);--input-icon-width: var(--size-pos-medium);--input-number-width: 108px;--input-padding-clearable-bottom: var(--size-pos-medium);--input-padding-clearable-left: var(--size-pos-medium);--input-padding-clearable-right: var(--size-pos-medium);--input-padding-clearable-top: var(--size-pos-medium);--input-padding-default-bottom: var(--size-pos-xxsmall);--input-padding-default-left: var(--size-pos-xxsmall);--input-padding-default-right: var(--size-pos-xxsmall);--input-padding-default-top: var(--size-pos-xxsmall);--input-padding-unit-bottom: var(--size-pos-medium);--input-padding-unit-left: var(--size-pos-medium);--input-padding-unit-right: var(--size-pos-medium);--input-padding-unit-top: var(--size-pos-medium);--input-padding-with-color-bottom: var(--size-pos-medium);--input-padding-with-color-left: var(--size-pos-medium);--input-padding-with-color-right: var(--size-pos-medium);--input-padding-with-color-top: var(--size-pos-medium);--input-padding-with-icon-bottom: var(--size-pos-medium);--input-padding-with-icon-left: var(--size-pos-medium);--input-padding-with-icon-right: var(--size-pos-medium);--input-padding-with-icon-top: var(--size-pos-medium);--input-radius: var(--border-radius-large);--input-status-gap: var(--size-pos-xxsmall);--input-status-height-default: var(--size-pos-medium);--input-status-height-long-text: var(--size-pos-medium);--input-text-color-default: var(--sketch-color-foreground-primary);--input-text-color-disabled: var(--sketch-color-foreground-tertiary);--input-text-color-empty-default: var(--sketch-color-foreground-primary);--input-text-color-empty-error-default: var(--sketch-color-foreground-primary);--input-text-color-empty-error-focus: var(--sketch-color-foreground-primary);--input-text-color-empty-error-hover: var(--sketch-color-foreground-primary);--input-text-color-empty-focus: var(--sketch-color-foreground-primary);--input-text-color-empty-hover: var(--sketch-color-foreground-primary);--input-text-color-error-default: var(--sketch-color-foreground-primary);--input-text-color-error-focus: var(--sketch-color-foreground-primary);--input-text-color-error-hover: var(--sketch-color-foreground-primary);--input-text-color-focus: var(--sketch-color-foreground-primary);--input-text-color-hover: var(--sketch-color-foreground-primary);--input-text-font-family: var(--text-font-family);--input-text-font-size: var(--font-size-medium);--input-text-font-weight: var(--font-weight-normal);--input-text-letter-spacing: var(--font-letter-spacing-pos-medium);--input-text-line-height: var(--font-line-height-default);--input-text-placeholder-color-default: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-disabled: var(--sketch-color-foreground-disabled);--input-text-placeholder-color-empty-default: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-empty-error-default: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-empty-error-focus: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-empty-error-hover: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-empty-focus: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-empty-hover: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-error-default: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-error-focus: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-error-hover: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-focus: var(--sketch-color-foreground-tertiary);--input-text-placeholder-color-hover: var(--sketch-color-foreground-tertiary);--input-textarea-background-color: var(--sketch-color-background-tertiary);--input-textarea-border-color: var(--grey-transparent);--input-textarea-border-offset: var(--size-null);--input-textarea-border-width: var(--size-null);--input-textarea-min-height: var(--size-pos-xxlarge);--input-textarea-padding-bottom: var(--size-pos-xxsmall);--input-textarea-padding-left: var(--size-pos-xxsmall);--input-textarea-padding-right: var(--size-pos-xxsmall);--input-textarea-padding-top: var(--size-pos-xxsmall);--input-textarea-text-color: var(--sketch-color-foreground-primary);--input-textarea-text-placeholder-color: var(--sketch-color-foreground-tertiary)}:root[data-theme=figma]{--input-background-color-default: var(--figma-color-bg-secondary);--input-background-color-disabled: var(--figma-color-bg-tertiary);--input-background-color-empty-default: var(--figma-color-bg-secondary);--input-background-color-empty-error-default: var(--figma-color-bg-secondary);--input-background-color-empty-error-focus: var(--figma-color-bg-secondary);--input-background-color-empty-error-hover: var(--figma-color-bg-secondary);--input-background-color-empty-focus: var(--figma-color-bg-secondary);--input-background-color-empty-hover: var(--figma-color-bg-secondary);--input-background-color-error-default: var(--figma-color-bg-secondary);--input-background-color-error-focus: var(--figma-color-bg-secondary);--input-background-color-error-hover: var(--figma-color-bg-secondary);--input-background-color-focus: var(--figma-color-bg-secondary);--input-background-color-hover: var(--figma-color-bg-secondary);--input-background-color-onselected-default: var(--figma-color-bg-default);--input-background-color-onselected-hover: var(--figma-color-bg-default);--input-border-color-default: var(--grey-transparent);--input-border-color-disabled: var(--figma-color-border-disabled-default);--input-border-color-empty-default: var(--grey-transparent);--input-border-color-empty-error-default: var(--figma-color-border-danger-default);--input-border-color-empty-error-focus: var(--figma-color-border-danger-strong);--input-border-color-empty-error-hover: var(--figma-color-border-danger-default);--input-border-color-empty-focus: var(--figma-color-border-selected-default);--input-border-color-empty-hover: var(--figma-color-border-default);--input-border-color-error-default: var(--figma-color-border-danger-default);--input-border-color-error-focus: var(--figma-color-border-danger-strong);--input-border-color-error-hover: var(--figma-color-border-danger-default);--input-border-color-focus: var(--figma-color-border-selected-default);--input-border-color-hover: var(--figma-color-border-default);--input-border-color-onselected-default: var(--figma-color-border-selected-default);--input-border-color-onselected-hover: var(--figma-color-border-selected-default);--input-border-offset-default: var(--size-null);--input-border-offset-disabled: var(--size-neg-unit);--input-border-offset-empty-default: var(--size-null);--input-border-offset-empty-error-default: var(--size-neg-unit);--input-border-offset-empty-error-focus: var(--size-neg-unit);--input-border-offset-empty-error-hover: var(--size-neg-unit);--input-border-offset-empty-focus: var(--size-neg-unit);--input-border-offset-empty-hover: var(--size-neg-unit);--input-border-offset-error-default: var(--size-neg-unit);--input-border-offset-error-focus: var(--size-neg-unit);--input-border-offset-error-hover: var(--size-neg-unit);--input-border-offset-focus: var(--size-neg-unit);--input-border-offset-hover: var(--size-neg-unit);--input-border-offset-onselected-default: var(--size-neg-unit);--input-border-offset-onselected-hover: var(--size-neg-unit);--input-border-width-default: var(--size-null);--input-border-width-disabled: var(--size-pos-unit);--input-border-width-empty-default: var(--size-null);--input-border-width-empty-error-default: var(--size-pos-unit);--input-border-width-empty-error-focus: var(--size-pos-unit);--input-border-width-empty-error-hover: var(--size-pos-unit);--input-border-width-empty-focus: var(--size-pos-unit);--input-border-width-empty-hover: var(--size-pos-unit);--input-border-width-error-default: var(--size-pos-unit);--input-border-width-error-focus: var(--size-pos-unit);--input-border-width-error-hover: var(--size-pos-unit);--input-border-width-focus: var(--size-pos-unit);--input-border-width-hover: var(--size-pos-unit);--input-border-width-onselected-default: var(--size-pos-unit);--input-border-width-onselected-hover: var(--size-pos-unit);--input-clearable-right: var(--size-pos-xunit);--input-clearable-top: var(--size-pos-xunit);--input-color-width: var(--size-pos-huge);--input-color-chip-border-default: inset 0px 0px 0px 1px color(srgb 0 0 0 / .1);--input-color-chip-border-focus: inset 0px 0px 0px 1px color(srgb .592156862745098 .2784313725490196 1 / 1);--input-color-chip-height: var(--size-pos-xsmall);--input-color-chip-left: var(--size-pos-xxxsmall);--input-color-chip-opacity-default: var(--alpha-1000);--input-color-chip-opacity-disabled: var(--alpha-500);--input-color-chip-radius: var(--border-radius-small);--input-color-chip-width: var(--size-pos-xsmall);--input-gap: var(--size-pos-xxsmall);--input-height: var(--size-pos-small);--input-icon-color: var(--figma-color-icon-disabled);--input-icon-height: var(--size-pos-small);--input-icon-width: var(--size-pos-small);--input-number-width: var(--size-pos-huge);--input-padding-clearable-bottom: var(--size-pos-medium);--input-padding-clearable-left: var(--size-pos-medium);--input-padding-clearable-right: var(--size-pos-medium);--input-padding-clearable-top: var(--size-pos-medium);--input-padding-default-bottom: var(--size-pos-xxsmall);--input-padding-default-left: var(--size-pos-xxsmall);--input-padding-default-right: var(--size-pos-xxsmall);--input-padding-default-top: var(--size-pos-xxsmall);--input-padding-unit-bottom: var(--size-pos-small);--input-padding-unit-left: var(--size-pos-small);--input-padding-unit-right: var(--size-pos-small);--input-padding-unit-top: var(--size-pos-small);--input-padding-with-color-bottom: var(--size-pos-small);--input-padding-with-color-left: var(--size-pos-small);--input-padding-with-color-right: var(--size-pos-small);--input-padding-with-color-top: var(--size-pos-small);--input-padding-with-icon-bottom: var(--size-pos-small);--input-padding-with-icon-left: var(--size-pos-small);--input-padding-with-icon-right: var(--size-pos-small);--input-padding-with-icon-top: var(--size-pos-small);--input-radius: var(--border-radius-medium);--input-status-gap: var(--size-pos-xxsmall);--input-status-height-default: var(--size-pos-small);--input-status-height-long-text: var(--size-pos-small);--input-text-color-default: var(--figma-color-text-default);--input-text-color-disabled: var(--figma-color-text-disabled);--input-text-color-empty-default: var(--figma-color-text-default);--input-text-color-empty-error-default: var(--figma-color-text-default);--input-text-color-empty-error-focus: var(--figma-color-text-default);--input-text-color-empty-error-hover: var(--figma-color-text-default);--input-text-color-empty-focus: var(--figma-color-text-default);--input-text-color-empty-hover: var(--figma-color-text-default);--input-text-color-error-default: var(--figma-color-text-default);--input-text-color-error-focus: var(--figma-color-text-default);--input-text-color-error-hover: var(--figma-color-text-default);--input-text-color-focus: var(--figma-color-text-default);--input-text-color-hover: var(--figma-color-text-default);--input-text-font-family: var(--text-font-family);--input-text-font-size: var(--font-size-xsmall);--input-text-font-weight: var(--font-weight-normal);--input-text-letter-spacing: var(--font-letter-spacing-pos-xlarge);--input-text-line-height: var(--font-line-height-default);--input-text-placeholder-color-default: var(--figma-color-text-secondary-default);--input-text-placeholder-color-disabled: var(--figma-color-text-disabled);--input-text-placeholder-color-empty-default: var(--figma-color-text-secondary-default);--input-text-placeholder-color-empty-error-default: var(--figma-color-text-secondary-default);--input-text-placeholder-color-empty-error-focus: var(--figma-color-text-secondary-default);--input-text-placeholder-color-empty-error-hover: var(--figma-color-text-secondary-default);--input-text-placeholder-color-empty-focus: var(--figma-color-text-secondary-default);--input-text-placeholder-color-empty-hover: var(--figma-color-text-secondary-default);--input-text-placeholder-color-error-default: var(--figma-color-text-secondary-default);--input-text-placeholder-color-error-focus: var(--figma-color-text-secondary-default);--input-text-placeholder-color-error-hover: var(--figma-color-text-secondary-default);--input-text-placeholder-color-focus: var(--figma-color-text-secondary-default);--input-text-placeholder-color-hover: var(--figma-color-text-secondary-default);--input-textarea-background-color: var(--figma-color-bg-secondary);--input-textarea-border-color: var(--figma-color-border-default);--input-textarea-border-offset: var(--size-neg-unit);--input-textarea-border-width: var(--size-pos-unit);--input-textarea-min-height: var(--size-pos-xxlarge);--input-textarea-padding-bottom: var(--size-pos-xxsmall);--input-textarea-padding-left: var(--size-pos-xxsmall);--input-textarea-padding-right: var(--size-pos-xxsmall);--input-textarea-padding-top: var(--size-pos-xxsmall);--input-textarea-text-color: var(--figma-color-text-default);--input-textarea-text-placeholder-color: var(--figma-color-text-secondary-default)}:root[data-theme=framer]{--input-background-color-default: var(--framer-color-bg-secondary);--input-background-color-disabled: var(--framer-color-bg-tertiary);--input-background-color-empty-default: var(--framer-color-bg-secondary);--input-background-color-empty-error-default: var(--framer-color-bg-secondary);--input-background-color-empty-error-focus: var(--framer-color-bg-secondary);--input-background-color-empty-error-hover: var(--framer-color-bg-secondary);--input-background-color-empty-focus: var(--framer-color-bg-secondary);--input-background-color-empty-hover: var(--framer-color-bg-secondary);--input-background-color-error-default: var(--framer-color-bg-secondary);--input-background-color-error-focus: var(--framer-color-bg-secondary);--input-background-color-error-hover: var(--framer-color-bg-secondary);--input-background-color-focus: var(--framer-color-bg-secondary);--input-background-color-hover: var(--framer-color-bg-secondary);--input-background-color-onselected-default: var(--framer-color-bg-secondary);--input-background-color-onselected-hover: var(--framer-color-bg-secondary);--input-border-color-default: var(--grey-transparent);--input-border-color-disabled: var(--grey-transparent);--input-border-color-empty-default: var(--grey-transparent);--input-border-color-empty-error-default: var(--framer-color-destructive-default);--input-border-color-empty-error-focus: var(--framer-color-destructive-extra-dark);--input-border-color-empty-error-hover: var(--framer-color-destructive-default);--input-border-color-empty-focus: var(--framer-color-tint-default);--input-border-color-empty-hover: var(--grey-transparent);--input-border-color-error-default: var(--framer-color-destructive-default);--input-border-color-error-focus: var(--framer-color-destructive-extra-dark);--input-border-color-error-hover: var(--framer-color-destructive-default);--input-border-color-focus: var(--framer-color-tint-default);--input-border-color-hover: var(--grey-transparent);--input-border-color-onselected-default: var(--framer-color-tint-default);--input-border-color-onselected-hover: var(--framer-color-tint-default);--input-border-offset-default: var(--size-null);--input-border-offset-disabled: var(--size-neg-unit);--input-border-offset-empty-default: var(--size-null);--input-border-offset-empty-error-default: var(--size-neg-unit);--input-border-offset-empty-error-focus: var(--size-neg-unit);--input-border-offset-empty-error-hover: var(--size-neg-unit);--input-border-offset-empty-focus: var(--size-neg-unit);--input-border-offset-empty-hover: var(--size-neg-unit);--input-border-offset-error-default: var(--size-neg-unit);--input-border-offset-error-focus: var(--size-neg-unit);--input-border-offset-error-hover: var(--size-neg-unit);--input-border-offset-focus: var(--size-neg-unit);--input-border-offset-hover: var(--size-neg-unit);--input-border-offset-onselected-default: var(--size-neg-unit);--input-border-offset-onselected-hover: var(--size-neg-unit);--input-border-width-default: var(--size-null);--input-border-width-disabled: var(--size-pos-unit);--input-border-width-empty-default: var(--size-null);--input-border-width-empty-error-default: var(--size-pos-unit);--input-border-width-empty-error-focus: var(--size-pos-unit);--input-border-width-empty-error-hover: var(--size-pos-unit);--input-border-width-empty-focus: var(--size-pos-unit);--input-border-width-empty-hover: var(--size-pos-unit);--input-border-width-error-default: var(--size-pos-unit);--input-border-width-error-focus: var(--size-pos-unit);--input-border-width-error-hover: var(--size-pos-unit);--input-border-width-focus: var(--size-pos-unit);--input-border-width-hover: var(--size-pos-unit);--input-border-width-onselected-default: var(--size-pos-unit);--input-border-width-onselected-hover: var(--size-pos-unit);--input-clearable-right: var(--size-pos-xxxsmall);--input-clearable-top: var(--size-pos-xxxsmall);--input-color-width: 112px;--input-color-chip-border-default: inset 0px 0px 0px 1px color(srgb 0 0 0 / .1);--input-color-chip-border-focus: inset 0px 0px 0px 1px color(srgb 0 .6 1 / 1);--input-color-chip-height: var(--size-pos-small);--input-color-chip-left: var(--size-pos-xxxsmall);--input-color-chip-opacity-default: var(--alpha-1000);--input-color-chip-opacity-disabled: var(--alpha-500);--input-color-chip-radius: var(--border-radius-medium);--input-color-chip-width: var(--size-pos-small);--input-gap: var(--size-pos-xxsmall);--input-height: var(--size-pos-medium);--input-icon-color: var(--framer-color-text-tertiary);--input-icon-height: var(--size-pos-medium);--input-icon-width: var(--size-pos-medium);--input-number-width: 112px;--input-padding-clearable-bottom: var(--size-pos-medium);--input-padding-clearable-left: var(--size-pos-medium);--input-padding-clearable-right: var(--size-pos-medium);--input-padding-clearable-top: var(--size-pos-medium);--input-padding-default-bottom: var(--size-pos-xxsmall);--input-padding-default-left: var(--size-pos-xxsmall);--input-padding-default-right: var(--size-pos-xxsmall);--input-padding-default-top: var(--size-pos-xxsmall);--input-padding-unit-bottom: var(--size-pos-small);--input-padding-unit-left: var(--size-pos-small);--input-padding-unit-right: var(--size-pos-small);--input-padding-unit-top: var(--size-pos-small);--input-padding-with-color-bottom: var(--size-pos-small);--input-padding-with-color-left: var(--size-pos-xmedium);--input-padding-with-color-right: var(--size-pos-small);--input-padding-with-color-top: var(--size-pos-small);--input-padding-with-icon-bottom: var(--size-pos-small);--input-padding-with-icon-left: var(--size-pos-medium);--input-padding-with-icon-right: var(--size-pos-msmall);--input-padding-with-icon-top: var(--size-pos-small);--input-radius: var(--border-radius-xlarge);--input-status-gap: var(--size-pos-xxsmall);--input-status-height-default: var(--size-pos-medium);--input-status-height-long-text: var(--size-pos-medium);--input-text-color-default: var(--framer-color-text-default);--input-text-color-disabled: var(--framer-color-text-tertiary);--input-text-color-empty-default: var(--framer-color-text-default);--input-text-color-empty-error-default: var(--framer-color-text-default);--input-text-color-empty-error-focus: var(--framer-color-text-default);--input-text-color-empty-error-hover: var(--framer-color-text-default);--input-text-color-empty-focus: var(--framer-color-text-default);--input-text-color-empty-hover: var(--framer-color-text-default);--input-text-color-error-default: var(--framer-color-text-default);--input-text-color-error-focus: var(--framer-color-text-default);--input-text-color-error-hover: var(--framer-color-text-default);--input-text-color-focus: var(--framer-color-text-default);--input-text-color-hover: var(--framer-color-text-default);--input-text-font-family: var(--text-font-family);--input-text-font-size: var(--font-size-small);--input-text-font-weight: var(--font-weight-medium);--input-text-letter-spacing: var(--font-letter-spacing-pos-large);--input-text-line-height: var(--font-line-height-default);--input-text-placeholder-color-default: var(--framer-color-text-secondary);--input-text-placeholder-color-disabled: var(--framer-color-text-tertiary);--input-text-placeholder-color-empty-default: var(--framer-color-text-secondary);--input-text-placeholder-color-empty-error-default: var(--framer-color-text-secondary);--input-text-placeholder-color-empty-error-focus: var(--framer-color-text-secondary);--input-text-placeholder-color-empty-error-hover: var(--framer-color-text-secondary);--input-text-placeholder-color-empty-focus: var(--framer-color-text-secondary);--input-text-placeholder-color-empty-hover: var(--framer-color-text-secondary);--input-text-placeholder-color-error-default: var(--framer-color-text-secondary);--input-text-placeholder-color-error-focus: var(--framer-color-text-secondary);--input-text-placeholder-color-error-hover: var(--framer-color-text-secondary);--input-text-placeholder-color-focus: var(--framer-color-text-secondary);--input-text-placeholder-color-hover: var(--framer-color-text-secondary);--input-textarea-background-color: var(--framer-color-bg-secondary);--input-textarea-border-color: var(--grey-transparent);--input-textarea-border-offset: var(--size-null);--input-textarea-border-width: var(--size-null);--input-textarea-min-height: var(--size-pos-xxlarge);--input-textarea-padding-bottom: var(--size-pos-xxsmall);--input-textarea-padding-left: var(--size-pos-xxsmall);--input-textarea-padding-right: var(--size-pos-xxsmall);--input-textarea-padding-top: var(--size-pos-xxsmall);--input-textarea-text-color: var(--framer-color-text-default);--input-textarea-text-placeholder-color: var(--framer-color-text-secondary)}.textarea{display:flex;position:relative;align-items:center;cursor:inherit;padding:var(--input-textarea-padding-top) var(--input-textarea-padding-right) var(--input-textarea-padding-bottom) var(--input-textarea-padding-left);width:100%;min-height:var(--input-textarea-min-height);overflow:visible;overflow:hidden auto;resize:none;font-weight:var(--input-text-font-weight);font-size:var(--input-text-font-size);line-height:var(--input-text-line-height);font-family:var(--input-text-font-family);letter-spacing:var(--input-text-letter-spacing);--input-border-width: var(--input-border-width-empty-default);--input-border-offset: var(--input-border-offset-empty-default);--input-border-color: var(--input-border-color-empty-default)}.textarea--monospace{font-family:monospace}.input{display:flex;position:relative;align-items:start;gap:var(--input-gap);cursor:default;-webkit-user-select:none;user-select:none}.input.input--blocked{pointer-events:none}.input--with-icon .input__field{padding-left:var(--input-padding-with-icon-left)}.input--with-color .input__field{padding-left:var(--input-padding-with-color-left)}.input input{cursor:inherit;-webkit-user-select:none;user-select:none}.input input[type=color i]{position:absolute;top:50%;left:var(--input-color-chip-left);transform:translateY(-50%);appearance:none;opacity:var(--input-color-chip-opacity);z-index:1;outline:none;border:none;background-color:transparent;padding:0;width:var(--input-color-chip-width);height:var(--input-color-chip-height)}.input input[type=color i]::-webkit-color-swatch-wrapper{padding:0}.input input[type=color i]::-webkit-color-swatch{box-shadow:var(--input-color-chip-border);border:none;border-radius:var(--input-color-chip-radius)}.input input[type=color i]::-webkit-color-swatch{--input-color-chip-border: var(--input-color-chip-border-default)}@media(prefers-color-scheme:dark){.input input[type=color i]{color-scheme:dark}}@media(prefers-color-scheme:light){.input input[type=color i]{color-scheme:light}}.input input[type=color i]{--input-color-chip-opacity: var(--input-color-chip-opacity-default)}.input input[type=color i]:focus::-webkit-color-swatch{--input-color-chip-border: var(--input-color-chip-border-focus)}.input input[type=color i]:focus~.input__field{--input-background-color: var(--input-background-color-focus);--input-border-width: var(--input-border-width-focus);--input-border-offset: var(--input-border-offset-focus);--input-border-color: var(--input-border-color-focus);--input-text-color: var(--input-text-color-focus);--input-text-placeholder-color: var(--input-text-placeholder-color-focus)}.input input[type=number]{width:var(--input-number-width)}.input input[type=color]~.input__field{width:var(--input-color-width)}.input input[type=number]::-webkit-inner-spin-button{display:none}.input input[type=number]{appearance:textfield}.input__wrapper{position:relative;flex:1}.input.input--flex .input__wrapper{flex:1}.input__icon,.input__unit{display:flex;position:absolute;justify-content:center;align-items:center;z-index:2;width:var(--input-icon-width);height:var(--input-icon-height);--icon-letter-color: var(--input-icon-color);--icon-picto-color: var(--input-icon-color)}.input__icon{top:0;left:0}.input__unit{top:0;right:0;pointer-events:none}.input__field{display:flex;position:relative;align-items:center;box-sizing:border-box;outline:var(--input-border-width) solid var(--input-border-color);outline-offset:var(--input-border-offset);border:none;border-radius:var(--input-radius);background-color:var(--input-background-color);padding:var(--input-padding-default-top) var(--input-padding-default-right) var(--input-padding-default-bottom) var(--input-padding-default-left);width:100%;height:var(--input-height);overflow:visible;color:var(--input-text-color);font-weight:var(--input-text-font-weight);font-size:var(--input-text-font-size);line-height:var(--input-text-line-height);font-family:var(--input-text-font-family);letter-spacing:var(--input-text-letter-spacing)}.input__field{--input-border-width: var(--input-border-width-default);--input-border-offset: var(--input-border-offset-default);--input-border-color: var(--input-border-color-default);--input-background-color: var(--input-background-color-default);--input-text-color: var(--input-text-color-default)}.input__field::placeholder{color:var(--input-text-placeholder-color)}.input__field:disabled{pointer-events:none}.input__field:placeholder-shown{--input-background-color: var(--input-background-color-empty-default);--input-border-width: var(--input-border-width-empty-default);--input-border-offset: var(--input-border-offset-empty-default);--input-border-color: var(--input-border-color-empty-default);--input-text-color: var(--input-text-color-empty-default);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-default )}.input__field:placeholder-shown:hover{--input-background-color: var(--input-background-color-empty-hover);--input-border-width: var(--input-border-width-empty-hover);--input-border-offset: var(--input-border-offset-empty-hover);--input-border-color: var(--input-border-color-empty-hover);--input-text-color: var(--input-text-color-empty-hover);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-hover )}.input__field:placeholder-shown:focus{--input-background-color: var(--input-background-color-empty-focus);--input-border-width: var(--input-border-width-empty-focus);--input-border-offset: var(--input-border-offset-empty-focus);--input-border-color: var(--input-border-color-empty-focus);--input-text-color: var(--input-text-color-empty-focus);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-focus )}.input__field--error:placeholder-shown{--input-background-color: var( --input-background-color-empty-error-default );--input-border-width: var(--input-border-width-empty-error-default);--input-border-offset: var(--input-border-offset-empty-error-default);--input-border-color: var(--input-border-color-empty-error-default);--input-text-color: var(--input-text-color-empty-error-default);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-error-default )}.input__field--error:placeholder-shown:hover{--input-background-color: var(--input-background-color-empty-error-hover);--input-border-width: var(--input-border-width-empty-error-hover);--input-border-offset: var(--input-border-offset-empty-error-hover);--input-border-color: var(--input-border-color-empty-error-hover);--input-text-color: var(--input-text-color-empty-error-hover);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-error-hover )}.input__field--error:placeholder-shown:focus{--input-background-color: var(--input-background-color-empty-error-focus);--input-border-width: var(--input-border-width-empty-error-focus);--input-border-offset: var(--input-border-offset-empty-error-focus);--input-border-color: var(--input-border-color-empty-error-focus);--input-text-color: var(--input-text-color-empty-error-focus);--input-text-placeholder-color: var( --input-text-placeholder-color-empty-error-focus )}.input__field:hover{--input-background-color: var(--input-background-color-hover);--input-border-width: var(--input-border-width-hover);--input-border-offset: var(--input-border-offset-hover);--input-border-color: var(--input-border-color-hover);--input-text-color: var(--input-text-color-hover);--input-text-placeholder-color: var(--input-text-placeholder-color-hover)}.input__field:focus{--input-background-color: var(--input-background-color-focus);--input-border-width: var(--input-border-width-focus);--input-border-offset: var(--input-border-offset-focus);--input-border-color: var(--input-border-color-focus);--input-text-color: var(--input-text-color-focus);--input-text-placeholder-color: var(--input-text-placeholder-color-focus)}.input__field--error{--input-background-color: var(--input-background-color-error-default);--input-border-width: var(--input-border-width-error-default);--input-border-offset: var(--input-border-offset-error-default);--input-border-color: var(--input-border-color-error-default);--input-text-color: var(--input-text-color-error-default);--input-text-placeholder-color: var( --input-text-placeholder-color-error-default )}.input__field--error:hover{--input-background-color: var(--input-background-color-error-hover);--input-border-width: var(--input-border-width-error-hover);--input-border-offset: var(--input-border-offset-error-hover);--input-border-color: var(--input-border-color-error-hover);--input-text-color: var(--input-text-color-error-hover);--input-text-placeholder-color: var( --input-text-placeholder-color-error-hover )}.input__field--error:focus{--input-background-color: var(--input-background-color-error-focus);--input-border-width: var(--input-border-width-error-focus);--input-border-offset: var(--input-border-offset-error-focus);--input-border-color: var(--input-border-color-error-focus);--input-text-color: var(--input-text-color-error-focus);--input-text-placeholder-color: var( --input-text-placeholder-color-error-focus )}.input__field:disabled{--input-background-color: var(--input-background-color-disabled);--input-border-width: var(--input-border-width-disabled);--input-border-offset: var(--input-border-offset-disabled);--input-border-color: var(--input-border-color-disabled);--input-text-color: var(--input-text-color-disabled);--input-text-placeholder-color: var( --input-text-placeholder-color-disabled )}.input__field--no-frame,.input__field--no-frame:focus{outline:none;background-color:transparent}.input__field--flex{width:100%!important}.input__field--clearable{padding-right:var(--input-padding-clearable-right)}.input__field--unit{padding-right:var(--input-padding-unit-right)}.input__color:hover~.input__field{--input-background-color: var(--input-background-color-hover);--input-border-width: var(--input-border-width-hover);--input-border-offset: var(--input-border-offset-hover);--input-border-color: var(--input-border-color-hover);--input-text-color: var(--input-text-color-hover);--input-text-placeholder-color: var(--input-text-placeholder-color-hover)}.input__color:disabled[type=color i]{--input-color-chip-opacity: var(--input-color-chip-opacity-disabled);pointer-events:none}.input__clear{position:absolute;top:var(--input-clearable-top);right:var(--input-clearable-right)}.input__status{display:flex;align-items:center;gap:var(--input-status-gap);height:var(--input-status-height)}.input__status{--input-status-height: var(--input-status-height-default)}.input--long-text{--input-status-height: var(--input-status-height-long-text)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--inputs-bar-border-color: var(--penpot-color-accent-primary);--inputs-bar-border-width: var(--size-pos-unit);--inputs-bar-gap-default: var(--size-pos-xxsmall);--inputs-bar-gap-inner: var(--size-null);--inputs-bar-input-radius: var(--border-radius-null);--inputs-bar-margin-bottom: var(--size-null);--inputs-bar-margin-left: var(--size-neg-unit);--inputs-bar-margin-right: var(--size-neg-unit);--inputs-bar-margin-top: var(--size-null);--inputs-bar-padding-bottom: var(--size-null);--inputs-bar-padding-left: var(--size-pos-unit);--inputs-bar-padding-right: var(--size-pos-unit);--inputs-bar-padding-top: var(--size-null);--inputs-bar-radius: var(--border-radius-xlarge);--inputs-bar-width: var(--size-pos-xlarge)}:root[data-theme=sketch]{--inputs-bar-border-color: var(--sketch-color-accent-primary);--inputs-bar-border-width: var(--size-pos-unit);--inputs-bar-gap-default: var(--size-pos-xxsmall);--inputs-bar-gap-inner: var(--size-pos-xunit);--inputs-bar-input-radius: var(--border-radius-null);--inputs-bar-margin-bottom: var(--size-null);--inputs-bar-margin-left: var(--size-neg-unit);--inputs-bar-margin-right: var(--size-neg-unit);--inputs-bar-margin-top: var(--size-null);--inputs-bar-padding-bottom: var(--size-null);--inputs-bar-padding-left: var(--size-pos-unit);--inputs-bar-padding-right: var(--size-pos-unit);--inputs-bar-padding-top: var(--size-null);--inputs-bar-radius: var(--border-radius-large);--inputs-bar-width: var(--size-pos-xlarge)}:root[data-theme=figma]{--inputs-bar-border-color: var(--figma-color-border-selected);--inputs-bar-border-width: var(--size-pos-unit);--inputs-bar-gap-default: var(--size-pos-xxsmall);--inputs-bar-gap-inner: var(--size-null);--inputs-bar-input-radius: var(--border-radius-null);--inputs-bar-margin-bottom: var(--size-null);--inputs-bar-margin-left: var(--size-neg-unit);--inputs-bar-margin-right: var(--size-neg-unit);--inputs-bar-margin-top: var(--size-null);--inputs-bar-padding-bottom: var(--size-null);--inputs-bar-padding-left: var(--size-pos-unit);--inputs-bar-padding-right: var(--size-pos-unit);--inputs-bar-padding-top: var(--size-null);--inputs-bar-radius: var(--border-radius-medium);--inputs-bar-width: var(--size-pos-xlarge)}:root[data-theme=framer]{--inputs-bar-border-color: var(--framer-color-tint);--inputs-bar-border-width: var(--size-pos-unit);--inputs-bar-gap-default: var(--size-pos-xxsmall);--inputs-bar-gap-inner: var(--size-null);--inputs-bar-input-radius: var(--border-radius-null);--inputs-bar-margin-bottom: var(--size-null);--inputs-bar-margin-left: var(--size-neg-unit);--inputs-bar-margin-right: var(--size-neg-unit);--inputs-bar-margin-top: var(--size-null);--inputs-bar-padding-bottom: var(--size-null);--inputs-bar-padding-left: var(--size-pos-unit);--inputs-bar-padding-right: var(--size-pos-unit);--inputs-bar-padding-top: var(--size-null);--inputs-bar-radius: var(--border-radius-xlarge);--inputs-bar-width: var(--size-pos-xlarge)}.inputs{display:flex;align-items:center;gap:var(--inputs-bar-gap-default);--input-radius: var(--inputs-bar-input-radius)}.inputs:hover{--input-border-width-default: var(--input-border-width-hover);--input-border-offset-default: var(--input-border-offset-hover);--input-border-color-default: var(--input-border-color-hover)}.inputs .inputs__bar{display:flex;position:relative;gap:var(--inputs-bar-gap-inner);border-radius:var(--inputs-bar-radius);padding:var(--inputs-bar-padding-top) var(--inputs-bar-padding-right) var(--inputs-bar-padding-bottom) var(--inputs-bar-padding-left);overflow:hidden;--input-number-width: var(--inputs-bar-width);--input-color-width: var(--inputs-bar-width)}.inputs .inputs__bar .input{margin:var(--inputs-bar-margin-top) var(--inputs-bar-margin-right) var(--inputs-bar-margin-bottom) var(--inputs-bar-margin-left)}.inputs .inputs__bar .input input:focus{--input-border-width-focus: var(--input-border-width-hover);--input-border-offset-focus: var(--input-border-offset-hover);--input-border-color-focus: var(--input-border-color-hover)}.inputs .inputs__bar:focus-within{--input-border-width-default: var(--input-border-width-hover);--input-border-offset-default: var(--input-border-offset-hover);--input-border-color-default: var(--input-border-color-hover)}.inputs .inputs__bar:focus-within:before{position:absolute;z-index:2;inset:0;box-shadow:inset 0 0 0 var(--inputs-bar-border-width) var(--inputs-bar-border-color);border-radius:var(--inputs-bar-radius);pointer-events:none;content:""}
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--inputs-bar-border-color: var(--penpot-color-accent-primary-default);--inputs-bar-border-width: var(--size-pos-unit);--inputs-bar-gap-default: var(--size-pos-xxsmall);--inputs-bar-gap-inner: var(--size-null);--inputs-bar-input-radius: var(--border-radius-null);--inputs-bar-margin-bottom: var(--size-null);--inputs-bar-margin-left: var(--size-neg-unit);--inputs-bar-margin-right: var(--size-neg-unit);--inputs-bar-margin-top: var(--size-null);--inputs-bar-padding-bottom: var(--size-null);--inputs-bar-padding-left: var(--size-pos-unit);--inputs-bar-padding-right: var(--size-pos-unit);--inputs-bar-padding-top: var(--size-null);--inputs-bar-radius: var(--border-radius-xlarge);--inputs-bar-width: var(--size-pos-xlarge)}:root[data-theme=sketch]{--inputs-bar-border-color: var(--sketch-color-accent-primary);--inputs-bar-border-width: var(--size-pos-unit);--inputs-bar-gap-default: var(--size-pos-xxsmall);--inputs-bar-gap-inner: var(--size-pos-xunit);--inputs-bar-input-radius: var(--border-radius-null);--inputs-bar-margin-bottom: var(--size-null);--inputs-bar-margin-left: var(--size-neg-unit);--inputs-bar-margin-right: var(--size-neg-unit);--inputs-bar-margin-top: var(--size-null);--inputs-bar-padding-bottom: var(--size-null);--inputs-bar-padding-left: var(--size-pos-unit);--inputs-bar-padding-right: var(--size-pos-unit);--inputs-bar-padding-top: var(--size-null);--inputs-bar-radius: var(--border-radius-large);--inputs-bar-width: var(--size-pos-xlarge)}:root[data-theme=figma]{--inputs-bar-border-color: var(--figma-color-border-selected-default);--inputs-bar-border-width: var(--size-pos-unit);--inputs-bar-gap-default: var(--size-pos-xxsmall);--inputs-bar-gap-inner: var(--size-null);--inputs-bar-input-radius: var(--border-radius-null);--inputs-bar-margin-bottom: var(--size-null);--inputs-bar-margin-left: var(--size-neg-unit);--inputs-bar-margin-right: var(--size-neg-unit);--inputs-bar-margin-top: var(--size-null);--inputs-bar-padding-bottom: var(--size-null);--inputs-bar-padding-left: var(--size-pos-unit);--inputs-bar-padding-right: var(--size-pos-unit);--inputs-bar-padding-top: var(--size-null);--inputs-bar-radius: var(--border-radius-medium);--inputs-bar-width: var(--size-pos-xlarge)}:root[data-theme=framer]{--inputs-bar-border-color: var(--framer-color-tint-default);--inputs-bar-border-width: var(--size-pos-unit);--inputs-bar-gap-default: var(--size-pos-xxsmall);--inputs-bar-gap-inner: var(--size-null);--inputs-bar-input-radius: var(--border-radius-null);--inputs-bar-margin-bottom: var(--size-null);--inputs-bar-margin-left: var(--size-neg-unit);--inputs-bar-margin-right: var(--size-neg-unit);--inputs-bar-margin-top: var(--size-null);--inputs-bar-padding-bottom: var(--size-null);--inputs-bar-padding-left: var(--size-pos-unit);--inputs-bar-padding-right: var(--size-pos-unit);--inputs-bar-padding-top: var(--size-null);--inputs-bar-radius: var(--border-radius-xlarge);--inputs-bar-width: var(--size-pos-xlarge)}.inputs{display:flex;align-items:center;gap:var(--inputs-bar-gap-default);--input-radius: var(--inputs-bar-input-radius)}.inputs:hover{--input-border-width-default: var(--input-border-width-hover);--input-border-offset-default: var(--input-border-offset-hover);--input-border-color-default: var(--input-border-color-hover)}.inputs .inputs__bar{display:flex;position:relative;gap:var(--inputs-bar-gap-inner);border-radius:var(--inputs-bar-radius);padding:var(--inputs-bar-padding-top) var(--inputs-bar-padding-right) var(--inputs-bar-padding-bottom) var(--inputs-bar-padding-left);overflow:hidden;--input-number-width: var(--inputs-bar-width);--input-color-width: var(--inputs-bar-width)}.inputs .inputs__bar .input{margin:var(--inputs-bar-margin-top) var(--inputs-bar-margin-right) var(--inputs-bar-margin-bottom) var(--inputs-bar-margin-left)}.inputs .inputs__bar .input input:focus{--input-border-width-focus: var(--input-border-width-hover);--input-border-offset-focus: var(--input-border-offset-hover);--input-border-color-focus: var(--input-border-color-hover)}.inputs .inputs__bar:focus-within{--input-border-width-default: var(--input-border-width-hover);--input-border-offset-default: var(--input-border-offset-hover);--input-border-color-default: var(--input-border-color-hover)}.inputs .inputs__bar:focus-within:before{position:absolute;z-index:2;inset:0;box-shadow:inset 0 0 0 var(--inputs-bar-border-width) var(--inputs-bar-border-color);border-radius:var(--inputs-bar-radius);pointer-events:none;content:""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";:root[data-theme=penpot]{--keyboard-shortcut-item-background-color: var(--penpot-color-background-primary);--keyboard-shortcut-item-gap: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-background-color: var(--penpot-color-background-secondary);--keyboard-shortcut-item-key-border-color: var(--penpot-color-background-quaternary);--keyboard-shortcut-item-key-border-offset: var(--size-neg-unit);--keyboard-shortcut-item-key-border-width: var(--size-pos-unit);--keyboard-shortcut-item-key-gap: var(--size-pos-xxxsmall);--keyboard-shortcut-item-key-height: var(--size-pos-small);--keyboard-shortcut-item-key-min-width: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-bottom: var(--size-null);--keyboard-shortcut-item-key-padding-left: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-right: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-top: var(--size-null);--keyboard-shortcut-item-key-radius: var(--border-radius-xlarge);--keyboard-shortcut-item-min-height: var(--size-pos-medium);--keyboard-shortcut-item-padding-bottom: var(--size-null);--keyboard-shortcut-item-padding-left: var(--size-pos-small);--keyboard-shortcut-item-padding-right: var(--size-pos-small);--keyboard-shortcut-item-padding-top: var(--size-null);--keyboard-shortcut-item-separator-padding-bottom: var(--size-null);--keyboard-shortcut-item-separator-padding-left: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-right: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-top: var(--size-null)}:root[data-theme=sketch]{--keyboard-shortcut-item-background-color: var(--sketch-color-background-primary);--keyboard-shortcut-item-gap: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-background-color: var(--sketch-color-background-secondary);--keyboard-shortcut-item-key-border-color: var(--sketch-color-border-secondary);--keyboard-shortcut-item-key-border-offset: var(--size-neg-unit);--keyboard-shortcut-item-key-border-width: var(--size-pos-unit);--keyboard-shortcut-item-key-gap: var(--size-pos-xxxsmall);--keyboard-shortcut-item-key-height: var(--size-pos-small);--keyboard-shortcut-item-key-min-width: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-bottom: var(--size-null);--keyboard-shortcut-item-key-padding-left: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-right: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-top: var(--size-null);--keyboard-shortcut-item-key-radius: var(--border-radius-xxlarge);--keyboard-shortcut-item-min-height: var(--size-pos-medium);--keyboard-shortcut-item-padding-bottom: var(--size-null);--keyboard-shortcut-item-padding-left: var(--size-pos-small);--keyboard-shortcut-item-padding-right: var(--size-pos-small);--keyboard-shortcut-item-padding-top: var(--size-null);--keyboard-shortcut-item-separator-padding-bottom: var(--size-null);--keyboard-shortcut-item-separator-padding-left: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-right: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-top: var(--size-null)}:root[data-theme=figma]{--keyboard-shortcut-item-background-color: var(--figma-color-bg);--keyboard-shortcut-item-gap: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-background-color: var(--figma-color-bg);--keyboard-shortcut-item-key-border-color: var(--figma-color-border);--keyboard-shortcut-item-key-border-offset: var(--size-neg-unit);--keyboard-shortcut-item-key-border-width: var(--size-pos-unit);--keyboard-shortcut-item-key-gap: var(--size-pos-xxxsmall);--keyboard-shortcut-item-key-height: var(--size-pos-small);--keyboard-shortcut-item-key-min-width: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-bottom: var(--size-null);--keyboard-shortcut-item-key-padding-left: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-right: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-top: var(--size-null);--keyboard-shortcut-item-key-radius: var(--border-radius-large);--keyboard-shortcut-item-min-height: var(--size-pos-medium);--keyboard-shortcut-item-padding-bottom: var(--size-null);--keyboard-shortcut-item-padding-left: var(--size-pos-small);--keyboard-shortcut-item-padding-right: var(--size-pos-small);--keyboard-shortcut-item-padding-top: var(--size-null);--keyboard-shortcut-item-separator-padding-bottom: var(--size-null);--keyboard-shortcut-item-separator-padding-left: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-right: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-top: var(--size-null)}:root[data-theme=framer]{--keyboard-shortcut-item-background-color: var(--framer-color-bg);--keyboard-shortcut-item-gap: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-background-color: var(--framer-color-bg-tertiary);--keyboard-shortcut-item-key-border-color: transparent;--keyboard-shortcut-item-key-border-offset: var(--size-null);--keyboard-shortcut-item-key-border-width: var(--size-null);--keyboard-shortcut-item-key-gap: var(--size-pos-xunit);--keyboard-shortcut-item-key-height: var(--size-pos-small);--keyboard-shortcut-item-key-min-width: var(--size-pos-xsmall);--keyboard-shortcut-item-key-padding-bottom: var(--size-null);--keyboard-shortcut-item-key-padding-left: var(--size-pos-xxxsmall);--keyboard-shortcut-item-key-padding-right: var(--size-pos-xxxsmall);--keyboard-shortcut-item-key-padding-top: var(--size-null);--keyboard-shortcut-item-key-radius: var(--border-radius-medium);--keyboard-shortcut-item-min-height: var(--size-pos-medium);--keyboard-shortcut-item-padding-bottom: var(--size-null);--keyboard-shortcut-item-padding-left: var(--size-pos-small);--keyboard-shortcut-item-padding-right: var(--size-pos-small);--keyboard-shortcut-item-padding-top: var(--size-null);--keyboard-shortcut-item-separator-padding-bottom: var(--size-null);--keyboard-shortcut-item-separator-padding-left: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-right: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-top: var(--size-null)}.keyboard-shortcut-item{display:flex;justify-content:space-between;align-items:center;gap:var(--keyboard-shortcut-item-gap);background-color:var(--keyboard-shortcut-item-background-color);padding:var(--keyboard-shortcut-item-padding-top) var(--keyboard-shortcut-item-padding-right) var(--keyboard-shortcut-item-padding-bottom) var(--keyboard-shortcut-item-padding-left);min-height:var(--keyboard-shortcut-item-min-height);-webkit-user-select:none;user-select:none}@media(max-width:460px){.keyboard-shortcut-item{flex-direction:column}}.keyboard-shortcut-item .keyboard-shortcut-item__keys{display:flex;align-items:center;gap:var(--keyboard-shortcut-item-key-gap)}.keyboard-shortcut-item .keyboard-shortcut-item__key{display:flex;justify-content:center;align-items:center;outline:var(--keyboard-shortcut-item-key-border-width) solid var(--keyboard-shortcut-item-key-border-color);outline-offset:var(--keyboard-shortcut-item-key-border-offset);border-radius:var(--keyboard-shortcut-item-key-radius);background-color:var(--keyboard-shortcut-item-key-background-color);padding:var(--keyboard-shortcut-item-key-padding-top) var(--keyboard-shortcut-item-key-padding-right) var(--keyboard-shortcut-item-key-padding-bottom) var(--keyboard-shortcut-item-key-padding-left);min-width:var(--keyboard-shortcut-item-key-min-width);height:var(--keyboard-shortcut-item-key-height);white-space:nowrap}.keyboard-shortcut-item .keyboard-shortcut-item__separator{padding:var(--keyboard-shortcut-item-separator-padding-top) var(--keyboard-shortcut-item-separator-padding-right) var(--keyboard-shortcut-item-separator-padding-bottom) var(--keyboard-shortcut-item-separator-padding-left)}
|
|
1
|
+
@charset "UTF-8";:root[data-theme=penpot]{--keyboard-shortcut-item-background-color: var(--penpot-color-background-primary);--keyboard-shortcut-item-gap: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-background-color: var(--penpot-color-background-secondary);--keyboard-shortcut-item-key-border-color: var(--penpot-color-background-quaternary);--keyboard-shortcut-item-key-border-offset: var(--size-neg-unit);--keyboard-shortcut-item-key-border-width: var(--size-pos-unit);--keyboard-shortcut-item-key-gap: var(--size-pos-xxxsmall);--keyboard-shortcut-item-key-height: var(--size-pos-small);--keyboard-shortcut-item-key-min-width: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-bottom: var(--size-null);--keyboard-shortcut-item-key-padding-left: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-right: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-top: var(--size-null);--keyboard-shortcut-item-key-radius: var(--border-radius-xlarge);--keyboard-shortcut-item-min-height: var(--size-pos-medium);--keyboard-shortcut-item-padding-bottom: var(--size-null);--keyboard-shortcut-item-padding-left: var(--size-pos-small);--keyboard-shortcut-item-padding-right: var(--size-pos-small);--keyboard-shortcut-item-padding-top: var(--size-null);--keyboard-shortcut-item-separator-padding-bottom: var(--size-null);--keyboard-shortcut-item-separator-padding-left: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-right: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-top: var(--size-null)}:root[data-theme=sketch]{--keyboard-shortcut-item-background-color: var(--sketch-color-background-primary);--keyboard-shortcut-item-gap: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-background-color: var(--sketch-color-background-secondary);--keyboard-shortcut-item-key-border-color: var(--sketch-color-border-secondary);--keyboard-shortcut-item-key-border-offset: var(--size-neg-unit);--keyboard-shortcut-item-key-border-width: var(--size-pos-unit);--keyboard-shortcut-item-key-gap: var(--size-pos-xxxsmall);--keyboard-shortcut-item-key-height: var(--size-pos-small);--keyboard-shortcut-item-key-min-width: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-bottom: var(--size-null);--keyboard-shortcut-item-key-padding-left: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-right: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-top: var(--size-null);--keyboard-shortcut-item-key-radius: var(--border-radius-xxlarge);--keyboard-shortcut-item-min-height: var(--size-pos-medium);--keyboard-shortcut-item-padding-bottom: var(--size-null);--keyboard-shortcut-item-padding-left: var(--size-pos-small);--keyboard-shortcut-item-padding-right: var(--size-pos-small);--keyboard-shortcut-item-padding-top: var(--size-null);--keyboard-shortcut-item-separator-padding-bottom: var(--size-null);--keyboard-shortcut-item-separator-padding-left: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-right: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-top: var(--size-null)}:root[data-theme=figma]{--keyboard-shortcut-item-background-color: var(--figma-color-bg-default);--keyboard-shortcut-item-gap: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-background-color: var(--figma-color-bg-default);--keyboard-shortcut-item-key-border-color: var(--figma-color-border-default);--keyboard-shortcut-item-key-border-offset: var(--size-neg-unit);--keyboard-shortcut-item-key-border-width: var(--size-pos-unit);--keyboard-shortcut-item-key-gap: var(--size-pos-xxxsmall);--keyboard-shortcut-item-key-height: var(--size-pos-small);--keyboard-shortcut-item-key-min-width: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-bottom: var(--size-null);--keyboard-shortcut-item-key-padding-left: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-right: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-padding-top: var(--size-null);--keyboard-shortcut-item-key-radius: var(--border-radius-large);--keyboard-shortcut-item-min-height: var(--size-pos-medium);--keyboard-shortcut-item-padding-bottom: var(--size-null);--keyboard-shortcut-item-padding-left: var(--size-pos-small);--keyboard-shortcut-item-padding-right: var(--size-pos-small);--keyboard-shortcut-item-padding-top: var(--size-null);--keyboard-shortcut-item-separator-padding-bottom: var(--size-null);--keyboard-shortcut-item-separator-padding-left: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-right: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-top: var(--size-null)}:root[data-theme=framer]{--keyboard-shortcut-item-background-color: var(--framer-color-bg-default);--keyboard-shortcut-item-gap: var(--size-pos-xxsmall);--keyboard-shortcut-item-key-background-color: var(--framer-color-bg-tertiary);--keyboard-shortcut-item-key-border-color: var(--grey-transparent);--keyboard-shortcut-item-key-border-offset: var(--size-null);--keyboard-shortcut-item-key-border-width: var(--size-null);--keyboard-shortcut-item-key-gap: var(--size-pos-xunit);--keyboard-shortcut-item-key-height: var(--size-pos-small);--keyboard-shortcut-item-key-min-width: var(--size-pos-xsmall);--keyboard-shortcut-item-key-padding-bottom: var(--size-null);--keyboard-shortcut-item-key-padding-left: var(--size-pos-xxxsmall);--keyboard-shortcut-item-key-padding-right: var(--size-pos-xxxsmall);--keyboard-shortcut-item-key-padding-top: var(--size-null);--keyboard-shortcut-item-key-radius: var(--border-radius-medium);--keyboard-shortcut-item-min-height: var(--size-pos-medium);--keyboard-shortcut-item-padding-bottom: var(--size-null);--keyboard-shortcut-item-padding-left: var(--size-pos-small);--keyboard-shortcut-item-padding-right: var(--size-pos-small);--keyboard-shortcut-item-padding-top: var(--size-null);--keyboard-shortcut-item-separator-padding-bottom: var(--size-null);--keyboard-shortcut-item-separator-padding-left: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-right: var(--size-pos-xxxsmall);--keyboard-shortcut-item-separator-padding-top: var(--size-null)}.keyboard-shortcut-item{display:flex;justify-content:space-between;align-items:center;gap:var(--keyboard-shortcut-item-gap);background-color:var(--keyboard-shortcut-item-background-color);padding:var(--keyboard-shortcut-item-padding-top) var(--keyboard-shortcut-item-padding-right) var(--keyboard-shortcut-item-padding-bottom) var(--keyboard-shortcut-item-padding-left);min-height:var(--keyboard-shortcut-item-min-height);-webkit-user-select:none;user-select:none}@media(max-width:460px){.keyboard-shortcut-item{flex-direction:column}}.keyboard-shortcut-item .keyboard-shortcut-item__keys{display:flex;align-items:center;gap:var(--keyboard-shortcut-item-key-gap)}.keyboard-shortcut-item .keyboard-shortcut-item__key{display:flex;justify-content:center;align-items:center;outline:var(--keyboard-shortcut-item-key-border-width) solid var(--keyboard-shortcut-item-key-border-color);outline-offset:var(--keyboard-shortcut-item-key-border-offset);border-radius:var(--keyboard-shortcut-item-key-radius);background-color:var(--keyboard-shortcut-item-key-background-color);padding:var(--keyboard-shortcut-item-key-padding-top) var(--keyboard-shortcut-item-key-padding-right) var(--keyboard-shortcut-item-key-padding-bottom) var(--keyboard-shortcut-item-key-padding-left);min-width:var(--keyboard-shortcut-item-key-min-width);height:var(--keyboard-shortcut-item-key-height);white-space:nowrap}.keyboard-shortcut-item .keyboard-shortcut-item__separator{padding:var(--keyboard-shortcut-item-separator-padding-top) var(--keyboard-shortcut-item-separator-padding-right) var(--keyboard-shortcut-item-separator-padding-bottom) var(--keyboard-shortcut-item-separator-padding-left)}
|