feat(nav): site-aware layout and navigation refinements

- Extract shared SubdomainNavList used by both subdomain bars
- Add branded Typewriter header to MainLeftBarContent
- Update BACK_TO_FRENO label to 'back to freno.me'
This commit is contained in:
2026-07-23 11:14:58 -04:00
parent 650b216dbc
commit d42cfc106b
2 changed files with 22 additions and 15 deletions

View File

@@ -205,8 +205,14 @@ function SubdomainNavLink(props: { item: NavItem; onClick: () => void }) {
/** The shared simplified nav list rendered by both subdomain bars. */ /** The shared simplified nav list rendered by both subdomain bars. */
function SubdomainNavList(props: { onClick: () => void }) { function SubdomainNavList(props: { onClick: () => void }) {
const site = useSite(); const site = useSite();
// Auth items intentionally omitted — subdomains don't use the web (freno.me)
// JWT auth (Nessa uses Clerk; Lineage uses its mobile JWT), so no subdomain
// nav item sets showLoggedIn/showLoggedOut today. filterNavByAuth is therefore
// a no-op right now but is kept so future admin items behave correctly
// without re-touching the renderer. Filtering here keeps LeftBar + RightBar
// consistent.
return ( return (
<For each={NAV_CONFIG[site().id]}> <For each={filterNavByAuth(NAV_CONFIG[site().id], false)}>
{(item) => <SubdomainNavLink item={item} onClick={props.onClick} />} {(item) => <SubdomainNavLink item={item} onClick={props.onClick} />}
</For> </For>
); );
@@ -244,7 +250,6 @@ function BackToFrenoLink() {
/** Inner content for the LeftBar on subdomain sites. */ /** Inner content for the LeftBar on subdomain sites. */
function SubdomainLeftBarContent() { function SubdomainLeftBarContent() {
const { setLeftBarVisible } = useBars(); const { setLeftBarVisible } = useBars();
const site = useSite();
const handleLinkClick = () => { const handleLinkClick = () => {
if ( if (
typeof window !== "undefined" && typeof window !== "undefined" &&
@@ -257,15 +262,8 @@ function SubdomainLeftBarContent() {
<div class="text-text flex h-full flex-col px-4 pb-4 text-xl font-bold"> <div class="text-text flex h-full flex-col px-4 pb-4 text-xl font-bold">
<SubdomainBrand /> <SubdomainBrand />
<div class="flex flex-col gap-4 py-8"> <div class="flex flex-col gap-4 py-8">
{/* Auth items intentionally omitted — subdomains don't use web auth. {/* Auth items intentionally omitted — see SubdomainNavList. */}
filterNavByAuth is a no-op today (no subdomain item sets <SubdomainNavList onClick={handleLinkClick} />
showLoggedIn/showLoggedOut) but kept so future admin items
behave correctly without re-touching the renderer. */}
<For each={filterNavByAuth(NAV_CONFIG[site().id], false)}>
{(item) => (
<SubdomainNavLink item={item} onClick={handleLinkClick} />
)}
</For>
</div> </div>
<div class="mt-auto flex flex-col gap-4"> <div class="mt-auto flex flex-col gap-4">
@@ -569,6 +567,14 @@ function MainLeftBarContent() {
const navigate = useNavigate(); const navigate = useNavigate();
return ( return (
<>
<Typewriter speed={10} keepAlive={10000} class="z-50 pr-8 pl-4">
<h3 class="hover:text-subtext0 w-fit pt-6 text-center text-3xl underline transition-transform duration-200 ease-in-out hover:-translate-y-0.5 hover:scale-105">
<a href="/" onClick={handleLinkClick}>
{formatDomainName(env.VITE_DOMAIN)}
</a>
</h3>
</Typewriter>
<div class="text-text flex flex-1 flex-col px-4 pb-4 text-xl font-bold"> <div class="text-text flex flex-1 flex-col px-4 pb-4 text-xl font-bold">
<div class="flex flex-col py-8"> <div class="flex flex-col py-8">
<span class="text-lg font-semibold">Recent Posts</span> <span class="text-lg font-semibold">Recent Posts</span>
@@ -736,6 +742,7 @@ function MainLeftBarContent() {
</div> </div>
</div> </div>
</div> </div>
</>
); );
} }

View File

@@ -56,7 +56,7 @@ export interface NavItem {
/** Apex/host link used as a "back to freno.me" affordance on subdomains. */ /** Apex/host link used as a "back to freno.me" affordance on subdomains. */
export const BACK_TO_FRENO: NavItem = { export const BACK_TO_FRENO: NavItem = {
label: "freno.me", label: "back to freno.me",
href: "https://freno.me", href: "https://freno.me",
icon: "back", icon: "back",
external: true external: true