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 3.08 kB
import { css } from 'lit'; export const styles = css `:host{--component-size: var(--ig-size, var(--default-size))}:host button:focus{outline:.25rem solid var(--focus-outline-color)}:host([selected]) button:not([disabled]):focus{box-shadow:0 0 0 .25rem var(--focus-selected-outline-color)}:host([variant=primary]) button,:host([selected][variant=primary]) button:not([disabled]){color:var(--ig-primary-700-contrast);border-color:rgba(0,0,0,0)}:host([variant=primary]) button:focus,:host([selected][variant=primary]) button:not([disabled]):focus{background:var(--ig-primary-500);color:var(--ig-primary-700-contrast);outline:.25rem solid hsl(from var(--ig-primary-500) h s l/0.38)}:host([variant=primary]) button:hover,:host([selected][variant=primary]) button:not([disabled]):hover{background:var(--ig-primary-600);color:var(--ig-primary-700-contrast)}:host([variant=info]) button,:host([selected][variant=info]) button:not([disabled]){color:var(--ig-info-700-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-700-contrast);outline:.25rem solid hsl(from var(--ig-info-500) h s l/0.38)}:host([variant=info]) button:hover,:host([selected][variant=info]) button:not([disabled]):hover{background:var(--ig-info-600);color:var(--ig-info-700-contrast)}:host([variant=success]) button,:host([selected][variant=success]) button:not([disabled]){color:var(--ig-success-700-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-700-contrast);outline:.25rem solid hsl(from var(--ig-success-500) h s l/0.38)}:host([variant=success]) button:hover,:host([selected][variant=success]) button:not([disabled]):hover{background:var(--ig-success-600);color:var(--ig-success-700-contrast)}:host([variant=warning]) button,:host([selected][variant=warning]) button:not([disabled]){color:var(--ig-warn-700-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-700-contrast);outline:.25rem solid hsl(from var(--ig-warn-500) h s l/0.38)}:host([variant=warning]) button:hover,:host([selected][variant=warning]) button:not([disabled]):hover{background:var(--ig-warn-600);color:var(--ig-warn-700-contrast)}:host([variant=danger]) button,:host([selected][variant=danger]) button:not([disabled]){color:var(--ig-error-700-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-700-contrast);outline:.25rem solid hsl(from var(--ig-error-500) h s l/0.38)}:host([variant=danger]) button:hover,:host([selected][variant=danger]) button:not([disabled]):hover{background:var(--ig-error-600);color:var(--ig-error-700-contrast)}`; //# sourceMappingURL=chip.bootstrap.css.js.map