Something went wrong. Try again.
Monorepo for Tangled
Something went wrong. Try again.
3.1 kB · 97 lines
CSS
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798/* * the appview's stylesheet, compiled against the docs tailwind * config (see tailwind.config.cjs). this brings in the base layer * (14px root font size, link/code styles, selection color) and the * component classes (.btn, .btn-create, .btn-flat, ...). */@import "../../../input.css";
/* preflight is disabled (starlight has its own reset), but tailwind's * border utilities assume preflight's `border-style: solid` reset */.btn,.hero .sl-link-button,[class*="border-"] { border-style: solid;}
/* logo at the same size as the appview topbar logotype (h-8) */.site-title img { @apply h-8;}
/* markdown content, styled like the appview renders readmes: * plain black/white links, bordered h1/h2, gray inline code *//* like `prose` links in appview readmes: underlined, medium weight. * NB: the card exclusion must not say `.btn` here — tailwind's @apply * of .btn/.btn-create elsewhere clones every rule that mentions .btn * in its selector, re-introducing the underline through the clone */.sl-markdown-content a:not(.feature-card):not(:where(.not-content *)) { @apply text-black underline font-medium hover:text-gray-800 dark:text-white dark:hover:text-gray-300;}
.sl-markdown-content h1:not(:where(.not-content *)) { @apply mt-3 pb-3 border-b border-gray-300 dark:border-gray-600;}
.sl-markdown-content h2:not(:where(.not-content *)) { @apply mt-3 pb-3 border-b border-gray-200 dark:border-gray-700;}
.sl-markdown-content code:not(:where(.not-content *)) { @apply font-mono rounded px-1 bg-gray-100 text-black dark:bg-gray-700 dark:text-white;}
/* the appview's base `label` style (block, py-2, text-sm) clobbers * starlight's select labels — starlight's own styles live in css * cascade layers and lose to the unlayered appview css */starlight-theme-select label,starlight-lang-select label { display: flex; padding: 0; font-size: unset; color: var(--sl-color-gray-1);}
starlight-theme-select label:hover,starlight-lang-select label:hover { color: var(--sl-color-gray-2);}
/* sidebar current-page pill, like the appview settings sidebar tabs */.sidebar-content a[aria-current="page"],.sidebar-content a[aria-current="page"]:hover,.sidebar-content a[aria-current="page"]:focus { @apply bg-gray-100 text-black font-semibold dark:bg-gray-700 dark:text-white;}
/* text links in the top bar (see components/HeaderLinks.astro) */a.header-link,a.header-link:hover { @apply text-sm no-underline text-gray-500 hover:text-black dark:text-gray-400 dark:hover:text-white;}
/* compact next/prev pagination links */.pagination-links a { @apply p-3 gap-2 rounded no-underline hover:no-underline;}
.pagination-links a .link-title { @apply text-base font-semibold;}
.pagination-links a svg { @apply size-5;}
/* restyle starlight's hero buttons with the appview button classes */.hero .sl-link-button.primary { @apply btn-create text-base;}
.hero .sl-link-button.primary:hover { @apply text-white no-underline;}
.hero .sl-link-button.minimal { @apply btn-flat text-base;}