igniteui-webcomponents/components/nav-drawer/themes/container.base.css.js

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.

import { css } from 'lit';
export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}:host{--menu-full-width: 15rem;--menu-height: 50vh;--transition-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);--transition-duration: 0.35s;display:flex;flex-shrink:0;font-family:var(--ig-font-family)}:host [part=base],:host [part=mini]{--ig-scrollbar-size: rem(8px);margin:unset;border:unset;outline-style:none;height:100%;min-height:100%;overflow-x:hidden}:host [part=mini]{width:var(--menu-mini-width);transition-behavior:allow-discrete;transition-duration:var(--transition-duration);transition-timing-function:var(--transition-function);transition-property:display,translate,overlay}:host [part=mini]::backdrop{display:none}:host [part=base]{box-sizing:border-box;width:var(--menu-full-width);padding:unset;transition-behavior:allow-discrete;transition-duration:var(--transition-duration);transition-timing-function:var(--transition-function);transition-property:translate,opacity,overlay,display}:host [part=base]::backdrop{transition-behavior:allow-discrete;transition-duration:var(--transition-duration);transition-timing-function:var(--transition-function);transition-property:opacity,display;opacity:0}:host [part=base]:open::backdrop{opacity:1}@starting-style{:host [part=base]:open::backdrop{opacity:0}}:host [part=main]{width:100%}:host([position=start]) [part=base],:host([position=start]) [part=mini]{border:none;border-inline-end-style:solid;border-inline-end-width:.0625rem;margin-inline-end:auto}:host([position=end]) [part=base],:host([position=end]) [part=mini]{border:none;border-inline-start-style:solid;border-inline-start-width:.0625rem;margin-inline-start:auto}:host([position=start]),:host([dir=rtl][position=end]){--dir: calc(var(--ig-dir, 1) * -1)}:host([position=end]),:host([dir=rtl][position=start]){--dir: calc(var(--ig-dir, 1) * 1)}:host([position=top]) [part=base],:host([position=bottom]) [part=base]{height:var(--menu-height);min-height:initial;min-width:100vw;margin:revert}:host([position=top]) [part=mini],:host([position=bottom]) [part=mini]{display:none;transition:none}:host([position=top]) [part=base]{top:0;bottom:auto;border:none;border-block-end-style:solid;border-block-end-width:.0625rem}:host([position=top]) [part=base]:not(:open){translate:0 calc(var(--menu-height)*-1)}:host([position=top]) [part=base]:open{translate:0}@starting-style{:host([position=top]) [part=base]:open{translate:0 calc(var(--menu-height)*-1)}}:host([position=bottom]) [part=base]{top:auto;bottom:0;border:none;border-block-start-style:solid;border-block-start-width:.0625rem}:host([position=bottom]) [part=base]:not(:open){translate:0 var(--menu-height)}:host([position=bottom]) [part=base]:open{translate:0}@starting-style{:host([position=bottom]) [part=base]:open{translate:0 var(--menu-height)}}:host(:where([position=start],[position=end])) [part=base]{border-inline-end-style:solid;border-inline-end-width:.0625rem}:host(:where([position=start],[position=end])) [part=base]:not(:open){translate:calc(200%*var(--dir)) 0}:host(:where([position=start],[position=end])) [part=base]:not(:open)+[part~=mini]{translate:0}@starting-style{:host(:where([position=start],[position=end])) [part=base]:not(:open)+[part~=mini]{translate:calc(200%*var(--dir)) 0}}:host(:where([position=start],[position=end])) [part=base]:open+[part~=mini]{translate:calc(200%*var(--dir)) 0}@starting-style{:host(:where([position=start],[position=end])) [part=base]:open{translate:calc(200%*var(--dir)) 0}}@supports not selector(:open){:host [part=base]{transition-property:translate,opacity}:host [part=base]::backdrop{transition-property:opacity}:host([open]) [part=base]::backdrop{opacity:1}@starting-style{:host([open]) [part=base]::backdrop{opacity:0}}:host([open][position=top]) [part=base]{translate:0}@starting-style{:host([open][position=top]) [part=base]{translate:0 calc(var(--menu-height)*-1)}}:host(:not([open])[position=top]) [part=base]{translate:0 calc(var(--menu-height)*-1)}:host([open][position=bottom]) [part=base]{translate:0}@starting-style{:host([open][position=bottom]) [part=base]{translate:0 var(--menu-height)}}:host(:not([open])[position=bottom]) [part=base]{translate:0 var(--menu-height)}@starting-style{:host([open]:where([position=start],[position=end])) [part=base]{translate:calc(200%*var(--dir)) 0}}:host(:not([open]):where([position=start],[position=end])) [part=base]{translate:calc(200%*var(--dir)) 0}}:host([position=relative]):has([part=mini]){--transition-duration: 0.2s}:host([position=relative]) [part=base]{position:relative;box-shadow:none;border-inline-end-style:solid;border-inline-end-width:.0625rem;transition-duration:var(--transition-duration);transition-timing-function:var(--transition-function);transition-property:margin,border}:host([position=relative]) [part=mini]{position:relative;border-inline-end-width:.0625rem;border-inline-end-style:solid;transition-duration:var(--transition-duration);transition-timing-function:var(--transition-function);transition-property:width,min-width,padding,border;order:-1;z-index:1}:host(:not([open])[position=relative]) [part=base]{margin-inline-start:calc(var(--menu-full-width)*-1);border-color:rgba(0,0,0,0);overflow:hidden}:host(:not([open])[position=relative]) [part=mini]{transition-delay:var(--transition-duration)}:host([open][position=relative]) [part=base]:has(+[part=mini]){transition-delay:var(--transition-duration)}:host([open][position=relative]) [part=mini]{width:0;min-width:0;padding-inline:0;border-color:rgba(0,0,0,0)}`;
//# sourceMappingURL=container.base.css.js.map