@spectrum-web-components/textfield
Version:
`sp-textfield` components are text boxes that allow users to input custom text entries with a keyboard. Various decorations can be displayed around the field to communicate the entry requirements.
8 lines (7 loc) • 2.63 kB
JavaScript
;
import { css } from "@spectrum-web-components/base";
const styles = css`
:host{--spectrum-textfield-background-color:var(--system-textfield-background-color);--spectrum-textfield-background-color-disabled:var(--system-textfield-background-color-disabled);--spectrum-textfield-border-color:var(--system-textfield-border-color);--spectrum-textfield-border-color-hover:var(--system-textfield-border-color-hover);--spectrum-textfield-border-color-focus:var(--system-textfield-border-color-focus);--spectrum-textfield-border-color-focus-hover:var(--system-textfield-border-color-focus-hover);--spectrum-textfield-border-color-keyboard-focus:var(--system-textfield-border-color-keyboard-focus);--spectrum-textfield-border-color-disabled:var(--system-textfield-border-color-disabled);--spectrum-textfield-border-width:var(--system-textfield-border-width);--spectrum-textfield-spacing-block-start:var(--system-textfield-spacing-block-start);--spectrum-textfield-spacing-block-end:var(--system-textfield-spacing-block-end);--spectrum-textfield-corner-radius:var(--system-textfield-corner-radius);--spectrum-textfield-icon-spacing-block-invalid:var(--system-textfield-icon-spacing-block-invalid)}:host([size=s]) #textfield#textfield{--spectrum-textfield-spacing-block-start:var(--system-textfield-spacing-block-start-small);--spectrum-textfield-spacing-block-end:var(--system-textfield-spacing-block-end-small);--spectrum-textfield-icon-spacing-block-invalid:var(--system-textfield-size-s-icon-spacing-block-invalid);--spectrum-textfield-corner-radius:var(--system-textfield-corner-radius-small)}:host([size=l]) #textfield#textfield{--spectrum-textfield-spacing-block-start:var(--system-textfield-spacing-block-start-large);--spectrum-textfield-spacing-block-end:var(--system-textfield-spacing-block-end-large);--spectrum-textfield-icon-spacing-block-invalid:var(--system-textfield-size-l-icon-spacing-block-invalid);--spectrum-textfield-corner-radius:var(--system-textfield-corner-radius-large)}:host([size=xl]) #textfield#textfield{--spectrum-textfield-spacing-block-start:var(--system-textfield-spacing-block-start-extra-large);--spectrum-textfield-spacing-block-end:var(--system-textfield-spacing-block-end-extra-large);--spectrum-textfield-icon-spacing-block-invalid:var(--system-textfield-size-xl-icon-spacing-block-invalid);--spectrum-textfield-corner-radius:var(--system-textfield-corner-radius-extra-large)}:host([quiet]) #textfield{--spectrum-textfield-border-color-disabled:var(--system-textfield-quiet-border-color-disabled)}
`;
export default styles;
//# sourceMappingURL=textfield-overrides.css.dev.js.map