Something went wrong. Try again.
Monorepo for Tangled
Something went wrong. Try again.
CSS
at icy/rolrvz
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687@import "@fontsource-variable/inter";@import "@fontsource/ibm-plex-mono/400.css";@import "@fontsource/ibm-plex-mono/600.css";
/* * starlight theme mapped onto the appview's palette (tailwind grays, * slate-100/gray-900 body, monochrome accents). fonts prefer the * appview's self-hosted files (/static/fonts, present in the nix * build) and fall back to the fontsource copies in dev. */:root { --sl-font: "InterVariable", "Inter Variable", system-ui, sans-serif; --sl-font-mono: "IBMPlexMono", "IBM Plex Mono", monospace;
/* the appview topbar sits directly on the body background */ --sl-color-bg-nav: var(--sl-color-black); --sl-color-bg-sidebar: var(--sl-color-black);
/* dark — appview dark mode: bg-gray-900, white text */ --sl-color-white: #ffffff; --sl-color-gray-1: #f3f4f6; /* gray-100 */ --sl-color-gray-2: #d1d5db; /* gray-300 */ --sl-color-gray-3: #9ca3af; /* gray-400 */ --sl-color-gray-4: #4b5563; /* gray-600 */ --sl-color-gray-5: #374151; /* gray-700 */ --sl-color-gray-6: #1f2937; /* gray-800 */ --sl-color-black: #111827; /* gray-900 */
--sl-color-accent-low: #374151; /* gray-700 */ --sl-color-accent: #6b7280; /* gray-500 */ --sl-color-accent-high: #d1d5db; /* gray-300 */}
:root[data-theme="light"] { /* light — white surfaces, black text */ --sl-color-white: #000000; --sl-color-gray-1: #1f2937; /* gray-800 */ --sl-color-gray-2: #374151; /* gray-700 */ --sl-color-gray-3: #6b7280; /* gray-500 */ --sl-color-gray-4: #9ca3af; /* gray-400 */ --sl-color-gray-5: #d1d5db; /* gray-300 */ --sl-color-gray-6: #f3f4f6; /* gray-100 */ --sl-color-gray-7: #f9fafb; /* gray-50 */ --sl-color-black: #ffffff;
--sl-color-accent-low: #e5e7eb; /* gray-200 */ --sl-color-accent: #4b5563; /* gray-600 */ --sl-color-accent-high: #111827; /* gray-900 */}
/* landing page */.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: 1rem; margin-top: 2rem;}
.landing-section { max-width: 46rem; margin-top: 2rem;}
/* hero tweaks for the landing page */[data-has-hero] .hero { padding-block: 3rem;}
/* ascii dolly in the hero (see scripts/gen-ascii-dolly.mjs) */.ascii-dolly { font-family: var(--sl-font-mono); font-size: 0.55rem; line-height: 1.2; color: var(--sl-color-white); background: none; border: none; padding: 0; margin: 0; overflow: hidden; user-select: none;}
[data-has-hero] .hero h1 { font-size: clamp(2rem, 5vw, 3.25rem); letter-spacing: -0.02em;}