Skip to content

Commit dbe2ca7

Browse files
feat(home): editorial homepage, sticky top nav, and category drill-down
Reframes the home and library-browse surfaces as an editorial review site (Tom's Hardware / Top 10 Reviews vibe) where every block is a teaser into a deeper page rather than a single tall landing. New surfaces - src/components/home/HomeEditorial.tsx: featured Start hero with embedded application starter, top-libraries leaderboard side rail, trust pillars, Trusted-By marquee, live OSS Stats deferred section, four "Top picks by category" cards, latest writing, tiered partners (Gold/Silver/Bronze), Discord + YouTube community pair. - src/components/editorial/EditorialTopNav.tsx: sticky global top nav (eyebrow strip + brand + 11-item primary nav + search + compact 2x3 social cluster + theme + mobile drawer) and a pinned Gold Partners strip with "Sponsored" hover tooltips. - src/components/stack/* + src/routes/stack.\$category.tsx: four buyer's-guide-style category articles (/stack/{state,ui,performance,tooling}) with hero, Top Pick, quick verdict table, ranked list, criteria block, related writing and a sticky right-rail TOC + cross-category compare. Global shell - src/routes/__root.tsx: render EditorialTopNav on every page; non- editorial pages still wrap children with <Navbar hideHeader> so the contextual library left rail is preserved on docs pages. - src/components/Navbar.tsx: add hideHeader prop. When true the global Navbar skips its own fixed top header and lets EditorialTopNav own --navbar-height (published by EditorialTopNav via ResizeObserver). Page opt-ins - /, /stack/\$category, /libraries, /libraries/\$framework, /partners, /blog, /showcase + children, /stats/npm, /merch all set staticData.showNavbar: false to drop the library left rail and use the editorial top-nav-only layout. Data and dev DX - src/utils/partners.tsx: promote Railway from bronze -> gold. - src/utils/documents.server.ts: when DATABASE_URL is unset (dev without Postgres), fall back from getCachedGitHubTextFile to the in-memory fetchCached path so library docs pages render locally without a DB. Notes for reviewers - Removed deferred home sections (HomeSocialProofSection, HomeCommunitySection, HomeBytesSection, standalone HomeApplicationStarter usage) are kept as components -- only their homepage render is gone. - routeTree.gen.ts is regenerated by the build; included for completeness. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
1 parent 231bc91 commit dbe2ca7

21 files changed

Lines changed: 2041 additions & 525 deletions

src/components/Navbar.tsx

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -131,7 +131,13 @@ const MobileCard = ({
131131
</Card>
132132
)
133133

134-
export function Navbar({ children }: { children: React.ReactNode }) {
134+
export function Navbar({
135+
children,
136+
hideHeader = false,
137+
}: {
138+
children: React.ReactNode
139+
hideHeader?: boolean
140+
}) {
135141
const matches = useMatches()
136142

137143
const { Title } = React.useMemo(() => {
@@ -145,6 +151,10 @@ export function Navbar({ children }: { children: React.ReactNode }) {
145151
const containerRef = React.useRef<HTMLDivElement>(null)
146152

147153
React.useEffect(() => {
154+
// When hideHeader is true, the EditorialTopNav owns --navbar-height —
155+
// skip our own measurement so we don't fight it.
156+
if (hideHeader) return
157+
148158
const updateContainerHeight = () => {
149159
if (containerRef.current) {
150160
const height = containerRef.current.offsetHeight
@@ -161,7 +171,7 @@ export function Navbar({ children }: { children: React.ReactNode }) {
161171
return () => {
162172
window.removeEventListener('resize', updateContainerHeight)
163173
}
164-
}, [])
174+
}, [hideHeader])
165175

166176
const [showMenu, setShowMenu] = React.useState(false)
167177
const [canLoadAuthControls, setCanLoadAuthControls] = React.useState(false)
@@ -760,12 +770,14 @@ export function Navbar({ children }: { children: React.ReactNode }) {
760770

761771
return (
762772
<>
763-
{navbar}
773+
{hideHeader ? null : navbar}
764774
<div
765775
className={twMerge(
766776
`min-h-[calc(100dvh-var(--navbar-height))] flex flex-col
767-
min-w-0 md:flex-row w-full transition-all duration-300
768-
pt-[var(--navbar-height)]`,
777+
min-w-0 md:flex-row w-full transition-all duration-300`,
778+
// The fixed navbar (when shown) pushes children down; the editorial
779+
// top nav is sticky/in-flow above, so we don't need extra padding.
780+
hideHeader ? '' : 'pt-[var(--navbar-height)]',
769781
)}
770782
>
771783
{smallMenu}

0 commit comments

Comments
 (0)