@spectrum-web-components/color-loupe/src/color-loupe.css.dev.js

An `<sp-color-loupe>` shows the output color that would otherwise be covered by a cursor, stylus, or finger during color selection.

"use strict";
import { css } from "@spectrum-web-components/base";
const styles = css`
    :host{inline-size:var(--spectrum-color-loupe-width);block-size:var(--spectrum-color-loupe-height);transform:translateY(8px);transform:translateY(var(--mod-colorloupe-animation-distance,8px));opacity:0;transform-origin:bottom;pointer-events:none;filter:drop-shadow(var(--mod-colorloupe-drop-shadow-x,var(--spectrum-drop-shadow-x))var(--mod-colorloupe-drop-shadow-y,var(--spectrum-color-loupe-drop-shadow-y))var(--mod-colorloupe-drop-shadow-blur,var(--spectrum-color-loupe-drop-shadow-blur))var(--mod-colorloupe-drop-shadow-color,var(--spectrum-color-loupe-drop-shadow-color)));transition:transform .1s ease-in-out,opacity .125s ease-in-out;position:absolute;inset-block-end:calc(var(--spectrum-color-handle-size) - var(--spectrum-color-handle-outer-border-width) + var(--mod-colorloupe-offset,var(--spectrum-color-loupe-bottom-to-color-handle)));inset-inline-end:calc(50% - var(--spectrum-color-loupe-width)/2)}:host:dir(rtl),:host([dir=rtl]){inset-inline-end:calc(50% - var(--spectrum-color-loupe-width)/2 - 1px)}:host([open]){opacity:1;transform:translate(0)}:host .is-disabled{opacity:0}.spectrum-ColorLoupe-inner-border{fill:var(--spectrum-picked-color);stroke:var(--mod-colorloupe-inner-border-color,var(--spectrum-color-loupe-inner-border));stroke-width:var(--mod-colorloupe-inner-border-width,var(--spectrum-color-loupe-inner-border-width))}.spectrum-ColorLoupe-outer-border{fill:none;stroke:var(--highcontrast-colorloupe-outer-border-color,var(--mod-colorloupe-outer-border-color,var(--spectrum-color-loupe-outer-border)));stroke-width:calc(var(--mod-colorloupe-outer-border-width,var(--spectrum-color-loupe-outer-border-width)) + 2px)}.spectrum-ColorLoupe-checkerboard-pattern{fill:var(--spectrum-opacity-checkerboard-square-dark)}.spectrum-ColorLoupe-checkerboard-background{fill:var(--spectrum-opacity-checkerboard-square-light)}.spectrum-ColorLoupe-checkerboard-fill{fill:var(--spectrum-colorloupe-checkerboard-fill)}@media (forced-colors:active){:host{--highcontrast-colorloupe-outer-border-color:CanvasText}}svg{width:inherit;height:inherit}.loupe-clipped{clip-path:path("M23 61.575C19.0044 57.435 15.2591 53.0606 11.784 48.475C8.68949 44.4532 5.96348 40.1608 3.639 35.65C1.224 30.8 0 26.549 0 23C0.00319993 17.6937 1.84059 12.5516 5.20091 8.44488C8.56122 4.33815 13.2378 1.51928 18.4385 0.465803C23.6392 -0.587678 29.0442 0.189006 33.7378 2.66428C38.4314 5.13955 42.125 9.16122 44.193 14.048C45.3915 16.88 46.0061 19.9248 46 23C46 26.551 44.774 30.811 42.355 35.661C40.0274 40.1747 37.298 44.4698 34.2 48.494C30.7297 53.0728 26.9898 57.4409 23 61.575ZZ")}.opacity-checkerboard{block-size:100%;inline-size:100%;position:absolute;top:2px;left:2px}
`;
export default styles;
//# sourceMappingURL=color-loupe.css.dev.js.map