1 line
5.7 KiB
Plaintext
1 line
5.7 KiB
Plaintext
|
{"version":3,"sources":["../../../src/presets/material/inputtext/index.ts"],"sourcesContent":["import type { InputTextDesignTokens, InputTextTokenSections } from '@primeuix/themes/types/inputtext';\n\nexport const root: InputTextTokenSections.Root = {\n background: '{form.field.background}',\n disabledBackground: '{form.field.disabled.background}',\n filledBackground: '{form.field.filled.background}',\n filledHoverBackground: '{form.field.filled.hover.background}',\n filledFocusBackground: '{form.field.filled.focus.background}',\n borderColor: '{form.field.border.color}',\n hoverBorderColor: '{form.field.hover.border.color}',\n focusBorderColor: '{form.field.focus.border.color}',\n invalidBorderColor: '{form.field.invalid.border.color}',\n color: '{form.field.color}',\n disabledColor: '{form.field.disabled.color}',\n placeholderColor: '{form.field.placeholder.color}',\n invalidPlaceholderColor: '{form.field.invalid.placeholder.color}',\n shadow: '{form.field.shadow}',\n paddingX: '{form.field.padding.x}',\n paddingY: '{form.field.padding.y}',\n borderRadius: '{form.field.border.radius}',\n focusRing: {\n width: '{form.field.focus.ring.width}',\n style: '{form.field.focus.ring.style}',\n color: '{form.field.focus.ring.color}',\n offset: '{form.field.focus.ring.offset}',\n shadow: '{form.field.focus.ring.shadow}'\n },\n transitionDuration: '{form.field.transition.duration}',\n sm: {\n fontSize: '{form.field.sm.font.size}',\n paddingX: '{form.field.sm.padding.x}',\n paddingY: '{form.field.sm.padding.y}'\n },\n lg: {\n fontSize: '{form.field.lg.font.size}',\n paddingX: '{form.field.lg.padding.x}',\n paddingY: '{form.field.lg.padding.y}'\n }\n};\n\nexport const css: InputTextTokenSections.CSS = /*css*/ `\n.p-inputtext.p-variant-filled {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n border: 1px solid transparent;\n background: dt('inputtext.filled.background') no-repeat;\n background-image: linear-gradient(to bottom, dt('inputtext.focus.border.color'), dt('inputtext.focus.border.color')), linear-gradient(to bottom, dt('inputtext.border.color'), dt('inputtext.border.color'));\n background-size: 0 2px, 100% 1px;\n background-position: 50% 100%, 50% 100%;\n background-origin: border-box;\n transition: background-size 0.3s cubic-bezier(0.64, 0.09, 0.08, 1);\n}\n\n.p-inputtext.p-variant-filled:enabled:hover {\n background: dt('inputtext.filled.hover.background') no-repeat;\n background-image: linear-gradient(to bottom, dt('inputtext.focus.border.color'), dt('inputtext.focus.border.color')), linear-gradient(to bottom, dt('inputtext.hover.border.color'), dt('inputtext.hover.border.color'));\n background-size: 0 2px, 100% 1px;\n background-position: 50% 100%, 50% 100%;\n background-origin: border-box;\n border-color: transparent;\n}\n\n.p-inputtext.p-variant-filled:enabled:focus {\n outline: 0 none;\n background: dt('inputtext.filled.focus.background') no-repeat;\n background-image: linear-gradient(to bottom, dt('inputtext.focus.border.color'), dt('inputtext.focus.border.color')), linear-gradient(to bottom, dt('inputtext.border.color'), dt('inputtext.border.color'));\n background-size: 100% 2px, 100% 1px;\n background-position: 50% 100%, 50% 100%;\n background-origin: border-box;\n border-color: transparent;\n}\n\n.p-inputtext.p-variant-filled:enabled:hover:focus {\n background-image: linear-gradient(to bottom, dt('inputtext.focus.border.color'), dt('inputtext.focus.border.color')), linear-gradient(to bottom, dt('inputtext.hover.border.color'), dt('inputtext.hover.border.color'));\n}\n\n.p-inputtext.p-variant-filled.p-invalid {\n background-image: linear-gradient(to bottom, dt('inputtext.invalid.border.color'), dt('inputtext.invalid.border.color')), linear-gradient(to bottom, dt('inputtext.invalid.border.color'), dt('inputtext.invalid.border.color'));\n}\n\n.p-inputtext.p-variant-filled.p-invalid
|