UNPKG

igniteui-webcomponents

Version:

Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.

3 lines 4.59 kB
import { css } from 'lit'; export const styles = css `:host{--component-size: var(--ig-size, var(--default-size))}:host button{border:.0625rem solid var(--border-color);padding:0 max(var(--is-large, 1)*max(7px, -1 * 7px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(5px, -1 * 5px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(3px, -1 * 3px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host button:focus{box-shadow:0 0 0 .1875rem var(--focus-outline-color)}:host button:hover{border-color:var(--hover-border-color)}:host button[disabled]{border-color:var(--disabled-border-color)}:host button igc-icon{--size: max(var(--is-large, 1) * max(1rem, -1 * 1rem), var(--is-medium, 1) * max(0.875rem, -1 * 0.875rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host([selected]) button:not([disabled]){color:var(--selected-text-color);background:var(--selected-background);border-color:rgba(0,0,0,0)}:host([selected]) button:not([disabled]):focus{box-shadow:0 0 0 .1875rem var(--focus-selected-outline-color)}:host([selected]) button:not([disabled]):hover{color:var(--hover-selected-text-color);background:var(--hover-selected-background);border-color:var(--hover-selected-border-color)}:host([selected]) button[disabled]{background:hsl(from var(--ig-primary-400) h s l/0.5);border-color:rgba(0,0,0,0)}:host([variant=primary]) button,:host([selected][variant=primary]) button:not([disabled]){border-color:rgba(0,0,0,0)}:host([variant=primary]) button:focus,:host([selected][variant=primary]) button:not([disabled]):focus{color:var(--ig-primary-900-contrast);background:var(--ig-primary-500);box-shadow:0 0 0 .1875rem hsl(from var(--ig-primary-400) h s l/0.5)}:host([variant=primary]) button:hover,:host([selected][variant=primary]) button:not([disabled]):hover{color:var(--ig-primary-900-contrast);background:var(--ig-primary-400)}:host([variant=primary]) button[disabled]{background:hsl(from var(--ig-primary-400) h s l/0.5)}:host([variant=info]) button,:host([selected][variant=info]) button:not([disabled]){color:var(--ig-info-900-contrast);border-color:rgba(0,0,0,0)}:host([variant=info]) button:focus,:host([selected][variant=info]) button:not([disabled]):focus{background:var(--ig-info-500);color:var(--ig-info-900-contrast)}:host([variant=info]) button:hover,:host([selected][variant=info]) button:not([disabled]):hover{background:var(--ig-info-400);color:var(--ig-info-900-contrast)}:host([variant=info]) button[disabled]{color:var(--ig-info-900-contrast);background:var(--ig-info-500)}:host([variant=success]) button,:host([selected][variant=success]) button:not([disabled]){color:var(--ig-success-900-contrast);border-color:rgba(0,0,0,0)}:host([variant=success]) button:focus,:host([selected][variant=success]) button:not([disabled]):focus{background:var(--ig-success-500);color:var(--ig-success-900-contrast)}:host([variant=success]) button:hover,:host([selected][variant=success]) button:not([disabled]):hover{background:var(--ig-success-400);color:var(--ig-success-900-contrast)}:host([variant=success]) button[disabled]{color:var(--ig-success-900-contrast);background:var(--ig-success-500)}:host([variant=warning]) button,:host([selected][variant=warning]) button:not([disabled]){color:var(--ig-warn-900-contrast);border-color:rgba(0,0,0,0)}:host([variant=warning]) button:focus,:host([selected][variant=warning]) button:not([disabled]):focus{background:var(--ig-warn-500);color:var(--ig-warn-900-contrast)}:host([variant=warning]) button:hover,:host([selected][variant=warning]) button:not([disabled]):hover{background:var(--ig-warn-400);color:var(--ig-warn-900-contrast)}:host([variant=warning]) button[disabled]{color:var(--ig-warn-900-contrast);background:var(--ig-warn-500)}:host([variant=danger]) button,:host([selected][variant=danger]) button:not([disabled]){color:var(--ig-error-900-contrast);border-color:rgba(0,0,0,0)}:host([variant=danger]) button:focus,:host([selected][variant=danger]) button:not([disabled]):focus{background:var(--ig-error-500);color:var(--ig-error-900-contrast)}:host([variant=danger]) button:hover,:host([selected][variant=danger]) button:not([disabled]):hover{background:var(--ig-error-400);color:var(--ig-error-900-contrast)}:host([variant=danger]) button[disabled]{color:var(--ig-error-900-contrast);background:var(--ig-error-500)}:host([variant=info]) button[disabled],:host([variant=success]) button[disabled],:host([variant=warning]) button[disabled],:host([variant=danger]) button[disabled]{opacity:.4}`; //# sourceMappingURL=chip.indigo.css.js.map