@cn-ui/core
Version:
The @cn-ui/core is a collection of UI components and utilities for building modern web applications with SolidJS.
9 lines • 7.04 kB
CSS
*,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
:root {
--cn-bg-design-primary-0: #FFFFFF;--cn-bg-design-primary-elevated-0: #FFFFFF;--cn-bg-design-secondary-0: #F2F2F7;--cn-bg-design-secondary-elevated-0: #F2F2F7;--cn-bg-design-tertiary-0: #FFFFFF;--cn-bg-design-tertiary-elevated-0: #FFFFFF;--cn-bg-design-floating-0: #fafafa;--cn-bg-design-thick-0: #FFFFFF;--cn-bg-design-thick-1: saturate(180%) blur(50px);;--cn-border-design-separator-0: #e3e3e3;--cn-text-design-primary-0: #000000;--cn-text-design-secondary-0: #3C3C4399;--cn-text-design-tertiary-0: #3C3C434c;--cn-text-design-quarternary-0: #3C3C432d;--cn-bg-design-thick-0: rgba(255, 255, 255, 0.93);--cn-bg-design-thick-1: blur(5px) saturate(180%);--cn-bg-design-thick-2: 1px solid rgba(209, 213, 219, 0.3);--cn-bg-design-regular-0: rgba(255, 255, 255, 0.84);--cn-bg-design-regular-1: blur(8px) saturate(180%);--cn-bg-design-regular-2: 1px solid rgba(209, 213, 219, 0.3);--cn-bg-design-thin-0: rgba(255, 255, 255, 0.56);--cn-bg-design-thin-1: blur(14px) saturate(180%);--cn-bg-design-thin-2: 1px solid rgba(209, 213, 219, 0.3);--cn-bg-design-ultra-thin-0: rgba(255, 255, 255, 0.17);--cn-bg-design-ultra-thin-1: blur(25px) saturate(180%);--cn-bg-design-ultra-thin-2: 1px solid rgba(209, 213, 219, 0.3);
}
.dark{
--cn-bg-design-primary-0: #000000;--cn-bg-design-primary-elevated-0: #1C1C1E;--cn-bg-design-secondary-0: #1C1C1E;--cn-bg-design-secondary-elevated-0: #2C2C2E;--cn-bg-design-tertiary-0: #2C2C2E;--cn-bg-design-tertiary-elevated-0: #3A3A3C;--cn-bg-design-floating-0: #1C1C1E;--cn-bg-design-thick-0: #1C1C1E;--cn-bg-design-thick-1: saturate(180%) blur(50px);;--cn-border-design-separator-0: #3f3f3f;--cn-text-design-primary-0: #FFFFFF;--cn-text-design-secondary-0: #EBEBF599;--cn-text-design-tertiary-0: #EBEBF54c;--cn-text-design-quarternary-0: #EBEBF52d;--cn-bg-design-thick-0: rgba(17, 25, 40, 0.93);--cn-bg-design-thick-1: blur(5px) saturate(180%);--cn-bg-design-thick-2: 1px solid rgba(255, 255, 255, 0.125);--cn-bg-design-regular-0: rgba(17, 25, 40, 0.84);--cn-bg-design-regular-1: blur(8px) saturate(180%);--cn-bg-design-regular-2: 1px solid rgba(255, 255, 255, 0.125);--cn-bg-design-thin-0: rgba(17, 25, 40, 0.56);--cn-bg-design-thin-1: blur(14px) saturate(180%);--cn-bg-design-thin-2: 1px solid rgba(255, 255, 255, 0.125);--cn-bg-design-ultra-thin-0: rgba(17, 25, 40, 0.17);--cn-bg-design-ultra-thin-1: blur(8px) saturate(180%);--cn-bg-design-ultra-thin-2: 1px solid rgba(255, 255, 255, 0.125);
}
:root{--cn-colors-primary-50:230 244 255;--cn-colors-primary-100:186 224 255;--cn-colors-gray-400:191 191 191;--cn-colors-yellow-200:255 251 143;--cn-colors-primary-500:22 119 255;--cn-colors-primary-400:64 150 255;}
.dark{--cn-colors-primary-50:17 26 44;--cn-colors-primary-100:17 37 69;--cn-colors-gray-400:73 73 73;--cn-colors-yellow-200:89 80 20;--cn-colors-primary-500:22 104 220;--cn-colors-primary-400:21 84 173;}.visible{visibility:visible;}.absolute{position:absolute;}.relative{position:relative;}.inline-grid{display:inline-grid;}.inline-block{display:inline-block;}.hidden{display:none;}.h1{height:0.25rem;}.h2{height:0.5rem;}.h3{height:0.75rem;}.h4{height:1rem;}.h5{height:1.25rem;}.h6{height:1.5rem;}.flex{display:flex;}.inline-flex{display:inline-flex;}.table{display:table;}.transform{transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.resize{resize:both;}.rounded{border-radius:0.25rem;}.text-justify{text-align:justify;}.filter{filter:var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia);}.backdrop-filter{-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;}.ease,.ease-in-out{transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);}.ease-out{transition-timing-function:cubic-bezier(0, 0, 0.2, 1);}