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 1.18 kB
import { css } from 'lit'; export const styles = css `[part=track]{height:.375rem}[part=fill]{height:.375rem}[part=inactive]{height:.25rem;top:.0625rem}[part~=thumb]{width:1.25rem;height:1.25rem;top:calc((1.25rem - 0.625rem)*-1);margin-inline-start:calc((1.25rem - 0.625rem)*-1)}[part~=thumb]::after{border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 1.25rem),1.25rem);position:absolute;content:"";width:2.5rem;height:2.5rem;background:var(--thumb-color);top:calc(50% - 1.25rem);inset-inline-start:calc(50% - 1.25rem);opacity:0;transform:scale(0);transform-origin:center center;transition:transform .1s ease-out,opacity .1s ease-out;overflow:hidden}[part~=thumb]:hover::after{opacity:.12;transform:scale(1)}[part~=thumb]:focus::after{opacity:.18;transform:scale(1)}[part~=thumb]:active::after{opacity:.24}[part=tick-label]{color:var(--tick-label-color)}:host([disabled]) [part=fill],:host([disabled]) [part=tick],:host(:disabled) [part=fill],:host(:disabled) [part=tick]{background:var(--disabled-fill-track-color)}:host([disabled]) [part=tick-label],:host(:disabled) [part=tick-label]{color:var(--disabled-fill-track-color)}`; //# sourceMappingURL=slider.material.css.js.map