@volverjs/style
Version:
@volverjs/style is a lightweight responsive CSS utility library to accompany @volverjs/ui-* and static webpages as well.
2 lines (1 loc) • 7.83 kB
CSS
:where(:host,:root,.theme){--bg-none: none;--bg-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(21.675, 25.5229041916, 29.325)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");--bg-chessboard: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' width='200' height='400'%3E%3Cdefs%3E%3Cpattern id='grid' width='20' height='20' patternUnits='userSpaceOnUse'%3E%3Crect fill='black' x='0' y='0' width='10' height='10' opacity='0.1'/%3E%3Crect fill='white' x='10' y='0' width='10' height='10'/%3E%3Crect fill='black' x='10' y='10' width='10' height='10' opacity='0.1'/%3E%3Crect fill='white' x='0' y='10' width='10' height='10'/%3E%3C/pattern%3E%3C/defs%3E%3Crect fill='url(%23grid)' x='0' y='0' width='100%25' height='100%25'/%3E%3C/svg%3E");--bg-grid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32' fill='none' stroke='rgb(51 65 85 / 0.25)'%3E%3Cpath d='M0 .5H31.5V32'/%3E%3C/svg%3E");--bg-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(21.675, 25.5229041916, 29.325)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");--bg-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(21.675, 25.5229041916, 29.325)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");--bg-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(21.675, 25.5229041916, 29.325)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 20L4 4m16 0L4 20'/%3E%3C/svg%3E");--bg-noise-1: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.005' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");--bg-noise-2: url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.05' numOctaves='1' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");--bg-noise-3: url("data:image/svg+xml,%3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.25' numOctaves='1' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");--bg-noise-4: url("data:image/svg+xml,%3Csvg viewBox='0 0 2056 2056' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='1' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");--bg-noise-5: url("data:image/svg+xml,%3Csvg viewBox='0 0 2056 2056' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='1' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");--gradient-brand: linear-gradient(to bottom right, var(--color-brand-darken-3), var(--color-brand), var(--color-brand-lighten-3));--gradient-accent: linear-gradient(to bottom right, var(--color-accent-darken-3), var(--color-accent), var(--color-accent-lighten-3));--gradient-info: linear-gradient(to bottom right, var(--color-info-darken-3), var(--color-info), var(--color-info-lighten-3));--gradient-success: linear-gradient(to bottom right, var(--color-success-darken-3), var(--color-success), var(--color-success-lighten-3));--gradient-warning: linear-gradient(to bottom right, var(--color-warning-darken-3), var(--color-warning), var(--color-warning-lighten-3));--gradient-danger: linear-gradient(to bottom right, var(--color-danger-darken-3), var(--color-danger), var(--color-danger-lighten-3));--gradient-gray: linear-gradient(to bottom right, var(--color-gray-darken-3), var(--color-gray), var(--color-gray-lighten-3));--gradient-1: linear-gradient(to bottom right, #1f005c, #5b0060, #870160, #ac255e, #ca485c, #e16b5c, #f39060, #ffb56b);--gradient-2: linear-gradient(to bottom right, #48005c, #8300e2, #a269ff);--gradient-3: radial-gradient(circle at top right, hsl(180, 100%, 50%), hsla(180, 100%, 50%, 0)), radial-gradient(circle at bottom left, hsl(328, 100%, 54%), hsla(328, 100%, 54%, 0));--gradient-4: linear-gradient(to bottom right, #00f5a0, #00d9f5);--gradient-5: conic-gradient(from -270deg at 75% 110%, fuchsia, floralwhite);--gradient-6: conic-gradient(from -90deg at top left, black, white);--gradient-7: linear-gradient(to bottom right, #72c6ef, #004e8f);--gradient-8: conic-gradient(from 90deg at 50% 0%, #111, 50%, #222, #111);--gradient-9: conic-gradient(from .5turn at bottom center, lightblue, white);--gradient-10: conic-gradient(from 90deg at 40% -25%, #ffd700, #f79d03, #ee6907, #e6390a, #de0d0d, #d61039, #cf1261, #c71585, #cf1261, #d61039, #de0d0d, #ee6907, #f79d03, #ffd700, #ffd700, #ffd700);--gradient-11: conic-gradient(at bottom left, deeppink, cyan);--gradient-12: conic-gradient(from 90deg at 25% -10%, #ff4500, #d3f340, #7bee85, #afeeee, #7bee85);--gradient-13: radial-gradient(circle at 50% 200%, #000142, #3b0083, #b300c3, #ff059f, #ff4661, #ffad86, #fff3c7);--gradient-14: conic-gradient(at top right, lime, cyan);--gradient-15: linear-gradient(to bottom right, #c7d2fe, #fecaca, #fef3c7);--gradient-16: radial-gradient(circle at 50% -250%, #374151, #111827, #000);--gradient-17: conic-gradient(from -90deg at 50% -25%, blue, blueviolet);--gradient-18: linear-gradient(0deg, hsla(0, 100%, 50%, .8), hsla(0, 100%, 50%, 0) 75%), linear-gradient(60deg, hsla(60, 100%, 50%, .8), hsla(60, 100%, 50%, 0) 75%), linear-gradient(120deg, hsla(120, 100%, 50%, .8), hsla(120, 100%, 50%, 0) 75%), linear-gradient(180deg, hsla(180, 100%, 50%, .8), hsla(180, 100%, 50%, 0) 75%), linear-gradient(240deg, hsla(240, 100%, 50%, .8), hsla(240, 100%, 50%, 0) 75%), linear-gradient(300deg, hsla(300, 100%, 50%, .8), hsla(300, 100%, 50%, 0) 75%);--gradient-19: linear-gradient(to bottom right, #ffe259, #ffa751);--gradient-20: conic-gradient(from -135deg at -10% center, #ffa500, #ff7715, #ff522a, #ff3f47, #ff5482, #ff69b4);--gradient-21: conic-gradient(from -90deg at 25% 115%, #f00, #f06, #f0c, #c0f, #60f, #00f, #00f, #00f, #00f);--gradient-22: linear-gradient(to bottom right, #acb6e5, #86fde8);--gradient-23: linear-gradient(to bottom right, #536976, #292e49);--gradient-24: conic-gradient(from .5turn at 0% 0%, #00c476, 10%, #82b0ff, 90%, #00c476);--gradient-25: conic-gradient(at 125% 50%, #b78cf7, #ff7c94, #ffcf0d, #ff7c94, #b78cf7);--gradient-26: linear-gradient(to bottom right, #9796f0, #fbc7d4);--gradient-27: conic-gradient(from .5turn at bottom left, deeppink, #639);--gradient-28: conic-gradient(from -90deg at 50% 105%, white, orchid);--gradient-29: radial-gradient(circle at top right, hsl(250, 100%, 85%), hsla(250, 100%, 85%, 0)), radial-gradient(circle at bottom left, hsl(220, 90%, 75%), hsla(220, 90%, 75%, 0));--gradient-30: radial-gradient(circle at top right, hsl(150, 100%, 50%), hsla(150, 100%, 50%, 0)), radial-gradient(circle at bottom left, hsl(150, 100%, 84%), hsla(150, 100%, 84%, 0))}