@cds/core
Version:
Clarity Design System - common components, themes, and utilties
3 lines (2 loc) • 2.94 kB
JavaScript
import{css as a}from"lit";var c=a`:host{--color:var(--cds-global-color-construction-300, #aeb8bc);--cursor:ew-resize;--padding:0;--height:100%;--width:var(--cds-global-space-1, calc(1 * 1rem / var(--cds-global-base, 20)));--min-height:var(--cds-alias-object-interaction-touch-target, calc(36 * 1rem / var(--cds-global-base, 20)));--secondary-line-display:block;touch-action:pan-y}.private-host{position:relative;line-height:0;display:block;height:var(--height);width:var(--width);background:var(--color);cursor:var(--cursor);min-height:var(--min-height)}.private-host::before{content:"";position:absolute;display:var(--secondary-line-display);background:var(--color);height:var(--cds-global-space-9,calc(24 * 1rem / var(--cds-global-base,20)));width:var(--cds-global-space-1,calc(1 * 1rem / var(--cds-global-base,20)));right:calc(var(--cds-global-space-3,calc(4 * 1rem / var(--cds-global-base,20)))*-1);top:calc(50% - var(--cds-global-space-6,calc(12 * 1rem / var(--cds-global-base,20))))}.private-host::after{content:"";position:absolute;inset:0;left:calc((var(--cds-alias-object-interaction-touch-target,calc(36 * 1rem / var(--cds-global-base,20)))/ 2)*-1);min-width:var(--cds-alias-object-interaction-touch-target,calc(36 * 1rem / var(--cds-global-base,20)));min-height:var(--cds-alias-object-interaction-touch-target,calc(36 * 1rem / var(--cds-global-base,20)))}:host([direction=horizontal]){--cursor:ns-resize;--width:100%;--height:var(--cds-global-space-1, calc(1 * 1rem / var(--cds-global-base, 20)));touch-action:pan-x}:host([direction=horizontal]) .private-host{min-width:var(--cds-alias-object-interaction-touch-target,calc(36 * 1rem / var(--cds-global-base,20)));min-height:auto}:host([direction=horizontal]) .private-host::after{top:calc((var(--cds-alias-object-interaction-touch-target,calc(36 * 1rem / var(--cds-global-base,20)))/ 2)*-1);left:0}:host([direction=horizontal]) .private-host::before{content:"";position:absolute;background:var(--color);height:var(--cds-global-space-1,calc(1 * 1rem / var(--cds-global-base,20)));width:var(--cds-global-space-9,calc(24 * 1rem / var(--cds-global-base,20)));top:var(--cds-global-space-3,calc(4 * 1rem / var(--cds-global-base,20)));left:calc(50% - var(--cds-global-space-6,calc(12 * 1rem / var(--cds-global-base,20))))}:host(:focus-within){outline:var(--cds-alias-object-interaction-outline,Highlight solid 2px)} (-webkit-min-device-pixel-ratio:0){:host(:focus-within){outline-color:-webkit-focus-ring-color}}::slotted(input){clip:rect(0 0 0 0);clip-path:inset(50%);height:var(--cds-global-space-1,calc(1 * 1rem / var(--cds-global-base,20)));width:var(--cds-global-space-1,calc(1 * 1rem / var(--cds-global-base,20)));overflow:hidden;position:absolute;white-space:nowrap}:host([_readonly]){--cursor:default}:host([_readonly]) .private-host::after,:host([_readonly]) .private-host::before{display:none}`;export{c as default};
//# sourceMappingURL=split-handle.element.scss.js.map