diff --git a/astro.config.ts b/astro.config.ts index 8f1b5bb02..124fcaffc 100644 --- a/astro.config.ts +++ b/astro.config.ts @@ -208,6 +208,7 @@ export default defineConfig({ alias: [ { find: "@components", replacement: new URL("./src/components", import.meta.url).pathname }, { find: "@constants", replacement: new URL("./src/constants.ts", import.meta.url).pathname }, + { find: "@lib", replacement: new URL("./src/lib", import.meta.url).pathname }, // Resolve scripts subpath to the package so ThemeSelect.astro / SDKSelect.astro keep working. { find: "@stainless-api/docs/components/scripts", diff --git a/src/components/Header.astro b/src/components/Header.astro index 07f2e1619..2e2f6ce35 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -17,6 +17,7 @@ import SiteTitle from "virtual:starlight/components/SiteTitle"; import ThemeSelect from "virtual:starlight/components/ThemeSelect"; import { HEADER_LINKS, TABS } from "virtual:stl-docs-virtual-module"; import { Button } from "@stainless-api/ui-primitives"; +import { bannerConfig } from "@lib/banner-config"; import MobileNavTabLinks from "./MobileNavTabLinks.astro"; import NavTabsWithDropdown from "./NavTabsWithDropdown.astro"; import SplashMobileMenuToggle from "./SplashMobileMenuToggle.astro"; @@ -33,6 +34,8 @@ const { hasSidebar } = Astro.locals.starlightRoute; const showMobileTabStrip = TABS.length > 0; --- +{bannerConfig.enabled &&
} +
Tiger Data Aggregate 2026 for workshops, talks, and networking.', +}; diff --git a/src/styles/header.css b/src/styles/header.css index 9a238070f..cd1ae82fa 100644 --- a/src/styles/header.css +++ b/src/styles/header.css @@ -154,3 +154,80 @@ main .sl-anchor-link svg, white-space: nowrap; border: 0; } + +/* ---- Sitewide Banner ---- */ + +.sl-banner { + position: fixed !important; + top: 0 !important; + left: 0 !important; + right: 0 !important; + z-index: 200 !important; + width: 100vw !important; + max-width: none !important; + min-width: 100vw !important; + padding: 0.75rem var(--tiger-content-inset) !important; + background-color: var(--tiger-electric-yellow) !important; + color: var(--tiger-black) !important; + text-align: center !important; + line-height: 1.5 !important; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important; + border: none !important; + margin: 0 !important; + margin-inline: 0 !important; +} + +.sl-banner a { + color: var(--tiger-black); + text-decoration: underline; +} + +.sl-banner a:hover { + opacity: 0.7; +} + +.sl-banner strong { + font-weight: 600; +} + +/* Adjust page and header to account for fixed banner - only when banner exists */ +/* Desktop: banner is 48px + nav header ~56px = 104px total scroll padding */ +body:has(.sl-banner) { + padding-top: 48px; + scroll-padding-top: 104px; +} + +body:has(.sl-banner) .right-sidebar-panel { + top: 104px !important; +} + +body:has(.sl-banner) header, +body:has(.sl-banner) .stl-header { + position: sticky !important; + top: 48px !important; + z-index: 100 !important; + background-color: light-dark(#ffffff, #1a1a1a) !important; +} + +/* Mobile: banner is 70px + nav header ~64px = 134px total scroll padding */ +@media (max-width: 768px) { + .sl-banner { + padding: 0.75rem var(--tiger-space-lg); + font-size: 0.9rem; + } + + body:has(.sl-banner) { + padding-top: 70px; + scroll-padding-top: 134px; + } + + body:has(.sl-banner) header, + body:has(.sl-banner) .stl-header { + top: 70px !important; + background-color: light-dark(#ffffff, #1a1a1a) !important; + } + + body:has(.sl-banner) .right-sidebar-panel { + top: 134px !important; + } +}