rizzo-css 0.0.43 → 0.0.45
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/bin/rizzo-css.js +33 -3
- package/dist/rizzo.min.css +25 -5
- package/package.json +1 -1
- package/scaffold/astro/Tabs.astro +4 -2
- package/scaffold/astro/icons/Brush.astro +8 -3
- package/scaffold/astro/icons/Cake.astro +7 -4
- package/scaffold/astro/icons/Cherry.astro +9 -4
- package/scaffold/astro/icons/Flower.astro +6 -4
- package/scaffold/astro/icons/Lemon.astro +9 -4
- package/scaffold/astro/icons/Sunset.astro +7 -3
- package/scaffold/astro/icons/devicons/Docker.astro +39 -0
- package/scaffold/astro/icons/devicons/Playwright.astro +30 -0
- package/scaffold/astro/icons/devicons/Python.astro +31 -0
- package/scaffold/astro/icons/devicons/Ruby.astro +59 -0
- package/scaffold/astro/icons/devicons/Rust.astro +24 -0
- package/scaffold/astro/icons/devicons/Sass.astro +24 -0
- package/scaffold/astro/icons/devicons/TypeScript.astro +25 -0
- package/scaffold/astro-core/src/layouts/Layout.astro +1 -0
- package/scaffold/astro-core/src/pages/index.astro +23 -0
- package/scaffold/svelte/DocsSidebar.svelte +1 -1
- package/scaffold/svelte/FontSwitcher.svelte +2 -2
- package/scaffold/svelte/Footer.svelte +1 -1
- package/scaffold/svelte/Tabs.svelte +5 -0
- package/scaffold/svelte/ThemeSwitcher.svelte +2 -2
- package/scaffold/svelte/icons/Brush.svelte +30 -9
- package/scaffold/svelte/icons/Cake.svelte +29 -10
- package/scaffold/svelte/icons/Cherry.svelte +31 -10
- package/scaffold/svelte/icons/Flame.svelte +16 -9
- package/scaffold/svelte/icons/Flower.svelte +28 -10
- package/scaffold/svelte/icons/Heart.svelte +16 -9
- package/scaffold/svelte/icons/Leaf.svelte +16 -9
- package/scaffold/svelte/icons/Lemon.svelte +31 -10
- package/scaffold/svelte/icons/Shield.svelte +16 -9
- package/scaffold/svelte/icons/Sun.svelte +16 -9
- package/scaffold/svelte/icons/Sunset.svelte +29 -9
- package/scaffold/svelte/icons/Zap.svelte +26 -7
- package/scaffold/svelte/icons/devicons/Docker.svelte +33 -0
- package/scaffold/svelte/icons/devicons/Playwright.svelte +24 -0
- package/scaffold/svelte/icons/devicons/Python.svelte +25 -0
- package/scaffold/svelte/icons/devicons/Ruby.svelte +53 -0
- package/scaffold/svelte/icons/devicons/Rust.svelte +18 -0
- package/scaffold/svelte/icons/devicons/Sass.svelte +18 -0
- package/scaffold/svelte/icons/devicons/TypeScript.svelte +19 -0
- package/scaffold/svelte-core/src/app.html +1 -0
- package/scaffold/svelte-core/src/routes/+page.svelte +18 -0
- package/scaffold/vanilla/README-RIZZO.md +1 -1
- package/scaffold/vanilla/components/accordion.html +26 -0
- package/scaffold/vanilla/components/alert.html +26 -0
- package/scaffold/vanilla/components/avatar.html +26 -0
- package/scaffold/vanilla/components/badge.html +26 -0
- package/scaffold/vanilla/components/breadcrumb.html +26 -0
- package/scaffold/vanilla/components/button.html +26 -0
- package/scaffold/vanilla/components/cards.html +26 -0
- package/scaffold/vanilla/components/copy-to-clipboard.html +26 -0
- package/scaffold/vanilla/components/divider.html +26 -0
- package/scaffold/vanilla/components/docs-sidebar.html +26 -0
- package/scaffold/vanilla/components/dropdown.html +26 -0
- package/scaffold/vanilla/components/font-switcher.html +26 -0
- package/scaffold/vanilla/components/footer.html +26 -0
- package/scaffold/vanilla/components/forms.html +26 -0
- package/scaffold/vanilla/components/icons.html +26 -0
- package/scaffold/vanilla/components/index.html +26 -0
- package/scaffold/vanilla/components/modal.html +26 -0
- package/scaffold/vanilla/components/navbar.html +26 -0
- package/scaffold/vanilla/components/pagination.html +26 -0
- package/scaffold/vanilla/components/progress-bar.html +26 -0
- package/scaffold/vanilla/components/search.html +26 -0
- package/scaffold/vanilla/components/settings.html +26 -0
- package/scaffold/vanilla/components/sound-effects.html +26 -0
- package/scaffold/vanilla/components/spinner.html +26 -0
- package/scaffold/vanilla/components/table.html +26 -0
- package/scaffold/vanilla/components/tabs.html +26 -0
- package/scaffold/vanilla/components/theme-switcher.html +26 -0
- package/scaffold/vanilla/components/toast.html +26 -0
- package/scaffold/vanilla/components/tooltip.html +26 -0
- package/scaffold/vanilla/icons/Brush.svg +4 -2
- package/scaffold/vanilla/icons/Cake.svg +3 -3
- package/scaffold/vanilla/icons/Cherry.svg +5 -3
- package/scaffold/vanilla/icons/Flower.svg +2 -3
- package/scaffold/vanilla/icons/Lemon.svg +5 -3
- package/scaffold/vanilla/icons/Sunset.svg +3 -2
- package/scaffold/vanilla/icons/devicons/Docker.svg +22 -0
- package/scaffold/vanilla/icons/devicons/Playwright.svg +13 -0
- package/scaffold/vanilla/icons/devicons/Python.svg +14 -0
- package/scaffold/vanilla/icons/devicons/Ruby.svg +42 -0
- package/scaffold/vanilla/icons/devicons/Rust.svg +7 -0
- package/scaffold/vanilla/icons/devicons/Sass.svg +7 -0
- package/scaffold/vanilla/icons/devicons/TypeScript.svg +8 -0
- package/scaffold/vanilla/index.html +37 -0
- package/scaffold/vanilla/js/main.js +1 -0
package/README.md
CHANGED
|
@@ -63,7 +63,7 @@ import 'rizzo-css';
|
|
|
63
63
|
**Without a bundler (plain HTML):** Use a CDN. Both unpkg and jsDelivr resolve the package root to the built CSS (via the `unpkg` / `jsdelivr` fields in this package). For reliability or to pin a version, use the explicit path:
|
|
64
64
|
|
|
65
65
|
```html
|
|
66
|
-
<!-- unpkg (pin version: replace @latest with @0.0.
|
|
66
|
+
<!-- unpkg (pin version: replace @latest with @0.0.45 or any version) -->
|
|
67
67
|
<link rel="stylesheet" href="https://unpkg.com/rizzo-css@latest/dist/rizzo.min.css" />
|
|
68
68
|
|
|
69
69
|
<!-- or jsDelivr -->
|
package/bin/rizzo-css.js
CHANGED
|
@@ -230,8 +230,10 @@ function copyRizzoCssAndFontsForAstro(projectDir, cssSource) {
|
|
|
230
230
|
const cssDir = join(projectDir, 'public', 'css');
|
|
231
231
|
const cssTarget = join(cssDir, 'rizzo.min.css');
|
|
232
232
|
const fontsDest = join(projectDir, 'public', 'assets', 'fonts');
|
|
233
|
+
const sfxDest = join(projectDir, 'public', 'assets', 'sfx');
|
|
233
234
|
mkdirSync(cssDir, { recursive: true });
|
|
234
235
|
mkdirSync(fontsDest, { recursive: true });
|
|
236
|
+
mkdirSync(sfxDest, { recursive: true });
|
|
235
237
|
copyFileSync(cssSource, cssTarget);
|
|
236
238
|
let css = readFileSync(cssTarget, 'utf8');
|
|
237
239
|
css = css.replace(/url\(['"]?\.\/fonts\//g, "url('/assets/fonts/");
|
|
@@ -253,8 +255,10 @@ function copyRizzoCssAndFontsForSvelte(projectDir, cssSource) {
|
|
|
253
255
|
const cssDir = join(projectDir, 'static', 'css');
|
|
254
256
|
const cssTarget = join(cssDir, 'rizzo.min.css');
|
|
255
257
|
const fontsDest = join(projectDir, 'static', 'assets', 'fonts');
|
|
258
|
+
const sfxDest = join(projectDir, 'static', 'assets', 'sfx');
|
|
256
259
|
mkdirSync(cssDir, { recursive: true });
|
|
257
260
|
mkdirSync(fontsDest, { recursive: true });
|
|
261
|
+
mkdirSync(sfxDest, { recursive: true });
|
|
258
262
|
copyFileSync(cssSource, cssTarget);
|
|
259
263
|
let css = readFileSync(cssTarget, 'utf8');
|
|
260
264
|
css = css.replace(/url\(['"]?\.\/fonts\//g, "url('/assets/fonts/");
|
|
@@ -1513,7 +1517,9 @@ async function runAddToExisting(frameworkOverride, options) {
|
|
|
1513
1517
|
if (existsSync(vanillaJsSrc)) {
|
|
1514
1518
|
mkdirSync(join(cwd, 'js'), { recursive: true });
|
|
1515
1519
|
let mainJs = readFileSync(vanillaJsSrc, 'utf8');
|
|
1516
|
-
|
|
1520
|
+
const addSound = selectedComponents.includes('Settings') || selectedComponents.includes('SoundEffects');
|
|
1521
|
+
const soundScript = addSound ? (() => { const p = join(getPackageRoot(), 'scaffold', 'shared', 'sound-effects-inline.js'); return existsSync(p) ? '\n' + readFileSync(p, 'utf8') : ''; })() : '';
|
|
1522
|
+
mainJs = mainJs.replace(/\{\{DEFAULT_DARK\}\}/g, defaultDark).replace(/\{\{DEFAULT_LIGHT\}\}/g, defaultLight).replace(/\{\{RIZZO_SOUND_SCRIPT\}\}/g, soundScript);
|
|
1517
1523
|
writeFileSync(vanillaJsPath, mainJs, 'utf8');
|
|
1518
1524
|
console.log(' - Wrote js/main.js (for modal, dropdown, tabs, toast, search, navbar, copy-to-clipboard, theme switcher)');
|
|
1519
1525
|
}
|
|
@@ -1714,6 +1720,7 @@ async function cmdInit(argv) {
|
|
|
1714
1720
|
'{{THEME_LIST_COMMENT}}': themeComment,
|
|
1715
1721
|
'{{TITLE}}': name || 'App',
|
|
1716
1722
|
'{{PROJECT_NAME}}': projectNamePkg,
|
|
1723
|
+
'{{RIZZO_SOUND_SCRIPT}}': '',
|
|
1717
1724
|
};
|
|
1718
1725
|
|
|
1719
1726
|
const astroCoreDir = getScaffoldAstroCoreDir();
|
|
@@ -1731,23 +1738,46 @@ async function cmdInit(argv) {
|
|
|
1731
1738
|
componentsToCopy = expandWithDeps(framework, selectedComponents);
|
|
1732
1739
|
logAddedDeps(selectedComponents, componentsToCopy, framework);
|
|
1733
1740
|
}
|
|
1741
|
+
let vanillaSoundScript = '';
|
|
1742
|
+
if (framework === 'vanilla' && (componentsToCopy.includes('Settings') || componentsToCopy.includes('SoundEffects'))) {
|
|
1743
|
+
const soundPath = join(getPackageRoot(), 'scaffold', 'shared', 'sound-effects-inline.js');
|
|
1744
|
+
if (existsSync(soundPath)) vanillaSoundScript = '\n' + readFileSync(soundPath, 'utf8');
|
|
1745
|
+
}
|
|
1734
1746
|
|
|
1735
1747
|
// Astro layout: inject Navbar and Settings when those components are selected so the settings menu works.
|
|
1736
1748
|
if ((framework === 'astro') && (useHandpickAstro || useAstroBase)) {
|
|
1737
1749
|
const hasNavbar = componentsToCopy.includes('Navbar');
|
|
1738
1750
|
const hasSettings = componentsToCopy.includes('Settings');
|
|
1751
|
+
const hasSound = hasSettings || componentsToCopy.includes('SoundEffects');
|
|
1739
1752
|
const layoutImports = [];
|
|
1740
1753
|
if (hasNavbar) layoutImports.push("import Navbar from '../components/rizzo/Navbar.astro';");
|
|
1741
1754
|
if (hasSettings) layoutImports.push("import Settings from '../components/rizzo/Settings.astro';");
|
|
1742
1755
|
replacements['{{RIZZO_LAYOUT_IMPORTS}}'] = layoutImports.length ? '\n' + layoutImports.join('\n') + '\n' : '\n';
|
|
1743
1756
|
replacements['{{RIZZO_LAYOUT_BODY_TOP}}'] = hasNavbar ? '\n <Navbar />' : '';
|
|
1744
1757
|
replacements['{{RIZZO_LAYOUT_BODY_BOTTOM}}'] = hasSettings ? '\n <Settings />' : '';
|
|
1758
|
+
if (hasSound) {
|
|
1759
|
+
const soundPath = join(getPackageRoot(), 'scaffold', 'shared', 'sound-effects-inline.js');
|
|
1760
|
+
if (existsSync(soundPath)) {
|
|
1761
|
+
replacements['{{RIZZO_SOUND_SCRIPT}}'] = '\n <script is:inline>\n' + readFileSync(soundPath, 'utf8') + '\n </script>';
|
|
1762
|
+
}
|
|
1763
|
+
}
|
|
1745
1764
|
} else {
|
|
1746
1765
|
replacements['{{RIZZO_LAYOUT_IMPORTS}}'] = '\n';
|
|
1747
1766
|
replacements['{{RIZZO_LAYOUT_BODY_TOP}}'] = '';
|
|
1748
1767
|
replacements['{{RIZZO_LAYOUT_BODY_BOTTOM}}'] = '';
|
|
1749
1768
|
}
|
|
1750
1769
|
|
|
1770
|
+
// Svelte app.html: inject sound script when Settings or SoundEffects is included (identical behavior to Astro).
|
|
1771
|
+
if ((framework === 'svelte') && (useHandpickSvelte || useSvelteBase)) {
|
|
1772
|
+
const hasSound = componentsToCopy.includes('Settings') || componentsToCopy.includes('SoundEffects');
|
|
1773
|
+
if (hasSound) {
|
|
1774
|
+
const soundPath = join(getPackageRoot(), 'scaffold', 'shared', 'sound-effects-inline.js');
|
|
1775
|
+
if (existsSync(soundPath)) {
|
|
1776
|
+
replacements['{{RIZZO_SOUND_SCRIPT}}'] = '\n <script>\n' + readFileSync(soundPath, 'utf8') + '\n </script>';
|
|
1777
|
+
}
|
|
1778
|
+
}
|
|
1779
|
+
}
|
|
1780
|
+
|
|
1751
1781
|
let cssTarget;
|
|
1752
1782
|
let indexPath;
|
|
1753
1783
|
|
|
@@ -1852,7 +1882,7 @@ async function cmdInit(argv) {
|
|
|
1852
1882
|
if (existsSync(vanillaJs)) {
|
|
1853
1883
|
mkdirSync(join(projectDir, 'js'), { recursive: true });
|
|
1854
1884
|
let mainJs = readFileSync(vanillaJs, 'utf8');
|
|
1855
|
-
mainJs = mainJs.replace(/\{\{DEFAULT_DARK\}\}/g, defaultDark).replace(/\{\{DEFAULT_LIGHT\}\}/g, defaultLight);
|
|
1885
|
+
mainJs = mainJs.replace(/\{\{DEFAULT_DARK\}\}/g, defaultDark).replace(/\{\{DEFAULT_LIGHT\}\}/g, defaultLight).replace(/\{\{RIZZO_SOUND_SCRIPT\}\}/g, vanillaSoundScript);
|
|
1856
1886
|
writeFileSync(join(projectDir, 'js', 'main.js'), mainJs, 'utf8');
|
|
1857
1887
|
}
|
|
1858
1888
|
const vanillaCoreRepl = { ...replacements, '{{LINK_HREF}}': linkHref };
|
|
@@ -1881,7 +1911,7 @@ async function cmdInit(argv) {
|
|
|
1881
1911
|
const vanillaJs = join(getPackageRoot(), 'scaffold', 'vanilla', 'js', 'main.js');
|
|
1882
1912
|
if (existsSync(vanillaJs)) {
|
|
1883
1913
|
let mainJs = readFileSync(vanillaJs, 'utf8');
|
|
1884
|
-
mainJs = mainJs.replace(/\{\{DEFAULT_DARK\}\}/g, defaultDark).replace(/\{\{DEFAULT_LIGHT\}\}/g, defaultLight);
|
|
1914
|
+
mainJs = mainJs.replace(/\{\{DEFAULT_DARK\}\}/g, defaultDark).replace(/\{\{DEFAULT_LIGHT\}\}/g, defaultLight).replace(/\{\{RIZZO_SOUND_SCRIPT\}\}/g, vanillaSoundScript);
|
|
1885
1915
|
writeFileSync(join(projectDir, 'js', 'main.js'), mainJs, 'utf8');
|
|
1886
1916
|
}
|
|
1887
1917
|
const vanillaRepl = { ...replacements, '{{LINK_HREF}}': 'css/rizzo.min.css' };
|
package/dist/rizzo.min.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@font-face{font-display:swap;font-family:Geist Sans;font-style:normal;font-weight:100 900;src:url('./fonts/GeistSans/GeistVF.woff2) format("woff2"),url('./fonts/GeistSans/GeistVF.woff) format("woff")}@font-face{font-display:swap;font-family:Geist Mono;font-style:normal;font-weight:100 900;src:url('./fonts/GeistMono/GeistMonoVF.woff2) format("woff2"),url('./fonts/GeistMono/GeistMonoVF.woff) format("woff")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:100 900;src:url('./fonts/Inter/Inter-VariableFont_opsz,wght.ttf) format("truetype")}@font-face{font-display:swap;font-family:JetBrains Mono;font-style:normal;font-weight:100 900;src:url('./fonts/JetBrainsMono/JetBrainsMono[wght].ttf) format("truetype")}@font-face{font-display:swap;font-family:IBM Plex Sans;font-style:normal;font-weight:100 900;src:url('./fonts/IBMPlexSans/IBMPlexSans-VariableFont_wdth,wght.ttf) format("truetype")}@font-face{font-display:swap;font-family:IBM Plex Mono;font-style:normal;font-weight:400;src:url('./fonts/IBMPlexMono/IBMPlexMono-Regular.ttf) format("truetype")}@font-face{font-display:swap;font-family:Source Sans\ 3;font-style:normal;font-weight:100 900;src:url('./fonts/SourceSans3/SourceSans3-VariableFont_wght.ttf) format("truetype")}@font-face{font-display:swap;font-family:Source Code Pro;font-style:normal;font-weight:100 900;src:url('./fonts/SourceCodePro/SourceCodePro-VariableFont_wght.ttf) format("truetype")}@font-face{font-display:swap;font-family:DM Sans;font-style:normal;font-weight:100 900;src:url('./fonts/DMSans/DMSans-VariableFont_opsz,wght.ttf) format("truetype")}@font-face{font-display:swap;font-family:DM Mono;font-style:normal;font-weight:400;src:url('./fonts/DMMono/DMMono-Regular.ttf) format("truetype")}@font-face{font-display:swap;font-family:Outfit;font-style:normal;font-weight:100 900;src:url('./fonts/Outfit/Outfit-VariableFont_wght.ttf) format("truetype")}:root{--primary-color:oklch(45.2% 0.198 250.1deg);--secondary-color:oklch(25.1% 0 0deg);--font-family-geist-sans:"Geist Sans",system-ui,-apple-system,blinkmacsystemfont,"Segoe UI",roboto,"Helvetica Neue",arial,sans-serif;--font-family-geist-mono:"Geist Mono","SF Mono",monaco,"Cascadia Code","Roboto Mono",consolas,"Courier New",monospace;--font-family-inter:"Inter",system-ui,-apple-system,blinkmacsystemfont,"Segoe UI",roboto,"Helvetica Neue",arial,sans-serif;--font-family-jetbrains-mono:"JetBrains Mono","SF Mono",monaco,"Cascadia Code","Roboto Mono",consolas,"Courier New",monospace;--font-family-ibm-plex-sans:"IBM Plex Sans",system-ui,-apple-system,sans-serif;--font-family-ibm-plex-mono:"IBM Plex Mono","SF Mono",monaco,consolas,"Courier New",monospace;--font-family-source-sans-3:"Source Sans 3",system-ui,-apple-system,sans-serif;--font-family-source-code-pro:"Source Code Pro","SF Mono",monaco,consolas,"Courier New",monospace;--font-family-dm-sans:"DM Sans",system-ui,-apple-system,sans-serif;--font-family-dm-mono:"DM Mono","SF Mono",monaco,consolas,"Courier New",monospace;--font-family-outfit:outfit,system-ui,-apple-system,sans-serif;--font-family-sans:var(--font-family-geist-sans);--font-family-serif:georgia,"Times New Roman",times,serif;--font-family-mono:var(--font-family-geist-mono);--font-family:var(--font-family-sans);--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--font-size-scale:1;--font-size-xs:calc(0.75rem*var(--font-size-scale));--font-size-sm:calc(0.875rem*var(--font-size-scale));--font-size-base:calc(1rem*var(--font-size-scale));--font-size-lg:calc(1.125rem*var(--font-size-scale));--font-size-xl:calc(1.25rem*var(--font-size-scale));--font-size-2xl:calc(1.5rem*var(--font-size-scale));--font-size-3xl:calc(1.875rem*var(--font-size-scale));--font-size-4xl:calc(2.25rem*var(--font-size-scale));--font-size-5xl:calc(3rem*var(--font-size-scale));--font-size-6xl:calc(3.75rem*var(--font-size-scale));--line-height-tight:1.25;--line-height-snug:1.375;--line-height-normal:1.5;--line-height-relaxed:1.625;--line-height-loose:2;--letter-spacing-tighter:-0.05em;--letter-spacing-tight:-0.025em;--letter-spacing-normal:0;--letter-spacing-wide:0.025em;--letter-spacing-wider:0.05em;--letter-spacing-widest:0.1em;--spacing-0:0;--spacing-1:0.25rem;--spacing-2:0.5rem;--spacing-3:0.75rem;--spacing-4:1rem;--spacing-5:1.25rem;--spacing-6:1.5rem;--spacing-8:2rem;--spacing-10:2.5rem;--spacing-12:3rem;--spacing-16:4rem;--spacing-20:5rem;--spacing-24:6rem;--spacing-0-125:0.125rem;--spacing-0-375:0.375rem;--spacing-0-625:0.625rem;--spacing-0-875:0.875rem;--spacing-28:7rem;--spacing-32:8rem;--spacing-36:9rem;--spacing-40:10rem;--spacing-48:12rem;--spacing-56:14rem;--spacing-64:16rem;--spacing-72:18rem;--spacing-80:20rem;--spacing-96:24rem;--spacing-50:12.5rem;--spacing-100:25rem;--spacing-150:37.5rem;--spacing-14:3.5rem;--spacing-15:3.75rem;--spacing-75:18.75rem;--spacing-175:43.75rem;--spacing-70:17.5rem;--spacing-105:26.25rem;--spacing-2500:2500rem;--radius-none:0;--radius-sm:0.125rem;--radius:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--radius-full:9999px;--radius-circle:50%;--z-base:0;--z-1:1;--z-2:2;--z-3:3;--z-10:10;--z-dropdown:10;--z-dropdown-submenu:11;--z-sticky:50;--z-fixed:100;--z-search-overlay:98;--z-search-panel:99;--z-modal-backdrop:1999;--z-modal:2000;--z-tooltip:3000;--z-toast:4000;--z-settings:10000;--z-navbar:5000;--toast-top-offset:calc(var(--spacing-16) + var(--spacing-4));--z-navbar-mobile-menu-open:5100;--z-skip-link:10001;--z-navbar-mobile-menu:101;--z-navbar-search-overlay:98;--z-navbar-search-panel:99;--z-navbar-mobile-search-overlay:101;--z-navbar-mobile-search-panel:102;--transition-fast:150ms;--transition-base:200ms;--transition-slow:300ms;--transition-slower:350ms;--transition-slowest:400ms;--transition-ease-out:300ms ease-out;--transition-ease-in:300ms ease-in;--theme-transition-duration:0.2s;--blur-sm:4px;--blur:8px;--blur-md:12px;--blur-lg:16px;--outline-width:2px;--outline-offset:2px;--container-sm:640px;--container-md:768px;--container-lg:1024px;--container-xl:1280px;--container-2xl:1536px;--container-default:1200px;--vh-70:70vh;--vh-80:80vh;--vh-90:90vh;--touch-target-min:3rem;--theme-switcher-width:var(--spacing-96);--max-height-dropdown:600px;--max-height-modal:32rem;--max-width-modal-lg:48rem;--max-height-navbar-submenu:2000px;--ease-in-out-cubic:cubic-bezier(0.4,0,0.2,1);--scale-80:0.8;--scale-95:0.95;--scale-100:1;--scale-110:1.1;--border-width:1px;--border-width-2:2px;--border-width-3:3px;--border-width-4:4px;--border-width-arrow:6px;--border-width-accent:3px;--opacity-0:0;--opacity-50:0.5;--opacity-60:0.6;--opacity-70:0.7;--opacity-80:0.8;--opacity-90:0.9;--opacity-100:1;--background:oklch(100% 0 0deg);--background-alt:oklch(96.9% 0 0deg);--text:oklch(25.1% 0 0deg);--text-dim:oklch(50.2% 0 0deg);--icon:var(--text);--icon-dim:var(--text-dim);--border:oklch(90.2% 0 0deg);--accent:oklch(45.2% 0.198 250.1deg);--accent-hover:oklch(40.2% 0.198 250.1deg);--accent-text:oklch(100% 0 0deg);--accent-text-on-hover:var(--accent-text);--accent-fg:var(--accent);--accent-fg-hover:var(--accent-hover);--success:oklch(60.2% 0.182 145.1deg);--success-hover:oklch(70% 0.16 145deg);--success-text:oklch(20% 0 0deg);--success-text-on-solid:oklch(100% 0 0deg);--warning:oklch(80.2% 0.152 90.1deg);--warning-hover:oklch(88% 0.12 90deg);--warning-text:oklch(100% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 90deg);--text-on-solid-hover:oklch(22% 0.02 0deg);--error:oklch(55.2% 0.218 25.1deg);--error-hover:oklch(65% 0.18 25deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:var(--error-text);--info:oklch(60.2% 0.118 210.1deg);--info-hover:oklch(70% 0.1 210deg);--info-text:oklch(20% 0 0deg);--info-text-on-solid:oklch(100% 0 0deg);--selection:oklch(70% 0.15 250deg);--color-neutral-50:oklch(98% 0 0deg);--color-neutral-100:oklch(96% 0.005 264deg);--color-neutral-200:oklch(91% 0.008 264deg);--color-neutral-300:oklch(84% 0.01 264deg);--color-neutral-400:oklch(63% 0.012 264deg);--color-neutral-500:oklch(50% 0.014 264deg);--color-neutral-600:oklch(40% 0.012 264deg);--color-neutral-700:oklch(32% 0.01 264deg);--color-neutral-800:oklch(24% 0.008 264deg);--color-neutral-900:oklch(16% 0.006 264deg);--color-neutral-950:oklch(10% 0.004 264deg);--color-accent-50:oklch(from var(--accent) 0.97deg 0.03 h);--color-accent-100:oklch(from var(--accent) 0.93deg 0.06 h);--color-accent-200:oklch(from var(--accent) 0.88deg 0.1 h);--color-accent-300:oklch(from var(--accent) 0.78deg 0.14 h);--color-accent-400:oklch(from var(--accent) 0.65deg 0.16 h);--color-accent-500:var(--accent);--color-accent-600:oklch(from var(--accent) 0.45deg 0.18 h);--color-accent-700:oklch(from var(--accent) 0.38deg 0.16 h);--color-accent-800:oklch(from var(--accent) 0.3deg 0.12 h);--color-accent-900:oklch(from var(--accent) 0.22deg 0.08 h);--color-accent-950:oklch(from var(--accent) 0.15deg 0.05 h);--color-success-50:oklch(from var(--success) 0.97deg 0.03 h);--color-success-100:oklch(from var(--success) 0.93deg 0.06 h);--color-success-200:oklch(from var(--success) 0.88deg 0.1 h);--color-success-300:oklch(from var(--success) 0.78deg 0.14 h);--color-success-400:oklch(from var(--success) 0.65deg 0.16 h);--color-success-500:var(--success);--color-success-600:oklch(from var(--success) 0.45deg 0.18 h);--color-success-700:oklch(from var(--success) 0.38deg 0.16 h);--color-success-800:oklch(from var(--success) 0.3deg 0.12 h);--color-success-900:oklch(from var(--success) 0.22deg 0.08 h);--color-success-950:oklch(from var(--success) 0.15deg 0.05 h);--color-warning-50:oklch(from var(--warning) 0.97deg 0.03 h);--color-warning-100:oklch(from var(--warning) 0.93deg 0.06 h);--color-warning-200:oklch(from var(--warning) 0.88deg 0.1 h);--color-warning-300:oklch(from var(--warning) 0.82deg 0.12 h);--color-warning-400:oklch(from var(--warning) 0.75deg 0.14 h);--color-warning-500:var(--warning);--color-warning-600:oklch(from var(--warning) 0.55deg 0.14 h);--color-warning-700:oklch(from var(--warning) 0.45deg 0.12 h);--color-warning-800:oklch(from var(--warning) 0.35deg 0.1 h);--color-warning-900:oklch(from var(--warning) 0.25deg 0.06 h);--color-warning-950:oklch(from var(--warning) 0.18deg 0.04 h);--color-error-50:oklch(from var(--error) 0.97deg 0.03 h);--color-error-100:oklch(from var(--error) 0.93deg 0.06 h);--color-error-200:oklch(from var(--error) 0.88deg 0.1 h);--color-error-300:oklch(from var(--error) 0.78deg 0.14 h);--color-error-400:oklch(from var(--error) 0.65deg 0.18 h);--color-error-500:var(--error);--color-error-600:oklch(from var(--error) 0.45deg 0.2 h);--color-error-700:oklch(from var(--error) 0.38deg 0.18 h);--color-error-800:oklch(from var(--error) 0.3deg 0.14 h);--color-error-900:oklch(from var(--error) 0.22deg 0.1 h);--color-error-950:oklch(from var(--error) 0.15deg 0.06 h);--color-info-50:oklch(from var(--info) 0.97deg 0.03 h);--color-info-100:oklch(from var(--info) 0.93deg 0.06 h);--color-info-200:oklch(from var(--info) 0.88deg 0.08 h);--color-info-300:oklch(from var(--info) 0.78deg 0.1 h);--color-info-400:oklch(from var(--info) 0.65deg 0.12 h);--color-info-500:var(--info);--color-info-600:oklch(from var(--info) 0.45deg 0.12 h);--color-info-700:oklch(from var(--info) 0.38deg 0.1 h);--color-info-800:oklch(from var(--info) 0.3deg 0.08 h);--color-info-900:oklch(from var(--info) 0.22deg 0.06 h);--color-info-950:oklch(from var(--info) 0.15deg 0.04 h);--alert-bg:oklch(from var(--background-alt) calc(l * 0.92) c h);--alert-success-bg:var(--color-success-200);--alert-error-bg:var(--color-error-200);--alert-warning-bg:var(--color-warning-200);--alert-info-bg:var(--color-info-200);--shadow-color:oklch(0% 0 0deg);--shadow-sm:0 1px 2px 0 oklch(from var(--shadow-color) l c h/5%);--shadow:0 1px 3px 0 oklch(from var(--shadow-color) l c h/10%),0 1px 2px -1px oklch(from var(--shadow-color) l c h/10%);--shadow-md:0 4px 6px -1px oklch(from var(--shadow-color) l c h/10%),0 2px 4px -2px oklch(from var(--shadow-color) l c h/6%);--shadow-lg:0 10px 15px -3px oklch(from var(--shadow-color) l c h/10%),0 4px 6px -4px oklch(from var(--shadow-color) l c h/5%);--shadow-xl:0 20px 25px -5px oklch(from var(--shadow-color) l c h/10%),0 8px 10px -6px oklch(from var(--shadow-color) l c h/4%);--overlay:oklch(from var(--shadow-color) l c h/50%);--shadow-inset-sm:inset 0 var(--spacing-0-125) var(--spacing-0-125) oklch(from var(--shadow-color) l c h/10%);--shadow-inset:inset 0 var(--spacing-0-125) var(--spacing-0-125) oklch(from var(--shadow-color) l c h/10%)}*, *::after, *::before{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;margin:0;max-width:100%;padding:0} blockquote,body, dd, dl,
|
|
1
|
+
@font-face{font-display:swap;font-family:Geist Sans;font-style:normal;font-weight:100 900;src:url('./fonts/GeistSans/GeistVF.woff2"') format("woff2"),url('./fonts/GeistSans/GeistVF.woff"') format("woff")}@font-face{font-display:swap;font-family:Geist Mono;font-style:normal;font-weight:100 900;src:url('./fonts/GeistMono/GeistMonoVF.woff2"') format("woff2"),url('./fonts/GeistMono/GeistMonoVF.woff"') format("woff")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:100 900;src:url('./fonts/Inter/Inter-VariableFont_opsz,wght.ttf"') format("truetype")}@font-face{font-display:swap;font-family:JetBrains Mono;font-style:normal;font-weight:100 900;src:url('./fonts/JetBrainsMono/JetBrainsMono[wght].ttf"') format("truetype")}@font-face{font-display:swap;font-family:IBM Plex Sans;font-style:normal;font-weight:100 900;src:url('./fonts/IBMPlexSans/IBMPlexSans-VariableFont_wdth,wght.ttf"') format("truetype")}@font-face{font-display:swap;font-family:IBM Plex Mono;font-style:normal;font-weight:400;src:url('./fonts/IBMPlexMono/IBMPlexMono-Regular.ttf"') format("truetype")}@font-face{font-display:swap;font-family:Source Sans\ 3;font-style:normal;font-weight:100 900;src:url('./fonts/SourceSans3/SourceSans3-VariableFont_wght.ttf"') format("truetype")}@font-face{font-display:swap;font-family:Source Code Pro;font-style:normal;font-weight:100 900;src:url('./fonts/SourceCodePro/SourceCodePro-VariableFont_wght.ttf"') format("truetype")}@font-face{font-display:swap;font-family:DM Sans;font-style:normal;font-weight:100 900;src:url('./fonts/DMSans/DMSans-VariableFont_opsz,wght.ttf"') format("truetype")}@font-face{font-display:swap;font-family:DM Mono;font-style:normal;font-weight:400;src:url('./fonts/DMMono/DMMono-Regular.ttf"') format("truetype")}@font-face{font-display:swap;font-family:Outfit;font-style:normal;font-weight:100 900;src:url('./fonts/Outfit/Outfit-VariableFont_wght.ttf"') format("truetype")}:root{--primary-color:oklch(45.2% 0.198 250.1deg);--secondary-color:oklch(25.1% 0 0deg);--font-family-geist-sans:"Geist Sans",system-ui,-apple-system,blinkmacsystemfont,"Segoe UI",roboto,"Helvetica Neue",arial,sans-serif;--font-family-geist-mono:"Geist Mono","SF Mono",monaco,"Cascadia Code","Roboto Mono",consolas,"Courier New",monospace;--font-family-inter:"Inter",system-ui,-apple-system,blinkmacsystemfont,"Segoe UI",roboto,"Helvetica Neue",arial,sans-serif;--font-family-jetbrains-mono:"JetBrains Mono","SF Mono",monaco,"Cascadia Code","Roboto Mono",consolas,"Courier New",monospace;--font-family-ibm-plex-sans:"IBM Plex Sans",system-ui,-apple-system,sans-serif;--font-family-ibm-plex-mono:"IBM Plex Mono","SF Mono",monaco,consolas,"Courier New",monospace;--font-family-source-sans-3:"Source Sans 3",system-ui,-apple-system,sans-serif;--font-family-source-code-pro:"Source Code Pro","SF Mono",monaco,consolas,"Courier New",monospace;--font-family-dm-sans:"DM Sans",system-ui,-apple-system,sans-serif;--font-family-dm-mono:"DM Mono","SF Mono",monaco,consolas,"Courier New",monospace;--font-family-outfit:outfit,system-ui,-apple-system,sans-serif;--font-family-sans:var(--font-family-geist-sans);--font-family-serif:georgia,"Times New Roman",times,serif;--font-family-mono:var(--font-family-geist-mono);--font-family:var(--font-family-sans);--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--font-size-scale:1;--font-size-xs:calc(0.75rem*var(--font-size-scale));--font-size-sm:calc(0.875rem*var(--font-size-scale));--font-size-base:calc(1rem*var(--font-size-scale));--font-size-lg:calc(1.125rem*var(--font-size-scale));--font-size-xl:calc(1.25rem*var(--font-size-scale));--font-size-2xl:calc(1.5rem*var(--font-size-scale));--font-size-3xl:calc(1.875rem*var(--font-size-scale));--font-size-4xl:calc(2.25rem*var(--font-size-scale));--font-size-5xl:calc(3rem*var(--font-size-scale));--font-size-6xl:calc(3.75rem*var(--font-size-scale));--line-height-tight:1.25;--line-height-snug:1.375;--line-height-normal:1.5;--line-height-relaxed:1.625;--line-height-loose:2;--letter-spacing-tighter:-0.05em;--letter-spacing-tight:-0.025em;--letter-spacing-normal:0;--letter-spacing-wide:0.025em;--letter-spacing-wider:0.05em;--letter-spacing-widest:0.1em;--spacing-0:0;--spacing-1:0.25rem;--spacing-2:0.5rem;--spacing-3:0.75rem;--spacing-4:1rem;--spacing-5:1.25rem;--spacing-6:1.5rem;--spacing-8:2rem;--spacing-10:2.5rem;--spacing-12:3rem;--spacing-16:4rem;--spacing-20:5rem;--spacing-24:6rem;--spacing-0-125:0.125rem;--spacing-0-375:0.375rem;--spacing-0-625:0.625rem;--spacing-0-875:0.875rem;--spacing-28:7rem;--spacing-32:8rem;--spacing-36:9rem;--spacing-40:10rem;--spacing-48:12rem;--spacing-56:14rem;--spacing-64:16rem;--spacing-72:18rem;--spacing-80:20rem;--spacing-96:24rem;--spacing-50:12.5rem;--spacing-100:25rem;--spacing-150:37.5rem;--spacing-14:3.5rem;--spacing-15:3.75rem;--spacing-75:18.75rem;--spacing-175:43.75rem;--spacing-70:17.5rem;--spacing-105:26.25rem;--spacing-2500:2500rem;--radius-none:0;--radius-sm:0.125rem;--radius:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--radius-full:9999px;--radius-circle:50%;--z-base:0;--z-1:1;--z-2:2;--z-3:3;--z-10:10;--z-dropdown:10;--z-dropdown-submenu:11;--z-sticky:50;--z-fixed:100;--z-search-overlay:98;--z-search-panel:99;--z-modal-backdrop:1999;--z-modal:2000;--z-tooltip:3000;--z-toast:4000;--z-settings:10000;--z-navbar:5000;--toast-top-offset:calc(var(--spacing-16) + var(--spacing-4));--z-navbar-mobile-menu-open:5100;--z-skip-link:10001;--z-navbar-mobile-menu:101;--z-navbar-search-overlay:98;--z-navbar-search-panel:99;--z-navbar-mobile-search-overlay:101;--z-navbar-mobile-search-panel:102;--transition-fast:150ms;--transition-base:200ms;--transition-slow:300ms;--transition-slower:350ms;--transition-slowest:400ms;--transition-ease-out:300ms ease-out;--transition-ease-in:300ms ease-in;--theme-transition-duration:0.2s;--blur-sm:4px;--blur:8px;--blur-md:12px;--blur-lg:16px;--outline-width:2px;--outline-offset:2px;--container-sm:640px;--container-md:768px;--container-lg:1024px;--container-xl:1280px;--container-2xl:1536px;--container-default:1200px;--vh-70:70vh;--vh-80:80vh;--vh-90:90vh;--touch-target-min:3rem;--theme-switcher-width:var(--spacing-96);--max-height-dropdown:600px;--max-height-modal:32rem;--max-width-modal-lg:48rem;--max-height-navbar-submenu:2000px;--ease-in-out-cubic:cubic-bezier(0.4,0,0.2,1);--scale-80:0.8;--scale-95:0.95;--scale-100:1;--scale-110:1.1;--border-width:1px;--border-width-2:2px;--border-width-3:3px;--border-width-4:4px;--border-width-arrow:6px;--border-width-accent:3px;--opacity-0:0;--opacity-50:0.5;--opacity-60:0.6;--opacity-70:0.7;--opacity-80:0.8;--opacity-90:0.9;--opacity-100:1;--background:oklch(100% 0 0deg);--background-alt:oklch(96.9% 0 0deg);--text:oklch(25.1% 0 0deg);--text-dim:oklch(50.2% 0 0deg);--icon:var(--text);--icon-dim:var(--text-dim);--border:oklch(90.2% 0 0deg);--accent:oklch(45.2% 0.198 250.1deg);--accent-hover:oklch(40.2% 0.198 250.1deg);--accent-text:oklch(100% 0 0deg);--accent-text-on-hover:var(--accent-text);--accent-fg:var(--accent);--accent-fg-hover:var(--accent-hover);--success:oklch(60.2% 0.182 145.1deg);--success-hover:oklch(70% 0.16 145deg);--success-text:oklch(20% 0 0deg);--success-text-on-solid:oklch(100% 0 0deg);--warning:oklch(80.2% 0.152 90.1deg);--warning-hover:oklch(88% 0.12 90deg);--warning-text:oklch(100% 0 0deg);--warning-text-on-solid:oklch(22% 0.02 90deg);--text-on-solid-hover:oklch(22% 0.02 0deg);--error:oklch(55.2% 0.218 25.1deg);--error-hover:oklch(65% 0.18 25deg);--error-text:oklch(100% 0 0deg);--error-text-on-solid:var(--error-text);--info:oklch(60.2% 0.118 210.1deg);--info-hover:oklch(70% 0.1 210deg);--info-text:oklch(20% 0 0deg);--info-text-on-solid:oklch(100% 0 0deg);--selection:oklch(70% 0.15 250deg);--color-neutral-50:oklch(98% 0 0deg);--color-neutral-100:oklch(96% 0.005 264deg);--color-neutral-200:oklch(91% 0.008 264deg);--color-neutral-300:oklch(84% 0.01 264deg);--color-neutral-400:oklch(63% 0.012 264deg);--color-neutral-500:oklch(50% 0.014 264deg);--color-neutral-600:oklch(40% 0.012 264deg);--color-neutral-700:oklch(32% 0.01 264deg);--color-neutral-800:oklch(24% 0.008 264deg);--color-neutral-900:oklch(16% 0.006 264deg);--color-neutral-950:oklch(10% 0.004 264deg);--color-accent-50:oklch(from var(--accent) 0.97deg 0.03 h);--color-accent-100:oklch(from var(--accent) 0.93deg 0.06 h);--color-accent-200:oklch(from var(--accent) 0.88deg 0.1 h);--color-accent-300:oklch(from var(--accent) 0.78deg 0.14 h);--color-accent-400:oklch(from var(--accent) 0.65deg 0.16 h);--color-accent-500:var(--accent);--color-accent-600:oklch(from var(--accent) 0.45deg 0.18 h);--color-accent-700:oklch(from var(--accent) 0.38deg 0.16 h);--color-accent-800:oklch(from var(--accent) 0.3deg 0.12 h);--color-accent-900:oklch(from var(--accent) 0.22deg 0.08 h);--color-accent-950:oklch(from var(--accent) 0.15deg 0.05 h);--color-success-50:oklch(from var(--success) 0.97deg 0.03 h);--color-success-100:oklch(from var(--success) 0.93deg 0.06 h);--color-success-200:oklch(from var(--success) 0.88deg 0.1 h);--color-success-300:oklch(from var(--success) 0.78deg 0.14 h);--color-success-400:oklch(from var(--success) 0.65deg 0.16 h);--color-success-500:var(--success);--color-success-600:oklch(from var(--success) 0.45deg 0.18 h);--color-success-700:oklch(from var(--success) 0.38deg 0.16 h);--color-success-800:oklch(from var(--success) 0.3deg 0.12 h);--color-success-900:oklch(from var(--success) 0.22deg 0.08 h);--color-success-950:oklch(from var(--success) 0.15deg 0.05 h);--color-warning-50:oklch(from var(--warning) 0.97deg 0.03 h);--color-warning-100:oklch(from var(--warning) 0.93deg 0.06 h);--color-warning-200:oklch(from var(--warning) 0.88deg 0.1 h);--color-warning-300:oklch(from var(--warning) 0.82deg 0.12 h);--color-warning-400:oklch(from var(--warning) 0.75deg 0.14 h);--color-warning-500:var(--warning);--color-warning-600:oklch(from var(--warning) 0.55deg 0.14 h);--color-warning-700:oklch(from var(--warning) 0.45deg 0.12 h);--color-warning-800:oklch(from var(--warning) 0.35deg 0.1 h);--color-warning-900:oklch(from var(--warning) 0.25deg 0.06 h);--color-warning-950:oklch(from var(--warning) 0.18deg 0.04 h);--color-error-50:oklch(from var(--error) 0.97deg 0.03 h);--color-error-100:oklch(from var(--error) 0.93deg 0.06 h);--color-error-200:oklch(from var(--error) 0.88deg 0.1 h);--color-error-300:oklch(from var(--error) 0.78deg 0.14 h);--color-error-400:oklch(from var(--error) 0.65deg 0.18 h);--color-error-500:var(--error);--color-error-600:oklch(from var(--error) 0.45deg 0.2 h);--color-error-700:oklch(from var(--error) 0.38deg 0.18 h);--color-error-800:oklch(from var(--error) 0.3deg 0.14 h);--color-error-900:oklch(from var(--error) 0.22deg 0.1 h);--color-error-950:oklch(from var(--error) 0.15deg 0.06 h);--color-info-50:oklch(from var(--info) 0.97deg 0.03 h);--color-info-100:oklch(from var(--info) 0.93deg 0.06 h);--color-info-200:oklch(from var(--info) 0.88deg 0.08 h);--color-info-300:oklch(from var(--info) 0.78deg 0.1 h);--color-info-400:oklch(from var(--info) 0.65deg 0.12 h);--color-info-500:var(--info);--color-info-600:oklch(from var(--info) 0.45deg 0.12 h);--color-info-700:oklch(from var(--info) 0.38deg 0.1 h);--color-info-800:oklch(from var(--info) 0.3deg 0.08 h);--color-info-900:oklch(from var(--info) 0.22deg 0.06 h);--color-info-950:oklch(from var(--info) 0.15deg 0.04 h);--alert-bg:oklch(from var(--background-alt) calc(l * 0.92) c h);--alert-success-bg:var(--color-success-200);--alert-error-bg:var(--color-error-200);--alert-warning-bg:var(--color-warning-200);--alert-info-bg:var(--color-info-200);--shadow-color:oklch(0% 0 0deg);--shadow-sm:0 1px 2px 0 oklch(from var(--shadow-color) l c h/5%);--shadow:0 1px 3px 0 oklch(from var(--shadow-color) l c h/10%),0 1px 2px -1px oklch(from var(--shadow-color) l c h/10%);--shadow-md:0 4px 6px -1px oklch(from var(--shadow-color) l c h/10%),0 2px 4px -2px oklch(from var(--shadow-color) l c h/6%);--shadow-lg:0 10px 15px -3px oklch(from var(--shadow-color) l c h/10%),0 4px 6px -4px oklch(from var(--shadow-color) l c h/5%);--shadow-xl:0 20px 25px -5px oklch(from var(--shadow-color) l c h/10%),0 8px 10px -6px oklch(from var(--shadow-color) l c h/4%);--overlay:oklch(from var(--shadow-color) l c h/50%);--shadow-inset-sm:inset 0 var(--spacing-0-125) var(--spacing-0-125) oklch(from var(--shadow-color) l c h/10%);--shadow-inset:inset 0 var(--spacing-0-125) var(--spacing-0-125) oklch(from var(--shadow-color) l c h/10%)}*, *::after, *::before{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;margin:0;max-width:100%;padding:0} blockquote,body, dd, dl,
|
|
2
2
|
figure, h1, h2, h3, h4, h5, h6, p{margin-block-end:0}
|
|
3
3
|
ol[role="list"],ul[role="list"]{list-style:none}body{line-height:1.5;margin:0;max-width:100%;min-height:100vh;padding:0}
|
|
4
4
|
button,h1, h2, h3, h4, h5, h6, input, label{line-height:1.1}h1, h2, h3, h4, h5, h6{text-wrap:balance}a:not([class]){-webkit-text-decoration-skip:ink;color:currentcolor;text-decoration-skip-ink:auto}img,
|
|
@@ -104,7 +104,8 @@ div.navbar__link{background:none;border:none;cursor:pointer;font:inherit;text-al
|
|
|
104
104
|
.navbar__item--has-dropdown:hover .navbar__submenu,.navbar__item--has-dropdown[aria-expanded="true"] .navbar__submenu{opacity:1;transform:translateY(0);visibility:visible}.navbar__sublink{color:var(--text);display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-normal);padding:var(--spacing-0-625) var(--spacing-4);text-decoration:none;transition:background-color var(--transition-base),color var(--transition-base)}.navbar__sublink:hover,.navbar__sublink[aria-current="page"]{background-color:var(--background);color:var(--accent)}.navbar__sublink[aria-current="page"]{font-weight:var(--font-weight-medium)}.navbar__sublink:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:calc(var(--outline-offset)*-1)}.navbar__link:hover{color:var(--accent)}.navbar__link:focus-visible{border-radius:var(--radius);outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.navbar__link::after{background-color:var(--accent);bottom:0;content:"";height:var(--spacing-0-125);left:0;position:absolute;transition:width var(--transition-slow);width:0}
|
|
105
105
|
.navbar__link:focus-visible::after,.navbar__link:hover::after,
|
|
106
106
|
.navbar__link[aria-current="page"]::after{width:100%}.navbar__link[aria-current="page"]{color:var(--accent)}.navbar__actions,.navbar__actions .search{display:none}.navbar__settings-btn{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--spacing-2);min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:var(--spacing-2) var(--spacing-3);transition:background-color var(--transition-base),border-color var(--transition-base)}.navbar__settings-btn:hover{background-color:var(--background);border-color:var(--accent);color:var(--text)}.navbar__settings-btn:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.navbar__settings-icon{color:var(--icon);flex-shrink:0;height:var(--spacing-5);width:var(--spacing-5)}.navbar__settings-label{font-size:var(--font-size-sm)}@media (width <= 1023px){.navbar{overflow-x:clip}.navbar__container{gap:var(--spacing-2);min-width:0;padding-left:var(--spacing-3);padding-right:var(--spacing-3)}.navbar__brand{flex-shrink:1;min-width:0;order:0;overflow:hidden}.navbar__brand-link{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.navbar__toggle{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);display:flex;margin-left:var(--spacing-2);margin-right:0;min-height:var(--touch-target-min);min-width:var(--touch-target-min);order:1;padding:var(--spacing-2) var(--spacing-3);transition:background-color var(--transition-base),border-color var(--transition-base)}.navbar__toggle:hover{background-color:var(--background);border-color:var(--accent)}.navbar__toggle-icon{height:var(--spacing-5)!important;width:var(--spacing-5)!important}.navbar__toggle-icon span{border-radius:var(--radius-sm);height:calc(var(--spacing-0-125)*1.5)!important}.navbar__menu{align-items:stretch;background-color:var(--background-alt);border-top:none;box-shadow:var(--shadow-md);box-sizing:border-box;flex-direction:column;gap:var(--spacing-0);left:0;margin:0;max-height:0;max-width:100%;opacity:0;overflow:hidden;padding:0;pointer-events:none;position:absolute;right:0;top:100%;transition:max-height var(--transition-slowest) var(--ease-in-out-cubic),opacity var(--transition-ease-out),padding var(--transition-slowest) var(--ease-in-out-cubic);width:100%;z-index:var(--z-navbar-mobile-menu)}.navbar__menu--open{border-bottom:none!important;left:0;max-height:var(--vh-80);opacity:1;overflow-x:hidden;overflow-y:auto;padding:var(--spacing-4) 0;pointer-events:auto;position:fixed;right:0;scroll-behavior:auto;top:var(--spacing-16);transform:translateZ(0);transition:max-height var(--transition-slowest) var(--ease-in-out-cubic),opacity var(--transition-ease-in),padding var(--transition-slowest) var(--ease-in-out-cubic);width:100%;will-change:scroll-position;z-index:var(--z-navbar-mobile-menu-open)}.navbar__menu .navbar__item{contain:layout;margin:0;max-width:100%;padding:0;width:100%}.navbar__menu:not(.navbar__menu--open){padding:0;transition:max-height var(--transition-slowest) var(--ease-in-out-cubic),opacity var(--transition-ease-out),padding var(--transition-slowest) var(--ease-in-out-cubic)}.navbar__menu--open .navbar__item:last-of-type .navbar__link{border-bottom:none!important}.navbar__item{width:100%}.navbar__link{align-items:center;border-bottom:var(--border-width) solid var(--border);box-sizing:border-box;display:flex;justify-content:space-between;margin:0;max-width:100%;min-height:var(--touch-target-min);min-width:0;overflow-wrap:break-word;padding:var(--spacing-3) var(--spacing-4) var(--spacing-3) var(--spacing-3);transition:background-color var(--transition-base) ease,color var(--transition-base) ease;width:100%}.navbar__link .navbar__dropdown-icon{display:block!important;flex-shrink:0!important;height:var(--spacing-3)!important;margin-left:var(--spacing-2);margin-right:var(--spacing-4);opacity:1!important;transition:transform var(--transition-base) ease-out;visibility:visible!important;width:var(--spacing-3)!important}.navbar__submenu{background-color:var(--background);border:none;border-top:var(--border-width) solid var(--border);box-shadow:none;contain:layout;grid-template-columns:none!important;list-style:none;margin:0!important;max-height:0;max-width:100%!important;opacity:1;overflow:hidden;padding:0!important;position:static;transform:none;transition:max-height .25s cubic-bezier(.4,0,.2,1);visibility:visible;width:100%!important}.navbar__submenu,.navbar__submenu--components .navbar__submenu-components-grid{display:block!important}.navbar__submenu--components .navbar__submenu-column{display:block!important;margin-top:var(--spacing-2);width:100%!important}.navbar__submenu--components .navbar__submenu-column .navbar__sublink{border-bottom:var(--border-width) solid var(--border);min-height:var(--touch-target-min)!important;padding:var(--spacing-3) var(--spacing-5) var(--spacing-3) var(--spacing-10)!important}.navbar__item--has-dropdown[aria-expanded="true"] .navbar__submenu{max-height:var(--max-height-navbar-submenu);overflow:visible;padding:0!important}@media (prefers-reduced-motion:reduce){.navbar__menu,.navbar__menu--open,.navbar__submenu{transition:none}}.navbar__submenu li{padding:0!important}.navbar__sublink,.navbar__submenu li{display:block!important;margin:0!important;max-width:100%!important;width:100%!important}.navbar__sublink{border-bottom:var(--border-width) solid var(--border);box-sizing:border-box!important;min-height:var(--touch-target-min)!important;min-width:0!important;overflow-wrap:break-word!important;padding:var(--spacing-3) var(--spacing-5) var(--spacing-3) var(--spacing-10)!important}.navbar__sublink:last-child{border-bottom:none}.navbar__submenu--themes .navbar__submenu-themes-grid{display:block!important}.navbar__submenu--themes .navbar__submenu-column{display:block!important;margin-top:var(--spacing-2);width:100%!important}.navbar__submenu--themes .navbar__submenu-column-label{border-bottom:var(--border-width) solid var(--border);box-sizing:border-box;display:block;font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-0-625);margin-top:var(--spacing-2);padding-bottom:var(--spacing-0-625);padding-left:var(--spacing-10);padding-right:var(--spacing-5);width:100%}.navbar__submenu--themes .navbar__submenu-column:first-of-type .navbar__submenu-column-label{margin-top:0}.navbar__submenu--themes .navbar__submenu-column .navbar__sublink{border-bottom:var(--border-width) solid var(--border);min-height:var(--touch-target-min)!important;padding:var(--spacing-3) var(--spacing-5) var(--spacing-3) var(--spacing-10)!important}.navbar__submenu--themes .navbar__sublink--with-icon{align-items:center;display:flex!important;gap:var(--spacing-2)}.navbar__submenu--themes .navbar__sublink-icon{color:var(--text-dim);flex-shrink:0}.navbar__submenu--themes .navbar__sublink-text{min-width:0;overflow:hidden;text-overflow:ellipsis}.navbar__submenu--docs .navbar__submenu-group{border-top:none;margin-top:0;padding-top:0}.navbar__submenu--docs .navbar__submenu-group:not(:first-child){border-top:var(--border-width) solid var(--border);margin-top:var(--spacing-2);padding-top:var(--spacing-2)}.navbar__submenu--docs .navbar__submenu-group-label{border-bottom:var(--border-width) solid var(--border);padding:var(--spacing-2) var(--spacing-5) var(--spacing-2) var(--spacing-10)}.navbar__submenu--docs .navbar__submenu-list .navbar__sublink{min-height:var(--touch-target-min)!important;padding:var(--spacing-3) var(--spacing-5) var(--spacing-3) var(--spacing-10)!important}.navbar__item--has-dropdown[aria-expanded="true"] .navbar__submenu--docs{max-height:min(70vh,420px)!important;overflow-x:hidden;overflow-y:auto!important;-webkit-overflow-scrolling:touch}.navbar__submenu--docs .navbar__sublink[aria-current="page"]{background-color:oklch(from var(--accent) l c h/12%)!important;box-shadow:inset var(--spacing-0-125) 0 0 var(--accent)!important;color:var(--accent)!important;font-weight:var(--font-weight-medium)}.navbar__item:last-of-type .navbar__link{border-bottom:var(--border-width) solid var(--border)}.navbar__actions-desktop .navbar__settings-btn{align-items:center;display:flex;justify-content:center;min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:var(--spacing-2) var(--spacing-3);width:auto}.navbar__actions-desktop .navbar__settings-label{border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.navbar__actions-desktop .search__trigger{justify-content:center;min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:var(--spacing-2) var(--spacing-3);width:auto}
|
|
107
|
-
.navbar__actions-desktop .search__kbd,.navbar__actions-desktop .search__trigger-text{border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.navbar__actions-desktop{display:flex;flex-shrink:0;gap:var(--spacing-2);margin-left:auto;margin-right:0;min-width:0;order:2}.search__panel{z-index:var(--z-navbar-mobile-search-panel)}.search__overlay{z-index:var(--z-navbar-mobile-search-overlay)}}.theme-switcher{display:inline-block;position:relative;width:var(--theme-switcher-width)}.theme-switcher__trigger{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-base);gap:var(--spacing-3);justify-content:space-between;min-width:0;padding:var(--spacing-3) var(--spacing-4);transition:background-color var(--transition-base),border-color var(--transition-base);width:100%}.theme-switcher__label-wrapper{align-items:center;display:flex;gap:var(--spacing-2)}.theme-switcher__label-icon{align-items:center;color:var(--icon);display:flex;flex-shrink:0;height:var(--spacing-5);justify-content:center;width:var(--spacing-5)}.theme-switcher__label-icon svg{height:100%;width:100%}.theme-switcher__trigger:hover{background-color:var(--background);border-color:var(--accent);color:var(--text)}.theme-switcher__trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.theme-switcher__trigger[aria-expanded="true"] .theme-switcher__icon{transform:rotate(180deg)}.theme-switcher__icon{color:var(--icon);flex-shrink:0;transition:transform var(--transition-base),color var(--transition-base)}.theme-switcher__menu{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:flex;flex-direction:row;gap:0;left:0;max-height:var(--spacing-100);min-width:var(--theme-switcher-width);opacity:0;overflow-y:auto;position:absolute;top:calc(100% + var(--spacing-2));transform:translateY(calc(var(--spacing-2)*-1));transition:opacity var(--transition-base),visibility var(--transition-base),transform var(--transition-base);visibility:hidden;width:var(--theme-switcher-width);z-index:var(--z-dropdown)}.theme-switcher__menu--open{opacity:1;transform:translateY(0);visibility:visible}.theme-switcher__menu-options{flex:1 1 auto;min-width:0;overflow-y:auto}.theme-switcher__preview{background-color:var(--background);display:flex;flex:0 0 auto;flex-direction:column;gap:var(--spacing-2);justify-content:flex-start;min-width:var(--spacing-32);opacity:1;padding:var(--spacing-4);pointer-events:none;transition:opacity var(--transition-fast);width:var(--spacing-32)}.theme-switcher__preview-title{color:var(--text);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);line-height:1.2;margin:0 0 var(--spacing-1) 0;overflow-wrap:break-word;padding:0}.theme-switcher__preview-header{color:var(--preview-accent,var(--text-dim));font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.04em;line-height:1.2;margin:0 0 var(--spacing-2) 0;min-height:1.25em;overflow-wrap:break-word;padding:0;text-transform:uppercase}.theme-switcher__preview-swatch-wrap{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);box-shadow:inset 0 1px 2px oklch(0 0 0deg/6%);padding:var(--spacing-1)}.theme-switcher__preview-swatch{background-color:var(--background);border-radius:var(--radius);height:var(--spacing-10);min-height:var(--spacing-10);transition:background-color var(--transition-fast);width:100%}.theme-switcher__preview-accent{background-color:var(--preview-accent,var(--accent));border-radius:var(--radius-full);flex-shrink:0;height:var(--spacing-2);transition:background-color var(--transition-fast);width:100%}@media (width <= 480px){.theme-switcher__preview{display:none}}@media (width >= 481px){.theme-switcher__menu-options{border-right:var(--border-width) solid var(--border)}}.framework-switcher{align-items:center;border-bottom:var(--border-width) solid var(--border);display:flex;flex-wrap:wrap;gap:var(--spacing-3);margin-bottom:var(--spacing-6);padding:var(--spacing-3) 0}.framework-switcher__label{color:var(--text);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.05em;text-transform:uppercase}.framework-switcher__segmented{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:inset 0 1px 2px oklch(from var(--shadow-color) l c h/8%);display:inline-flex;padding:var(--spacing-0-5)}.framework-switcher__segment{align-items:center;border-radius:var(--radius-md);color:var(--text-dim);display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--spacing-2);justify-content:center;min-width:var(--spacing-20);padding:var(--spacing-2) var(--spacing-4);text-decoration:none;transition:color var(--transition-fast),background-color var(--transition-fast),box-shadow var(--transition-fast)}.framework-switcher__icon{display:block;flex-shrink:0}.framework-switcher__segment--current .framework-switcher__icon{opacity:.95}.framework-switcher__segment--first{border-radius:var(--radius-md) 0 0 var(--radius-md)}.framework-switcher__segment--last{border-radius:0 var(--radius-md) var(--radius-md) 0}.framework-switcher__segment:only-child{border-radius:var(--radius-md)}.framework-switcher__segment:hover:not(.framework-switcher__segment--current){background-color:oklch(from var(--text) l c h/10%);color:var(--text)}.framework-switcher__segment--current{
|
|
107
|
+
.navbar__actions-desktop .search__kbd,.navbar__actions-desktop .search__trigger-text{border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.navbar__actions-desktop{display:flex;flex-shrink:0;gap:var(--spacing-2);margin-left:auto;margin-right:0;min-width:0;order:2}.search__panel{z-index:var(--z-navbar-mobile-search-panel)}.search__overlay{z-index:var(--z-navbar-mobile-search-overlay)}}.theme-switcher{display:inline-block;position:relative;width:var(--theme-switcher-width)}.theme-switcher__trigger{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-base);gap:var(--spacing-3);justify-content:space-between;min-width:0;padding:var(--spacing-3) var(--spacing-4);transition:background-color var(--transition-base),border-color var(--transition-base);width:100%}.theme-switcher__label-wrapper{align-items:center;display:flex;gap:var(--spacing-2)}.theme-switcher__label-icon{align-items:center;color:var(--icon);display:flex;flex-shrink:0;height:var(--spacing-5);justify-content:center;width:var(--spacing-5)}.theme-switcher__label-icon svg{height:100%;width:100%}.theme-switcher__trigger:hover{background-color:var(--background);border-color:var(--accent);color:var(--text)}.theme-switcher__trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.theme-switcher__trigger[aria-expanded="true"] .theme-switcher__icon{transform:rotate(180deg)}.theme-switcher__icon{color:var(--icon);flex-shrink:0;transition:transform var(--transition-base),color var(--transition-base)}.theme-switcher__menu{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:flex;flex-direction:row;gap:0;left:0;max-height:var(--spacing-100);min-width:var(--theme-switcher-width);opacity:0;overflow-y:auto;position:absolute;top:calc(100% + var(--spacing-2));transform:translateY(calc(var(--spacing-2)*-1));transition:opacity var(--transition-base),visibility var(--transition-base),transform var(--transition-base);visibility:hidden;width:var(--theme-switcher-width);z-index:var(--z-dropdown)}.theme-switcher__menu--open{opacity:1;transform:translateY(0);visibility:visible}.theme-switcher__menu-options{flex:1 1 auto;min-width:0;overflow-y:auto}.theme-switcher__preview{background-color:var(--background);display:flex;flex:0 0 auto;flex-direction:column;gap:var(--spacing-2);justify-content:flex-start;min-width:var(--spacing-32);opacity:1;padding:var(--spacing-4);pointer-events:none;transition:opacity var(--transition-fast);width:var(--spacing-32)}.theme-switcher__preview-title{color:var(--text);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);line-height:1.2;margin:0 0 var(--spacing-1) 0;overflow-wrap:break-word;padding:0}.theme-switcher__preview-header{color:var(--preview-accent,var(--text-dim));font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.04em;line-height:1.2;margin:0 0 var(--spacing-2) 0;min-height:1.25em;overflow-wrap:break-word;padding:0;text-transform:uppercase}.theme-switcher__preview-swatch-wrap{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);box-shadow:inset 0 1px 2px oklch(0 0 0deg/6%);padding:var(--spacing-1)}.theme-switcher__preview-swatch{background-color:var(--background);border-radius:var(--radius);height:var(--spacing-10);min-height:var(--spacing-10);transition:background-color var(--transition-fast);width:100%}.theme-switcher__preview-accent{background-color:var(--preview-accent,var(--accent));border-radius:var(--radius-full);flex-shrink:0;height:var(--spacing-2);transition:background-color var(--transition-fast);width:100%}@media (width <= 480px){.theme-switcher__preview{display:none}}@media (width >= 481px){.theme-switcher__menu-options{border-right:var(--border-width) solid var(--border)}}.framework-switcher{align-items:center;border-bottom:var(--border-width) solid var(--border);display:flex;flex-wrap:wrap;gap:var(--spacing-3);margin-bottom:var(--spacing-6);padding:var(--spacing-3) 0}.framework-switcher__label{color:var(--text);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.05em;text-transform:uppercase}.framework-switcher__segmented{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:inset 0 1px 2px oklch(from var(--shadow-color) l c h/8%);display:inline-flex;padding:var(--spacing-0-5)}.framework-switcher__segment{align-items:center;border-radius:var(--radius-md);color:var(--text-dim);display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--spacing-2);justify-content:center;min-width:var(--spacing-20);padding:var(--spacing-2) var(--spacing-4);text-decoration:none;transition:color var(--transition-fast),background-color var(--transition-fast),box-shadow var(--transition-fast)}.framework-switcher__icon{display:block;flex-shrink:0}.framework-switcher__segment--current .framework-switcher__icon{opacity:.95}.framework-switcher__segment--first{border-radius:var(--radius-md) 0 0 var(--radius-md)}.framework-switcher__segment--last{border-radius:0 var(--radius-md) var(--radius-md) 0}.framework-switcher__segment:only-child{border-radius:var(--radius-md)}.framework-switcher__segment--current,.framework-switcher__segment:hover:not(.framework-switcher__segment--current){background-color:oklch(from var(--text) l c h/10%);color:var(--text)}.framework-switcher__segment--current{box-shadow:var(--shadow-sm)}.framework-switcher__segment--current:hover{background-color:oklch(from var(--text) l c h/10%);color:var(--text)}@media (width <= 640px){.framework-switcher{align-items:stretch;flex-direction:column;gap:var(--spacing-2);margin-bottom:var(--spacing-4);padding:var(--spacing-2) 0}.framework-switcher__label{padding-bottom:var(--spacing-1)}.framework-switcher__segmented{display:flex;padding:var(--spacing-0-5);width:100%}.framework-switcher__segment{flex:1;font-size:var(--font-size-base);min-height:var(--touch-target-min);min-width:0;padding:var(--spacing-3) var(--spacing-2)}.framework-switcher__segment--first,
|
|
108
|
+
.framework-switcher__segment--last{border-radius:var(--radius-md)}}.theme-switcher__group{padding:var(--spacing-3) 0}.theme-switcher__group-label{border-bottom:var(--border-width) solid var(--border);color:var(--text-dim);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.05em;margin-bottom:var(--spacing-1);padding:var(--spacing-2) var(--spacing-4);text-transform:uppercase}.theme-switcher__option{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;color:var(--text);cursor:pointer;display:flex;font:inherit;font-family:var(--font-family);font-size:var(--font-size-base);gap:var(--spacing-3);padding:var(--spacing-2) var(--spacing-4);position:relative;text-align:left;transition:background-color var(--transition-fast),color var(--transition-fast);-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}
|
|
108
109
|
.theme-switcher__option:focus-visible,.theme-switcher__option:hover{background-color:var(--background);color:var(--text);outline:none}.theme-switcher__option:focus-visible{box-shadow:inset 0 0 0 var(--outline-width) var(--accent)}.theme-switcher__option-icon{color:var(--icon);flex-shrink:0;height:var(--spacing-5);width:var(--spacing-5)}.theme-switcher__option--active,
|
|
109
110
|
.theme-switcher__option--active:focus-visible,
|
|
110
111
|
.theme-switcher__option--active:hover{background-color:var(--theme-bg,var(--background));border-left:var(--border-width-accent) solid var(--accent);border-radius:var(--radius);color:var(--text);font-weight:var(--font-weight-medium);padding-left:calc(var(--spacing-4) - var(--border-width-accent))}.theme-switcher__option--active:focus-visible{box-shadow:inset 0 0 0 var(--outline-width) var(--accent)}@media (width <= 768px){.theme-switcher,.theme-switcher__menu{max-width:100%;width:100%}.theme-switcher__menu{box-sizing:border-box;left:0;min-width:0;right:auto}}@media (width <= 640px){.theme-switcher__menu{left:0;right:auto}}.font-switcher{display:inline-block;position:relative;width:var(--theme-switcher-width)}.font-switcher__trigger{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-base);gap:var(--spacing-3);justify-content:space-between;min-width:0;padding:var(--spacing-3) var(--spacing-4);transition:background-color var(--transition-base),border-color var(--transition-base);width:100%}.font-switcher__label{flex:1;min-width:0;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.font-switcher__trigger:hover{background-color:var(--background);border-color:var(--accent);color:var(--text)}.font-switcher__trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.font-switcher__trigger[aria-expanded="true"] .font-switcher__icon{transform:rotate(180deg)}.font-switcher__icon{color:var(--icon);flex-shrink:0;transition:transform var(--transition-base),color var(--transition-base)}.font-switcher__menu{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:flex;flex-direction:row;gap:0;left:0;max-height:var(--spacing-100);min-width:var(--theme-switcher-width);opacity:0;overflow-y:auto;position:absolute;top:calc(100% + var(--spacing-2));transform:translateY(calc(var(--spacing-2)*-1));transition:opacity var(--transition-base),visibility var(--transition-base),transform var(--transition-base);visibility:hidden;width:var(--theme-switcher-width);z-index:var(--z-dropdown)}.font-switcher__menu--open{opacity:1;transform:translateY(0);visibility:visible}.font-switcher__menu-options{flex:1 1 auto;min-width:0;overflow-y:auto}.font-switcher__preview{background-color:var(--background);display:flex;flex:0 0 auto;flex-direction:column;gap:var(--spacing-2);justify-content:flex-start;min-width:var(--spacing-32);padding:var(--spacing-4);pointer-events:none;width:var(--spacing-32)}.font-switcher__preview-title{color:var(--text);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);line-height:1.2;margin:0 0 var(--spacing-1) 0;padding:0}.font-switcher__preview-sample{color:var(--text);font-size:var(--font-size-lg);line-height:1.3;margin:0}.font-switcher__preview-mono{color:var(--text-dim);font-family:var(--font-family-mono);font-size:var(--font-size-sm);margin:0}@media (width <= 480px){.font-switcher__preview{display:none}}@media (width >= 481px){.font-switcher__menu-options{border-right:var(--border-width) solid var(--border)}}.font-switcher__option{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;color:var(--text);cursor:pointer;display:flex;font:inherit;font-family:var(--font-family);font-size:var(--font-size-base);padding:var(--spacing-2) var(--spacing-4);position:relative;text-align:left;transition:background-color var(--transition-fast),color var(--transition-fast);-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}
|
|
@@ -142,7 +143,25 @@ div.navbar__link{background:none;border:none;cursor:pointer;font:inherit;text-al
|
|
|
142
143
|
[data-tooltip]:focus-visible::after,[data-tooltip]:hover::after{opacity:1;transform:translateX(-50%) scale(1)}@media (prefers-reduced-motion:reduce){[data-tooltip]::after{transform:translateX(-50%);transition-duration:.1s}
|
|
143
144
|
[data-tooltip].tooltip-visible::after,
|
|
144
145
|
[data-tooltip]:focus-visible::after,[data-tooltip]:hover::after{transform:translateX(-50%)}}.icon{color:var(--icon)}.icon,.icon-card,
|
|
145
|
-
.icon-card-tooltip-host{cursor:pointer}.icons-grid{display:grid;gap:var(--spacing-3);grid-template-columns:repeat(2,1fr);margin:var(--spacing-6) 0}@media (width >= 640px){.icons-grid{gap:var(--spacing-4);grid-template-columns:repeat(3,1fr)}}@media (width >= 1024px){.icons-grid{grid-template-columns:repeat(
|
|
146
|
+
.icon-card-tooltip-host{cursor:pointer}.icons-grid{display:grid;gap:var(--spacing-3);grid-template-columns:repeat(2,1fr);margin:var(--spacing-6) 0}@media (width >= 640px){.icons-grid{gap:var(--spacing-4);grid-template-columns:repeat(3,1fr)}}@media (width >= 1024px){.icons-grid{grid-template-columns:repeat(4,1fr)}}.icon-card-tooltip-host{display:block;min-width:0;width:100%}.icon-card{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:10rem;padding:var(--spacing-3);text-align:center;transition:transform var(--transition-base),box-shadow var(--transition-base),border-color var(--transition-base),background-color var(--transition-base)}.icon-card:hover{background-color:var(--background-alt);border-color:var(--accent);box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-0-125)*-1))}.icon-card:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.icon-card__preview{align-items:center;display:flex;justify-content:center;margin-bottom:var(--spacing-2);min-height:var(--spacing-32);width:100%}.icon-card__preview--devicon{background-color:var(--background-alt);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--spacing-2)}.icon-card--devicon{background-color:var(--background)}.icon-card--devicon:hover{background-color:var(--background-alt)}.icon-card__icon{color:var(--icon);flex-shrink:0}.icon-card__content{align-items:center;display:flex;flex-direction:column;justify-content:center;min-width:0;padding-inline:var(--spacing-2);text-align:center;width:100%}.icon-card__name{color:var(--text);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-0-125) 0;max-width:100%;overflow-wrap:break-word}.icon-card__hint,.icon-card__name{line-height:var(--line-height-tight);text-align:center}.icon-card__hint{color:var(--text-dim);font-size:calc(var(--font-size-xs)*.875);margin:0;transition:color var(--transition-base)}.icon-card__hint--copied{color:var(--accent);font-weight:var(--font-weight-medium)}.devicon--rust .devicon__path{fill:#ce422b}[data-theme="github-dark-classic"] .devicon--docker .devicon__path--dark,[data-theme="github-dark-classic"] .devicon--playwright .devicon__path--dark,[data-theme="github-dark-classic"] .devicon--rust .devicon__path,
|
|
147
|
+
[data-theme="hack-the-box"] .devicon--docker .devicon__path--dark,
|
|
148
|
+
[data-theme="hack-the-box"] .devicon--playwright .devicon__path--dark,
|
|
149
|
+
[data-theme="hack-the-box"] .devicon--rust .devicon__path,
|
|
150
|
+
[data-theme="minimal-dark-neon-yellow"] .devicon--docker .devicon__path--dark,
|
|
151
|
+
[data-theme="minimal-dark-neon-yellow"] .devicon--playwright .devicon__path--dark,
|
|
152
|
+
[data-theme="minimal-dark-neon-yellow"] .devicon--rust .devicon__path,
|
|
153
|
+
[data-theme="pink-cat-boo"] .devicon--docker .devicon__path--dark,
|
|
154
|
+
[data-theme="pink-cat-boo"] .devicon--playwright .devicon__path--dark,
|
|
155
|
+
[data-theme="pink-cat-boo"] .devicon--rust .devicon__path,
|
|
156
|
+
[data-theme="rocky-blood-orange"] .devicon--docker .devicon__path--dark,
|
|
157
|
+
[data-theme="rocky-blood-orange"] .devicon--playwright .devicon__path--dark,
|
|
158
|
+
[data-theme="rocky-blood-orange"] .devicon--rust .devicon__path,
|
|
159
|
+
[data-theme="sandstorm-classic"] .devicon--docker .devicon__path--dark,
|
|
160
|
+
[data-theme="sandstorm-classic"] .devicon--playwright .devicon__path--dark,
|
|
161
|
+
[data-theme="sandstorm-classic"] .devicon--rust .devicon__path,
|
|
162
|
+
[data-theme="shades-of-purple"] .devicon--docker .devicon__path--dark,
|
|
163
|
+
[data-theme="shades-of-purple"] .devicon--playwright .devicon__path--dark,
|
|
164
|
+
[data-theme="shades-of-purple"] .devicon--rust .devicon__path{fill:var(--icon)}@media (width <= 640px){.icons-grid{gap:var(--spacing-2);grid-template-columns:repeat(2,1fr)}.icon-card{min-height:8.5rem;padding:var(--spacing-2)}.icon-card__preview{margin-bottom:var(--spacing-1);min-height:var(--spacing-24)}.icon-card__icon{height:var(--spacing-8);width:var(--spacing-8)}.icon-card__name{font-size:calc(var(--font-size-xs)*.875)}.icon-card__hint{font-size:calc(var(--font-size-xs)*.75)}}.dropdown{display:inline-block;position:relative}.dropdown__trigger{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-sm);gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);transition:background-color var(--transition-base),border-color var(--transition-base),color var(--transition-base)}.dropdown__trigger:hover{background-color:var(--background);border-color:var(--accent);color:var(--accent)}.dropdown__trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.dropdown__trigger[aria-expanded="true"] .dropdown__icon{transform:rotate(180deg)}
|
|
146
165
|
.dropdown__trigger:focus-visible .dropdown__icon,.dropdown__trigger:hover .dropdown__icon{color:var(--accent)}.dropdown__trigger-text{flex:1;text-align:left}.dropdown__icon{color:var(--icon);flex-shrink:0;transition:transform var(--transition-base),color var(--transition-base)}.dropdown__menu{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);list-style:none;margin:0;max-width:calc(100vw - var(--spacing-8));min-width:var(--spacing-64);opacity:0;overflow:visible!important;padding:var(--spacing-2) 0;position:absolute;top:calc(100% + var(--spacing-2));transform:translateY(calc(var(--spacing-2)*-1));transition:opacity var(--transition-base),visibility var(--transition-base),transform var(--transition-base);visibility:hidden;width:-moz-max-content;width:max-content;z-index:var(--z-dropdown)}.dropdown__menu--left{left:0}.dropdown__menu--right{right:0}.dropdown__menu--start{left:0}.dropdown__menu--end{right:0}.dropdown__menu--open{opacity:1;transform:translateY(0);visibility:visible}.dropdown__item{align-items:center;background-color:transparent;border:none;color:var(--text);cursor:pointer;display:flex;font-family:var(--font-family);font-size:var(--font-size-sm);gap:var(--spacing-2);min-height:var(--touch-target-min);overflow:hidden;padding:var(--spacing-2) var(--spacing-4);text-align:left;text-decoration:none;text-overflow:ellipsis;transition:background-color var(--transition-fast),color var(--transition-fast);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap;width:100%}
|
|
147
166
|
.dropdown__item:focus-visible:not(.dropdown__item--disabled),.dropdown__item:hover:not(.dropdown__item--disabled){background-color:var(--background);color:var(--accent);outline:none}.dropdown__item:focus-visible:not(.dropdown__item--disabled){box-shadow:inset 0 0 0 var(--outline-width) var(--accent)}.dropdown__item--disabled{cursor:not-allowed;opacity:var(--opacity-50);pointer-events:none}.dropdown__item-icon{flex-shrink:0;height:var(--spacing-4);width:var(--spacing-4)}.dropdown__separator{background-color:var(--border);height:var(--border-width);margin:var(--spacing-2) 0}.dropdown__item-wrapper,.dropdown__item-wrapper--has-submenu{overflow:visible;position:relative}.dropdown__item--has-submenu{align-items:center;display:flex;justify-content:space-between}.dropdown__item-arrow{color:var(--icon);flex-shrink:0;height:var(--spacing-3);margin-left:var(--spacing-2);transition:transform var(--transition-base),color var(--transition-base);width:var(--spacing-3)}
|
|
148
167
|
.dropdown__item:focus-visible:not(.dropdown__item--disabled) .dropdown__item-arrow,.dropdown__item:hover:not(.dropdown__item--disabled) .dropdown__item-arrow{color:var(--accent)}.dropdown__item-wrapper--has-submenu .dropdown__submenu--open ~ .dropdown__item-arrow,
|
|
@@ -157,10 +176,11 @@ div.navbar__link{background:none;border:none;cursor:pointer;font:inherit;text-al
|
|
|
157
176
|
.accordion__panel-content :global(ol:first-child),.accordion__panel-content :global(p:first-child),
|
|
158
177
|
.accordion__panel-content :global(ul:first-child){margin-top:0}
|
|
159
178
|
.accordion__panel-content :global(ol:last-child),.accordion__panel-content :global(p:last-child),
|
|
160
|
-
.accordion__panel-content :global(ul:last-child){margin-bottom:0}.accordion__slot-content{display:none}.tabs{width:100%}.tabs__list{border-bottom:var(--outline-width) solid var(--border);display:flex;gap:var(--spacing-1);margin-bottom:var(--spacing-6);overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.tabs__list::-webkit-scrollbar{height:var(--spacing-0-125)}.tabs__list::-webkit-scrollbar-track{background:var(--background-alt)}.tabs__list::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius)}.tabs__tab{align-items:center;background:transparent;border:none;border-bottom:calc(var(--outline-width)*2) solid transparent;border-radius:var(--radius-md) var(--radius-md) 0 0;color:var(--text-dim);cursor:pointer;display:inline-flex;font-family:var(--font-family);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);gap:var(--spacing-2);justify-content:center;margin-bottom:calc(var(--outline-width)*-1*2);min-height:var(--touch-target-min);outline:none;padding:var(--spacing-3) var(--spacing-5);position:relative;transition:color var(--transition-base),border-color var(--transition-base),background-color var(--transition-base);white-space:nowrap}.tabs__tab-icon{flex-shrink:0;vertical-align:middle}.tabs__tab:hover:not(.tabs__tab--active){background-color:var(--background-alt);color:var(--text)}.tabs__tab:focus-visible{border-radius:var(--radius-md) var(--radius-md) 0 0;outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.tabs__tab--active{border-bottom-color:var(--accent-fg);border-bottom-width:calc(var(--outline-width)*3);font-weight:var(--font-weight-semibold)}.tabs__tab--active,.tabs__tab--active:hover{background-color:var(--background-alt);color:var(--accent-fg)}.tabs__tab--active:hover{border-bottom-color:var(--accent-fg)}.tabs__panels-wrapper{width:100%}.tabs__panel{display:none;min-height:var(--spacing-20);padding:var(--spacing-6) 0;width:100%}.tabs__panel--active{animation:fadeIn var(--transition-base);display:block}.tabs__panel-content{width:100%}@keyframes fade-in{from{opacity:0;transform:translateY(var(--spacing-1))}to{opacity:1;transform:translateY(0)}}.tabs__slot-content{display:none}.tabs--pills .tabs__list{border-bottom:none;gap:var(--spacing-2)}.tabs--pills .tabs__tab{border-bottom:none;border-radius:var(--radius-md);margin-bottom:0}.tabs--pills .tabs__tab--active{background-color:var(--accent);border-bottom-color:transparent;color:var(--accent-text)}.tabs--pills .tabs__tab--active:hover{background-color:var(--accent-hover);color:var(--accent-text)}.tabs--underline .tabs__list{border-bottom:var(--outline-width) solid var(--border)}.tabs--underline .tabs__tab{border-bottom:var(--outline-width) solid transparent;padding-bottom:var(--spacing-3)}.tabs--underline .tabs__tab--active{border-bottom-color:var(--accent-fg);border-bottom-width:calc(var(--outline-width)*2)}@media (width <= 640px){.tabs__list{gap:var(--spacing-1)}.tabs__tab{font-size:var(--font-size-sm);padding:var(--spacing-2) var(--spacing-3)}.tabs__panel{padding:var(--spacing-3) 0}}@media (prefers-reduced-motion:reduce){.tabs__tab{transition:none}.tabs__panel--active{animation:none}}.progress{display:flex;flex-direction:column;gap:var(--spacing-2);width:100%}.progress__track{background-color:var(--background-alt);border:var(--border-width) solid var(--border);overflow:hidden;width:100%}.progress__bar,.progress__track{border-radius:var(--radius-full)}.progress__bar{flex-shrink:0;height:100%;min-height:var(--spacing-2);transition:width var(--transition-slow) var(--ease-in-out-cubic)}.progress--sm .progress__track{height:var(--spacing-1)}.progress--sm .progress__bar{min-height:var(--spacing-1)}.progress--md .progress__track{height:var(--spacing-2)}.progress--md .progress__bar{min-height:var(--spacing-2)}.progress--lg .progress__track{height:var(--spacing-3)}.progress--lg .progress__bar{min-height:var(--spacing-3)}.progress--primary .progress__bar{background-color:var(--accent)}.progress--success .progress__bar{background-color:var(--success)}.progress--warning .progress__bar{background-color:var(--warning)}.progress--error .progress__bar{background-color:var(--error)}.progress--info .progress__bar{background-color:var(--info)}.progress__label{color:var(--text-dim);font-size:var(--font-size-sm);text-align:right}.progress--indeterminate .progress__bar{animation:progress-indeterminate 1.5s ease-in-out infinite;min-width:30%;width:30%!important}@keyframes progress-indeterminate{0%{transform:translateX(-100%)}100%{transform:translateX(233.333%)}}@media (prefers-reduced-motion:reduce){.progress__bar{transition:none}.progress--indeterminate .progress__bar{animation:none;opacity:.7;width:50%!important}}.spinner{align-items:center;display:inline-flex;justify-content:center;vertical-align:middle}.spinner__ring{animation:spinner-rotate .8s linear infinite;border-color:var(--border);border-radius:var(--radius-full);border-style:solid;border-top-color:currentcolor;display:block}.spinner--sm .spinner__ring{border-width:var(--border-width-2);height:var(--spacing-4);width:var(--spacing-4)}.spinner--md .spinner__ring{border-width:var(--border-width-3);height:var(--spacing-6);width:var(--spacing-6)}.spinner--lg .spinner__ring{border-width:var(--border-width-4);height:var(--spacing-8);width:var(--spacing-8)}.spinner--primary{color:var(--accent)}.spinner--success{color:var(--success)}.spinner--warning{color:var(--warning)}.spinner--error{color:var(--error)}.spinner--info{color:var(--info)}@keyframes spinner-rotate{to{transform:rotate(1turn)}}@media (prefers-reduced-motion:reduce){.spinner__ring{animation:none;border-bottom-color:transparent;border-left-color:transparent;border-right-color:transparent}}.avatar{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);color:var(--text-dim);display:inline-flex;flex-shrink:0;font-size:inherit;font-weight:var(--font-weight-semibold);justify-content:center;line-height:1;overflow:hidden}.avatar__img{display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.avatar__initials{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.avatar--sm{font-size:var(--font-size-xs);height:var(--spacing-8);width:var(--spacing-8)}.avatar--md{font-size:var(--font-size-sm);height:var(--spacing-10);width:var(--spacing-10)}.avatar--lg{font-size:var(--font-size-base);height:var(--spacing-12);width:var(--spacing-12)}.avatar--circle{border-radius:var(--radius-full)}.avatar--square{border-radius:var(--radius-md)}.divider{align-items:center;color:var(--text-dim);display:flex;font-size:var(--font-size-sm);gap:var(--spacing-3)}.divider__line{border:none;border-left:none;border-top:var(--border-width) solid var(--border);flex:1;min-height:0;min-width:0}.divider__label{flex-shrink:0;padding:0 var(--spacing-2);white-space:nowrap}.divider--horizontal{width:100%}.divider--horizontal .divider__line{border-left:none;border-top:var(--border-width) solid var(--border)}.divider--vertical{flex-direction:column;height:100%;min-height:var(--spacing-8);width:auto}.divider--vertical .divider__line{border-left:var(--border-width) solid var(--border);border-top:none;flex:1;min-height:var(--spacing-4);width:0}.footer{background-color:var(--background-alt);border-top:var(--border-width) solid var(--border);color:var(--text-dim);font-size:var(--font-size-sm);margin-top:auto;padding:var(--spacing-6) 0}.footer__container{box-sizing:border-box;margin-left:auto;margin-right:auto;max-width:var(--container-default);padding-left:var(--spacing-4);padding-right:var(--spacing-4);width:100%}.footer__inner{align-items:center;display:flex;flex-wrap:wrap;gap:var(--spacing-4);justify-content:space-between}.footer__copyright{color:var(--text-dim);margin:0}.footer__site-name{color:var(--text);font-weight:var(--font-weight-medium)}.footer__nav{margin:0}.footer__links{align-items:center;display:flex;flex-wrap:wrap;gap:var(--spacing-2) var(--spacing-4);list-style:none;margin:0;padding:0}.footer__link-item{margin:0}.footer__link{color:var(--text-dim);text-decoration:none;transition:color var(--transition-base)}.footer__link:hover{color:var(--accent-fg)}.footer__link:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.table{display:flex;flex-direction:column;gap:var(--spacing-3);width:100%}.table__filter-wrap{align-items:center;display:flex;flex-shrink:0;position:relative}.table__filter-icon{align-items:center;color:var(--icon-dim);display:flex;justify-content:center;left:var(--spacing-3);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.table__filter-icon-svg{color:currentcolor;height:var(--table-filter-icon-size,1.25rem);width:var(--table-filter-icon-size,1.25rem)}.table__filter-wrap:focus-within .table__filter-icon{color:var(--accent)}.table__filter-wrap .table__filter{background-color:var(--background);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);font-family:var(--font-family);font-size:var(--font-size-base);max-width:var(--spacing-80);padding-bottom:var(--spacing-2);padding-left:3.5rem;padding-right:var(--spacing-3);padding-top:var(--spacing-2);width:100%}.table__filter-wrap .table__filter::-moz-placeholder{color:var(--text-dim)}.table__filter-wrap .table__filter::placeholder{color:var(--text-dim)}.table__filter-wrap .table__filter:focus{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.table__wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}.table__table{border-collapse:collapse;border-spacing:0;font-size:var(--font-size-sm);width:100%}.table__caption{color:var(--text);font-weight:var(--font-weight-semibold);padding:var(--spacing-2) 0;text-align:left}.table__head .table__row{border-bottom:var(--border-width-2) solid var(--border)}.table__cell{border-bottom:var(--border-width) solid var(--border);color:var(--text);padding:var(--spacing-3) var(--spacing-4);text-align:left}.table__cell--head{color:var(--text);font-weight:var(--font-weight-semibold);white-space:nowrap}.table__sort-trigger{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:inline-flex;font:inherit;font-weight:var(--font-weight-semibold);padding:0;text-align:left;transition:background-color var(--transition-fast),color var(--transition-fast);width:100%}.table__sort-trigger:hover{background-color:var(--background-alt);color:var(--text)}.table__sort-trigger:hover .table__sort-icon-svg{color:var(--accent)}.table__sort-trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.table--sortable .table__cell--head{padding:0}.table--sortable .table__cell--head .table__sort-trigger{padding:var(--spacing-3) var(--spacing-4)}.table__cell-content{display:inline-block}.table__sort-icon{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;margin-left:var(--spacing-2)}.table__sort-icon-svg{color:var(--icon-dim);height:var(--table-sort-icon-size,1.25rem);transition:color var(--transition-fast);width:var(--table-sort-icon-size,1.25rem)}.table__body .table__row:hover{background-color:var(--background-alt)}.table__body .table__row:hover .table__cell{color:var(--text)}.table--striped .table__body .table__row:nth-child(even){background-color:var(--background-alt)}.table--striped .table__body .table__row:nth-child(even):hover{background-color:var(--background)}.table--striped .table__body .table__row:nth-child(even):hover .table__cell{color:var(--text)}.table__body .table__row[hidden]{display:none}@media (prefers-reduced-motion:reduce){.table__sort-icon-svg,.table__sort-trigger{transition:none}}.home{padding:var(--spacing-8) 0}.home__container{box-sizing:border-box;margin-left:auto;margin-right:auto;max-width:var(--container-default);min-width:0;padding-left:var(--spacing-4);padding-right:var(--spacing-4);width:100%}.home__hero{margin-bottom:var(--spacing-16);padding:var(--spacing-16) 0;text-align:center}.home__title{color:var(--text);font-size:var(--font-size-5xl);font-weight:var(--font-weight-extrabold);line-height:var(--line-height-tight);margin:0 0 var(--spacing-6) 0}.home__subtitle{color:var(--text-dim);font-size:var(--font-size-xl);line-height:var(--line-height-relaxed);margin:0 auto var(--spacing-8) auto;max-width:var(--spacing-175)}.home__hero-ctas{display:flex;flex-wrap:wrap;gap:var(--spacing-4);justify-content:center;margin-top:var(--spacing-6)}.home__hero-cta{text-decoration:none}.home__section-title{color:var(--text);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-8);text-align:center}.home__install{align-items:center;display:flex;flex-direction:column;justify-content:center;margin-bottom:var(--spacing-16)}.home__install-grid{display:grid;gap:0;grid-template-columns:1fr;margin:0 auto;max-width:var(--spacing-150);width:100%}@media (width >= 768px){.home__install-grid{grid-template-columns:1fr auto 1fr;max-width:none}}.home__install-block{align-items:stretch;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;min-height:var(--spacing-24);padding:var(--spacing-6);width:100%}.home__install-or{align-items:center;color:var(--text-dim);display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);gap:var(--spacing-4);justify-content:center;letter-spacing:var(--letter-spacing-wider);padding:var(--spacing-4) 0}
|
|
179
|
+
.accordion__panel-content :global(ul:last-child){margin-bottom:0}.accordion__slot-content{display:none}.tabs{width:100%}.tabs__list{border-bottom:var(--outline-width) solid var(--border);display:flex;gap:var(--spacing-1);margin-bottom:var(--spacing-6);overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch}.tabs__list::-webkit-scrollbar{height:var(--spacing-0-125)}.tabs__list::-webkit-scrollbar-track{background:var(--background-alt)}.tabs__list::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius)}.tabs__tab{align-items:center;background:transparent;border:none;border-bottom:calc(var(--outline-width)*2) solid transparent;border-radius:var(--radius-md) var(--radius-md) 0 0;color:var(--text-dim);cursor:pointer;display:inline-flex;font-family:var(--font-family);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);gap:var(--spacing-2);justify-content:center;margin-bottom:calc(var(--outline-width)*-1*2);min-height:var(--touch-target-min);outline:none;padding:var(--spacing-3) var(--spacing-5);position:relative;transition:color var(--transition-base),border-color var(--transition-base),background-color var(--transition-base);white-space:nowrap}.tabs__tab-icon{flex-shrink:0;vertical-align:middle}.tabs__tab:hover:not(.tabs__tab--active){background-color:var(--background-alt);color:var(--text)}.tabs__tab:focus-visible{border-radius:var(--radius-md) var(--radius-md) 0 0;outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.tabs__tab--active{border-bottom-color:var(--accent-fg);border-bottom-width:calc(var(--outline-width)*3);font-weight:var(--font-weight-semibold)}.tabs__tab--active,.tabs__tab--active:hover{background-color:var(--background-alt);color:var(--accent-fg)}.tabs__tab--active:hover{border-bottom-color:var(--accent-fg)}.tabs__panels-wrapper{width:100%}.tabs__panel{display:none;min-height:var(--spacing-20);padding:var(--spacing-6) 0;width:100%}.tabs__panel--active{animation:fadeIn var(--transition-base);display:block}.tabs__panel-content{width:100%}@keyframes fade-in{from{opacity:0;transform:translateY(var(--spacing-1))}to{opacity:1;transform:translateY(0)}}.tabs__slot-content{display:none}.tabs--pills .tabs__list{border-bottom:none;gap:var(--spacing-2)}.tabs--pills .tabs__tab{border-bottom:none;border-radius:var(--radius-md);margin-bottom:0}.tabs--pills .tabs__tab--active{background-color:var(--accent);border-bottom-color:transparent;color:var(--accent-text)}.tabs--pills .tabs__tab--active:hover{background-color:var(--accent-hover);color:var(--accent-text)}.tabs--underline .tabs__list{border-bottom:var(--outline-width) solid var(--border)}.tabs--underline .tabs__tab{border-bottom:var(--outline-width) solid transparent;padding-bottom:var(--spacing-3)}.tabs--underline .tabs__tab--active{border-bottom-color:var(--accent-fg);border-bottom-width:calc(var(--outline-width)*2)}@media (width <= 640px){.tabs__list{gap:var(--spacing-1)}.tabs__tab{font-size:var(--font-size-sm);padding:var(--spacing-2) var(--spacing-3)}.tabs__panel{padding:var(--spacing-3) 0}}@media (prefers-reduced-motion:reduce){.tabs__tab{transition:none}.tabs__panel--active{animation:none}}.progress{display:flex;flex-direction:column;gap:var(--spacing-2);width:100%}.progress__track{background-color:var(--background-alt);border:var(--border-width) solid var(--border);overflow:hidden;width:100%}.progress__bar,.progress__track{border-radius:var(--radius-full)}.progress__bar{flex-shrink:0;height:100%;min-height:var(--spacing-2);transition:width var(--transition-slow) var(--ease-in-out-cubic)}.progress--sm .progress__track{height:var(--spacing-1)}.progress--sm .progress__bar{min-height:var(--spacing-1)}.progress--md .progress__track{height:var(--spacing-2)}.progress--md .progress__bar{min-height:var(--spacing-2)}.progress--lg .progress__track{height:var(--spacing-3)}.progress--lg .progress__bar{min-height:var(--spacing-3)}.progress--primary .progress__bar{background-color:var(--accent)}.progress--success .progress__bar{background-color:var(--success)}.progress--warning .progress__bar{background-color:var(--warning)}.progress--error .progress__bar{background-color:var(--error)}.progress--info .progress__bar{background-color:var(--info)}.progress__label{color:var(--text-dim);font-size:var(--font-size-sm);text-align:right}.progress--indeterminate .progress__bar{animation:progress-indeterminate 1.5s ease-in-out infinite;min-width:30%;width:30%!important}@keyframes progress-indeterminate{0%{transform:translateX(-100%)}100%{transform:translateX(233.333%)}}@media (prefers-reduced-motion:reduce){.progress__bar{transition:none}.progress--indeterminate .progress__bar{animation:none;opacity:.7;width:50%!important}}.spinner{align-items:center;display:inline-flex;justify-content:center;vertical-align:middle}.spinner__ring{animation:spinner-rotate .8s linear infinite;border-color:var(--border);border-radius:var(--radius-full);border-style:solid;border-top-color:currentcolor;display:block}.spinner--sm .spinner__ring{border-width:var(--border-width-2);height:var(--spacing-4);width:var(--spacing-4)}.spinner--md .spinner__ring{border-width:var(--border-width-3);height:var(--spacing-6);width:var(--spacing-6)}.spinner--lg .spinner__ring{border-width:var(--border-width-4);height:var(--spacing-8);width:var(--spacing-8)}.spinner--primary{color:var(--accent)}.spinner--success{color:var(--success)}.spinner--warning{color:var(--warning)}.spinner--error{color:var(--error)}.spinner--info{color:var(--info)}@keyframes spinner-rotate{to{transform:rotate(1turn)}}@media (prefers-reduced-motion:reduce){.spinner__ring{animation:none;border-bottom-color:transparent;border-left-color:transparent;border-right-color:transparent}}.avatar{align-items:center;background-color:var(--background-alt);border:var(--border-width) solid var(--border);color:var(--text-dim);display:inline-flex;flex-shrink:0;font-size:inherit;font-weight:var(--font-weight-semibold);justify-content:center;line-height:1;overflow:hidden}.avatar__img{display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.avatar__initials{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.avatar--sm{font-size:var(--font-size-xs);height:var(--spacing-8);width:var(--spacing-8)}.avatar--md{font-size:var(--font-size-sm);height:var(--spacing-10);width:var(--spacing-10)}.avatar--lg{font-size:var(--font-size-base);height:var(--spacing-12);width:var(--spacing-12)}.avatar--circle{border-radius:var(--radius-full)}.avatar--square{border-radius:var(--radius-md)}.divider{align-items:center;color:var(--text-dim);display:flex;font-size:var(--font-size-sm);gap:var(--spacing-3)}.divider__line{border:none;border-left:none;border-top:var(--border-width) solid var(--border);flex:1;min-height:0;min-width:0}.divider__label{flex-shrink:0;padding:0 var(--spacing-2);white-space:nowrap}.divider--horizontal{width:100%}.divider--horizontal .divider__line{border-left:none;border-top:var(--border-width) solid var(--border)}.divider--vertical{flex-direction:column;height:100%;min-height:var(--spacing-8);width:auto}.divider--vertical .divider__line{border-left:var(--border-width) solid var(--border);border-top:none;flex:1;min-height:var(--spacing-4);width:0}.footer{background-color:var(--background-alt);border-top:var(--border-width) solid var(--border);color:var(--text-dim);font-size:var(--font-size-sm);margin-top:auto;padding:var(--spacing-6) 0}.footer__container{box-sizing:border-box;margin-left:auto;margin-right:auto;max-width:var(--container-default);padding-left:var(--spacing-4);padding-right:var(--spacing-4);width:100%}.footer__inner{align-items:center;display:flex;flex-wrap:wrap;gap:var(--spacing-4);justify-content:space-between}.footer__copyright{color:var(--text-dim);margin:0}.footer__site-name{color:var(--text);font-weight:var(--font-weight-medium)}.footer__nav{margin:0}.footer__links{align-items:center;display:flex;flex-wrap:wrap;gap:var(--spacing-2) var(--spacing-4);list-style:none;margin:0;padding:0}.footer__link-item{margin:0}.footer__link{color:var(--text-dim);text-decoration:none;transition:color var(--transition-base)}.footer__link:hover{color:var(--accent-fg)}.footer__link:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.table{display:flex;flex-direction:column;gap:var(--spacing-3);width:100%}.table__filter-wrap{align-items:center;display:flex;flex-shrink:0;position:relative}.table__filter-icon{align-items:center;color:var(--icon-dim);display:flex;justify-content:center;left:var(--spacing-3);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.table__filter-icon-svg{color:currentcolor;height:var(--table-filter-icon-size,1.25rem);width:var(--table-filter-icon-size,1.25rem)}.table__filter-wrap:focus-within .table__filter-icon{color:var(--accent)}.table__filter-wrap .table__filter{background-color:var(--background);border:var(--border-width) solid var(--border);border-radius:var(--radius-md);color:var(--text);font-family:var(--font-family);font-size:var(--font-size-base);max-width:var(--spacing-80);padding-bottom:var(--spacing-2);padding-left:3.5rem;padding-right:var(--spacing-3);padding-top:var(--spacing-2);width:100%}.table__filter-wrap .table__filter::-moz-placeholder{color:var(--text-dim)}.table__filter-wrap .table__filter::placeholder{color:var(--text-dim)}.table__filter-wrap .table__filter:focus{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.table__wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}.table__table{border-collapse:collapse;border-spacing:0;font-size:var(--font-size-sm);width:100%}.table__caption{color:var(--text);font-weight:var(--font-weight-semibold);padding:var(--spacing-2) 0;text-align:left}.table__head .table__row{border-bottom:var(--border-width-2) solid var(--border)}.table__cell{border-bottom:var(--border-width) solid var(--border);color:var(--text);padding:var(--spacing-3) var(--spacing-4);text-align:left}.table__cell--head{color:var(--text);font-weight:var(--font-weight-semibold);white-space:nowrap}.table__sort-trigger{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;border-radius:var(--radius-md);color:var(--text);cursor:pointer;display:inline-flex;font:inherit;font-weight:var(--font-weight-semibold);padding:0;text-align:left;transition:background-color var(--transition-fast),color var(--transition-fast);width:100%}.table__sort-trigger:hover{background-color:var(--background-alt);color:var(--text)}.table__sort-trigger:hover .table__sort-icon-svg{color:var(--accent)}.table__sort-trigger:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.table--sortable .table__cell--head{padding:0}.table--sortable .table__cell--head .table__sort-trigger{padding:var(--spacing-3) var(--spacing-4)}.table__cell-content{display:inline-block}.table__sort-icon{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;margin-left:var(--spacing-2)}.table__sort-icon-svg{color:var(--icon-dim);height:var(--table-sort-icon-size,1.25rem);transition:color var(--transition-fast);width:var(--table-sort-icon-size,1.25rem)}.table__body .table__row:hover{background-color:var(--background-alt)}.table__body .table__row:hover .table__cell{color:var(--text)}.table--striped .table__body .table__row:nth-child(even){background-color:var(--background-alt)}.table--striped .table__body .table__row:nth-child(even):hover{background-color:var(--background)}.table--striped .table__body .table__row:nth-child(even):hover .table__cell{color:var(--text)}.table__body .table__row[hidden]{display:none}@media (prefers-reduced-motion:reduce){.table__sort-icon-svg,.table__sort-trigger{transition:none}}.home{padding:var(--spacing-8) 0}.home__container{box-sizing:border-box;margin-left:auto;margin-right:auto;max-width:var(--container-default);min-width:0;padding-left:var(--spacing-4);padding-right:var(--spacing-4);width:100%}.home__hero{margin-bottom:var(--spacing-16);padding:var(--spacing-16) 0;text-align:center}.home__title{color:var(--text);font-size:var(--font-size-5xl);font-weight:var(--font-weight-extrabold);line-height:var(--line-height-tight);margin:0 0 var(--spacing-6) 0}.home__subtitle{color:var(--text-dim);font-size:var(--font-size-xl);line-height:var(--line-height-relaxed);margin:0 auto var(--spacing-8) auto;max-width:var(--spacing-175)}.home__hero-ctas{display:flex;flex-wrap:wrap;gap:var(--spacing-4);justify-content:center;margin-top:var(--spacing-6)}.home__hero-cta{text-decoration:none}.home__section-title{color:var(--text);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-8);text-align:center}.home__install{align-items:center;display:flex;flex-direction:column;justify-content:center;margin-bottom:var(--spacing-16);max-width:100%;min-width:0}.home__install-grid{display:grid;gap:0;grid-template-columns:1fr;margin:0 auto;max-width:var(--spacing-150);min-width:0;width:100%}@media (width >= 768px){.home__install-grid{grid-template-columns:1fr auto 1fr;max-width:100%}}.home__install-block{align-items:stretch;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;min-height:var(--spacing-24);min-width:0;overflow:hidden;padding:var(--spacing-6);width:100%}.home__install-or{align-items:center;color:var(--text-dim);display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);gap:var(--spacing-4);justify-content:center;letter-spacing:var(--letter-spacing-wider);padding:var(--spacing-4) 0}
|
|
161
180
|
.home__install-or::after,.home__install-or::before{border-top:var(--border-width) solid var(--border);content:"";flex:1;height:0}@media (width >= 768px){.home__install-or{flex-direction:column;gap:var(--spacing-4);padding:0 var(--spacing-4)}
|
|
162
181
|
.home__install-or::after,.home__install-or::before{border-left:var(--border-width) solid var(--border);border-top:none;flex:1;min-height:var(--spacing-8);width:0}}.home__install-title{color:var(--text);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-2) 0;text-align:center}.home__install-label{color:var(--text-dim);font-size:var(--font-size-sm);margin:0 0 var(--spacing-4) 0;text-align:center}.home__install-copy{align-items:center;display:flex;justify-content:center;width:100%}.home__install-copy .copy-to-clipboard{justify-content:space-between;width:100%}.home__install-copy .copy-to-clipboard__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.home__cli-tabs{margin-top:var(--spacing-1)}.home__cli-tabs .cli-command-tabs__tabs,
|
|
163
|
-
.home__cli-tabs .package-install-tabs__tabs{margin-top:0}.home__cli-tabs .tabs__list{margin-bottom:var(--spacing-2);overflow-x:visible;overflow-y:visible;scrollbar-width:none}.home__cli-tabs .tabs__list::-webkit-scrollbar{display:none}.home__cli-tabs .tabs__panel{min-height:0;padding:0}.home__cli-tabs .cli-command-tabs__panel .code-block__header{padding:var(--spacing-1) var(--spacing-2)}.home__cli-tabs .cli-command-tabs__panel .code-block pre{padding:var(--spacing-2)}.home__cli-tabs .cli-command-tabs__panel .code-block
|
|
182
|
+
.home__cli-tabs .package-install-tabs__tabs{margin-top:0}.home__cli-tabs .tabs__list{margin-bottom:var(--spacing-2);overflow-x:visible;overflow-y:visible;scrollbar-width:none}.home__cli-tabs .tabs__list::-webkit-scrollbar{display:none}.home__cli-tabs .tabs__panel{min-height:0;padding:0}.home__cli-tabs .cli-command-tabs__panel .code-block__header{padding:var(--spacing-1) var(--spacing-2)}.home__cli-tabs .cli-command-tabs__panel .code-block pre{padding:var(--spacing-2)}.home__cli-tabs .cli-command-tabs__panel .code-block,
|
|
183
|
+
.home__cli-tabs .package-install-tabs__panel .code-block{margin:0;min-width:0;overflow:hidden}.home__features{margin-bottom:var(--spacing-16)}.home__features-intro{color:var(--text-dim);font-size:var(--font-size-lg);line-height:var(--line-height-relaxed);margin:0 auto var(--spacing-10) auto;max-width:var(--spacing-125);text-align:center}.home__features-featured{display:grid;gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--spacing-80)),1fr));margin-bottom:var(--spacing-8)}.home__features-supporting-label{color:var(--text-dim);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-wider);margin:0 0 var(--spacing-4) 0;text-align:center;text-transform:uppercase}.home__grid{display:grid;gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--spacing-75),1fr));margin-bottom:var(--spacing-16)}.home__grid--supporting{gap:var(--spacing-5);margin-bottom:0}.home__card{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);color:var(--text);padding:var(--spacing-6);transition:border-color var(--transition-base),box-shadow var(--transition-base)}.home__card:hover{border-color:var(--border);box-shadow:var(--shadow-sm)}.home__card--featured{border-color:var(--border);border-top:3px solid oklch(from var(--accent) l c h/24%);padding:var(--spacing-8)}.home__card--featured:hover{border-color:oklch(from var(--accent) l c h/28%);border-top-color:oklch(from var(--accent) l c h/40%);box-shadow:var(--shadow-md)}.home__card--supporting{display:flex;flex-direction:column;min-height:var(--spacing-32);padding:var(--spacing-5)}.home__card--supporting h3{font-size:var(--font-size-base);margin-bottom:var(--spacing-2)}.home__card--supporting p{font-size:var(--font-size-sm)}.home__card-icon{background-color:oklch(from var(--accent) l c h/14%);border-radius:var(--radius-md);color:var(--accent-fg);display:inline-block;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-wider);margin-bottom:var(--spacing-3);padding:var(--spacing-1) var(--spacing-2);text-transform:uppercase}.home__card h3{color:var(--text);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-3) 0}.home__card--featured h3{font-size:var(--font-size-xl);margin-bottom:var(--spacing-4)}.home__card p{color:var(--text-dim);line-height:var(--line-height-relaxed);margin:0}.home__examples{margin-bottom:var(--spacing-16)}.home__example{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);margin-bottom:var(--spacing-8);padding:var(--spacing-8)}.home__example h3{color:var(--text);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-4) 0}.home__example p{color:var(--text-dim);margin-bottom:var(--spacing-4)}.home__button-group{display:flex;flex-wrap:wrap;gap:var(--spacing-3)}.home__theme-demo{max-width:var(--spacing-75)}.home__theme-demo .theme-switcher{position:relative;width:100%;z-index:var(--z-dropdown)}.home__theme-demo .theme-switcher__menu{z-index:var(--z-dropdown)}.home__add-command{margin-bottom:var(--spacing-16)}.home__add-command-block{align-items:stretch;background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);display:flex;gap:var(--spacing-2);max-width:100%;min-width:0;overflow:hidden}.home__add-command-block pre{color:var(--text);flex:1;font-family:var(--font-family-mono);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);margin:0;min-width:0;overflow-x:auto;padding:var(--spacing-4)}.home__add-command-block code{white-space:pre}.home__add-command-copy{align-self:center;flex-shrink:0;margin-right:var(--spacing-2)}.home__docs{margin-bottom:var(--spacing-8)}.home__docs-grid{display:grid;gap:var(--spacing-6);grid-template-columns:repeat(auto-fit,minmax(var(--spacing-70),1fr))}.home__doc-card{background-color:var(--background-alt);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);color:var(--text);display:block;padding:var(--spacing-6);text-decoration:none;transition:border-color var(--transition-base),transform var(--transition-base),box-shadow var(--transition-base)}.home__doc-card:hover{border-color:var(--accent);box-shadow:var(--shadow-md);transform:translateY(calc(var(--spacing-0-125)*-1))}.home__doc-card:focus-visible{outline:var(--outline-width) solid var(--accent);outline-offset:var(--outline-offset)}.home__doc-card h3{color:var(--accent-fg);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-2) 0}.home__doc-card p{color:var(--text-dim);line-height:var(--line-height-relaxed);margin:0}@media (width <= 640px){.home__title{font-size:var(--font-size-4xl)}.home__subtitle{font-size:var(--font-size-lg)}.home__install-grid{grid-template-columns:1fr}.home__features-intro{font-size:var(--font-size-base)}.home__features-featured{grid-template-columns:1fr}.home__card--supporting{min-height:0}
|
|
164
184
|
.home__docs-grid,.home__grid{grid-template-columns:1fr}}.theming-page .card a{color:var(--text);text-decoration:none;transition:color var(--transition-base)}.theming-page .card a:hover{color:var(--accent-fg)}.theming-page .card:hover{transform:translateY(calc(var(--spacing-0-125)*-1));transition:transform var(--transition-base)}.reduced-motion .theming-page .card:hover{transform:none}.theme-by{color:var(--text-dim);font-size:var(--font-size-sm);margin:0 0 var(--spacing-4) 0}.theme-by a{color:var(--accent-fg);text-decoration:none;transition:color var(--transition-base)}.theme-by a:hover{color:var(--accent-fg-hover);text-decoration:underline}.docs{align-items:stretch;display:flex;flex-direction:row;min-height:calc(100vh - 4rem);padding:var(--spacing-6) 0;position:relative}.docs__sidebar-toggle{align-items:center;background-color:var(--accent);border:none;border-radius:var(--radius-md);bottom:var(--spacing-6);box-shadow:var(--shadow-lg);color:var(--accent-text);cursor:pointer;display:none;font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--spacing-2);left:var(--spacing-6);padding:var(--spacing-3) var(--spacing-4);position:fixed;transition:background-color var(--transition-base),transform var(--transition-base);z-index:calc(var(--z-settings) - 1)}.docs__sidebar-toggle:hover{background-color:var(--accent-hover)}.docs__sidebar-toggle:focus-visible{outline:var(--outline-width) solid var(--accent-text);outline-offset:var(--outline-offset)}.docs__sidebar-toggle-icon{display:flex;flex-direction:column;gap:var(--spacing-0-375)}.docs__sidebar-toggle-icon span{background-color:currentcolor;border-radius:1px;display:block;height:2px;width:var(--spacing-4)}.docs__sidebar-overlay{background-color:oklch(0 0 0deg/40%);display:none;inset:0;opacity:0;position:fixed;transition:opacity var(--transition-base),visibility var(--transition-base);visibility:hidden;z-index:calc(var(--z-settings) - 2)}.docs--sidebar-open .docs__sidebar-overlay{opacity:1;visibility:visible}.docs__main{flex:1 1 0%;min-width:0}@media (width >= 1025px){#docs-sidebar-container{align-items:stretch;display:flex;flex-direction:column;min-height:0}}.docs-sidebar{background-color:var(--background);border-right:var(--border-width) solid var(--border);flex-shrink:0;overflow-y:auto;padding:var(--spacing-6) var(--spacing-4) var(--spacing-8) 0;width:var(--docs-sidebar-width,14rem)}@media (width >= 1025px){.docs-sidebar{align-self:flex-start;max-height:calc(100vh - var(--spacing-16) - var(--spacing-4));position:sticky;top:calc(var(--spacing-16) + var(--spacing-4));z-index:1}}.docs-sidebar__nav{display:flex;flex-direction:column;gap:var(--spacing-6)}.docs-sidebar__group-label{color:var(--text-dim);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-wider);margin:0 0 var(--spacing-2) 0;padding:var(--spacing-2) var(--spacing-3) var(--spacing-2);text-transform:uppercase}.docs-sidebar__list{list-style:none;margin:0;padding:0}.docs-sidebar__item{margin:0}.docs-sidebar__link{border-radius:var(--radius-md);color:var(--text-dim);display:block;font-size:var(--font-size-sm);padding:var(--spacing-2) var(--spacing-3);text-decoration:none;transition:color var(--transition-base),background-color var(--transition-base)}.docs-sidebar__link:hover{background-color:var(--background-alt);color:var(--text)}.docs-sidebar__link--active{background-color:oklch(from var(--accent-fg) l c h/12%);color:var(--accent-fg);font-weight:var(--font-weight-medium)}.docs-sidebar__link--active:hover{background-color:oklch(from var(--accent-fg) l c h/16%);color:var(--accent-fg-hover)}.docs-sidebar-demo{background-color:var(--background);border:var(--border-width) solid var(--border);border-radius:var(--radius-lg);max-height:18rem;overflow:auto;padding:var(--spacing-3)}.docs-sidebar-demo .docs-sidebar{border-right:none;max-height:none;padding:0 var(--spacing-2) var(--spacing-4) 0;position:static;width:11rem}.docs-sidebar-demo .docs-sidebar__nav{gap:var(--spacing-4)}.docs-sidebar-demo .docs-sidebar__group-label,
|
|
165
185
|
.docs-sidebar-demo h2.docs-sidebar__group-label{font-size:.625rem;font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-1);padding:var(--spacing-1) var(--spacing-2) var(--spacing-1)}.docs-sidebar-demo .docs-sidebar__link{font-size:.75rem;padding:var(--spacing-1) var(--spacing-2)}.theme-page__header{align-items:center;display:flex;gap:var(--spacing-3);margin-bottom:var(--spacing-2)}.theme-page__header h2{margin:0}html.docs-sidebar-mobile #docs-sidebar-container{display:none!important}@media (width <= 1024px){#docs-sidebar-container,
|
|
166
186
|
.docs-sidebar,
|
package/package.json
CHANGED
|
@@ -2,8 +2,10 @@
|
|
|
2
2
|
interface Tab {
|
|
3
3
|
id: string;
|
|
4
4
|
label: string;
|
|
5
|
-
/** Optional icon URL (e.g. /icons/
|
|
5
|
+
/** Optional icon URL (e.g. /icons/devicons/Bun.svg) shown before the label */
|
|
6
6
|
icon?: string;
|
|
7
|
+
/** Optional Astro icon component (theme-aware); used when present instead of icon URL */
|
|
8
|
+
iconComponent?: any;
|
|
7
9
|
content?: string;
|
|
8
10
|
}
|
|
9
11
|
|
|
@@ -51,7 +53,7 @@ const classes = `tabs ${variantClass} ${className}`.trim();
|
|
|
51
53
|
data-tab-id={tab.id}
|
|
52
54
|
data-tab-index={index}
|
|
53
55
|
>
|
|
54
|
-
{tab.icon ? <img src={tab.icon} alt="" class="tabs__tab-icon" width="20" height="20" /> : null}
|
|
56
|
+
{tab.iconComponent ? <tab.iconComponent width={20} height={20} class="tabs__tab-icon" /> : tab.icon ? <img src={tab.icon} alt="" class="tabs__tab-icon" width="20" height="20" /> : null}
|
|
55
57
|
{tab.label}
|
|
56
58
|
</span>
|
|
57
59
|
);
|
|
@@ -1,10 +1,15 @@
|
|
|
1
1
|
---
|
|
2
|
-
//
|
|
2
|
+
// Tabler Icons - Brush (paint brush, for Semi Light Purple theme)
|
|
3
|
+
// Source: https://tabler.io/icons/icon/brush
|
|
4
|
+
// License: MIT
|
|
5
|
+
|
|
3
6
|
interface Props { width?: number; height?: number; class?: string; }
|
|
4
7
|
const { width = 16, height = 16, class: className = '' } = Astro.props;
|
|
5
8
|
---
|
|
6
9
|
|
|
7
10
|
<svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class={className} aria-hidden="true">
|
|
8
|
-
<path d="
|
|
9
|
-
<path d="
|
|
11
|
+
<path d="M3 21v-4a4 4 0 1 1 4 4h-4" />
|
|
12
|
+
<path d="M21 3a16 16 0 0 0 -12.8 10.2" />
|
|
13
|
+
<path d="M21 3a16 16 0 0 1 -10.2 12.8" />
|
|
14
|
+
<path d="M10.6 9a9 9 0 0 1 4.4 4.4" />
|
|
10
15
|
</svg>
|
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
---
|
|
2
|
-
// Cake
|
|
2
|
+
// Tabler Icons - Cake (for Red Velvet Cupcake theme)
|
|
3
|
+
// Source: https://tabler.io/icons/icon/cake
|
|
4
|
+
// License: MIT
|
|
5
|
+
|
|
3
6
|
interface Props { width?: number; height?: number; class?: string; }
|
|
4
7
|
const { width = 16, height = 16, class: className = '' } = Astro.props;
|
|
5
8
|
---
|
|
6
9
|
|
|
7
10
|
<svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class={className} aria-hidden="true">
|
|
8
|
-
<path d="
|
|
9
|
-
<path d="
|
|
10
|
-
<path d="
|
|
11
|
+
<path d="M3 20h18v-8a3 3 0 0 0 -3 -3h-12a3 3 0 0 0 -3 3v8z" />
|
|
12
|
+
<path d="M3 14.803c.312 .135 .654 .204 1 .197a2.4 2.4 0 0 0 2 -1a2.4 2.4 0 0 1 2 -1a2.4 2.4 0 0 1 2 1a2.4 2.4 0 0 0 2 1a2.4 2.4 0 0 0 2 -1a2.4 2.4 0 0 1 2 -1a2.4 2.4 0 0 1 2 1a2.4 2.4 0 0 0 2 1c.35 .007 .692 -.062 1 -.197" />
|
|
13
|
+
<path d="M12 4l1.465 1.638a2 2 0 1 1 -3.015 .099l1.55 -1.737z" />
|
|
11
14
|
</svg>
|
|
@@ -1,11 +1,16 @@
|
|
|
1
1
|
---
|
|
2
|
-
// Cherry
|
|
2
|
+
// Tabler Icons - Cherry (for Cute Pink theme)
|
|
3
|
+
// Source: https://tabler.io/icons/icon/cherry
|
|
4
|
+
// License: MIT
|
|
5
|
+
|
|
3
6
|
interface Props { width?: number; height?: number; class?: string; }
|
|
4
7
|
const { width = 16, height = 16, class: className = '' } = Astro.props;
|
|
5
8
|
---
|
|
6
9
|
|
|
7
10
|
<svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class={className} aria-hidden="true">
|
|
8
|
-
<path d="
|
|
9
|
-
<path d="
|
|
10
|
-
<path d="
|
|
11
|
+
<path d="M7.5 16.5m-3.5 0a3.5 3.5 0 1 0 7 0a3.5 3.5 0 1 0 -7 0" />
|
|
12
|
+
<path d="M17 18m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" />
|
|
13
|
+
<path d="M9 13c.366 -2 1.866 -3.873 4.5 -5.6" />
|
|
14
|
+
<path d="M17 15c-1.333 -2.333 -2.333 -5.333 -1 -9" />
|
|
15
|
+
<path d="M5 6c3.667 -2.667 7.333 -2.667 11 0c-3.667 2.667 -7.333 2.667 -11 0" />
|
|
11
16
|
</svg>
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
---
|
|
2
|
-
// Flower
|
|
2
|
+
// Tabler Icons - Flower (for Sunflower theme)
|
|
3
|
+
// Source: https://tabler.io/icons/icon/flower
|
|
4
|
+
// License: MIT
|
|
5
|
+
|
|
3
6
|
interface Props { width?: number; height?: number; class?: string; }
|
|
4
7
|
const { width = 16, height = 16, class: className = '' } = Astro.props;
|
|
5
8
|
---
|
|
6
9
|
|
|
7
10
|
<svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class={className} aria-hidden="true">
|
|
8
|
-
<
|
|
9
|
-
<path d="M12
|
|
10
|
-
<path d="M12 5v2M12 17v2M5 12h2M17 12h2" />
|
|
11
|
+
<path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" />
|
|
12
|
+
<path d="M12 2a3 3 0 0 1 3 3c0 .562 -.259 1.442 -.776 2.64l-.724 1.36l1.76 -1.893c.499 -.6 .922 -1 1.27 -1.205a2.968 2.968 0 0 1 4.07 1.099a3.011 3.011 0 0 1 -1.09 4.098c-.374 .217 -.99 .396 -1.846 .535l-2.664 .366l2.4 .326c1 .145 1.698 .337 2.11 .576a3.011 3.011 0 0 1 1.09 4.098a2.968 2.968 0 0 1 -4.07 1.098c-.348 -.202 -.771 -.604 -1.27 -1.205l-1.76 -1.893l.724 1.36c.516 1.199 .776 2.079 .776 2.64a3 3 0 0 1 -6 0c0 -.562 .259 -1.442 .776 -2.64l.724 -1.36l-1.76 1.893c-.499 .601 -.922 1 -1.27 1.205a2.968 2.968 0 0 1 -4.07 -1.098a3.011 3.011 0 0 1 1.09 -4.098c.374 -.218 .99 -.396 1.846 -.536l2.664 -.366l-2.4 -.325c-1 -.145 -1.698 -.337 -2.11 -.576a3.011 3.011 0 0 1 -1.09 -4.099a2.968 2.968 0 0 1 4.07 -1.099c.348 .203 .771 .604 1.27 1.205l1.76 1.894c-1 -2.292 -1.5 -3.625 -1.5 -4a3 3 0 0 1 3 -3z" />
|
|
11
13
|
</svg>
|
|
@@ -1,11 +1,16 @@
|
|
|
1
1
|
---
|
|
2
|
-
// Lemon
|
|
2
|
+
// Tabler Icons - Lemon (citrus, for Orangy One Light theme)
|
|
3
|
+
// Source: https://tabler.io/icons/icon/lemon
|
|
4
|
+
// License: MIT
|
|
5
|
+
|
|
3
6
|
interface Props { width?: number; height?: number; class?: string; }
|
|
4
7
|
const { width = 16, height = 16, class: className = '' } = Astro.props;
|
|
5
8
|
---
|
|
6
9
|
|
|
7
10
|
<svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class={className} aria-hidden="true">
|
|
8
|
-
<path d="
|
|
9
|
-
<path d="
|
|
10
|
-
<path d="
|
|
11
|
+
<path d="M17.536 3.393c3.905 3.906 3.905 10.237 0 14.143c-3.906 3.905 -10.237 3.905 -14.143 0l14.143 -14.143" />
|
|
12
|
+
<path d="M5.868 15.06a6.5 6.5 0 0 0 9.193 -9.192" />
|
|
13
|
+
<path d="M10.464 10.464l4.597 4.597" />
|
|
14
|
+
<path d="M10.464 10.464v6.364" />
|
|
15
|
+
<path d="M10.464 10.464h6.364" />
|
|
11
16
|
</svg>
|
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
---
|
|
2
|
-
// Sunset
|
|
2
|
+
// Tabler Icons - Sunset (for Rocky Blood Orange theme)
|
|
3
|
+
// Source: https://tabler.io/icons/icon/sunset
|
|
4
|
+
// License: MIT
|
|
5
|
+
|
|
3
6
|
interface Props { width?: number; height?: number; class?: string; }
|
|
4
7
|
const { width = 16, height = 16, class: className = '' } = Astro.props;
|
|
5
8
|
---
|
|
6
9
|
|
|
7
10
|
<svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class={className} aria-hidden="true">
|
|
8
|
-
<path d="
|
|
9
|
-
<path d="
|
|
11
|
+
<path d="M3 17h1m16 0h1m-15.4 -6.4l.7 .7m12.1 -.7l-.7 .7m-9.7 5.7a4 4 0 0 1 8 0" />
|
|
12
|
+
<path d="M3 21l18 0" />
|
|
13
|
+
<path d="M12 3v6l3 -3m-6 0l3 3" />
|
|
10
14
|
</svg>
|