fix: ui fixes minor

This commit is contained in:
gosangam
2026-06-02 23:14:34 +05:30
parent c89cc8b779
commit 0bcda5a791
5 changed files with 40 additions and 60 deletions
+2
View File
@@ -2,6 +2,7 @@ import { Suspense } from "react";
import { SiteHeader } from "@/components/site-header";
import { SiteSidebar } from "@/components/site-sidebar";
import { SiteBottomNav } from "@/components/site-bottom-nav";
import { SiteFooter } from "@/components/site-footer";
import { VerifyEmailBanner } from "@/components/auth/verify-email-banner";
import { TextSelectionToolbar } from "@/components/text-selection-toolbar";
import { TextHighlighter } from "@/components/text-highlighter";
@@ -28,6 +29,7 @@ export default function AppLayout({
<div className="flex-1 flex flex-col md:pl-16 pb-16 md:pb-0">
<SiteHeader />
{children}
<SiteFooter />
</div>
<SiteBottomNav />
<TextSelectionToolbar />
+1 -8
View File
@@ -1,7 +1,7 @@
"use client";
import Link from "next/link";
import { Compass, LogIn, MessageSquare, Sparkles } from "lucide-react";
import { Compass, LogIn, Sparkles } from "lucide-react";
import { useAuth } from "@/components/auth/auth-provider";
/**
@@ -79,13 +79,6 @@ export default function HomePage() {
</p>
) : null}
<Link
href="/feedback"
className="mt-8 inline-flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground underline-offset-4 hover:underline"
>
<MessageSquare className="size-3.5" />
Send feedback
</Link>
</div>
</main>
);
+18 -11
View File
@@ -92,18 +92,25 @@ function SignOutSection() {
}
}
// Renders as a full-width clickable row matching LegalLink — same
// padding, same hover, with LogOut taking the slot ChevronRight uses
// on link rows. The whole row is the click target.
return (
<section className="pt-4">
<button
type="button"
onClick={onSignOut}
disabled={busy}
className="inline-flex items-center gap-2 rounded-md border border-destructive/30 bg-destructive/5 px-4 py-2.5 text-base font-medium text-destructive hover:bg-destructive/10 transition-colors disabled:opacity-60"
>
<LogOut className="size-5" />
{busy ? "Signing out…" : "Sign out"}
</button>
</section>
<ul className="divide-y divide-border">
<li>
<button
type="button"
onClick={onSignOut}
disabled={busy}
className="w-full flex items-center justify-between py-3.5 group disabled:opacity-60"
>
<span className="text-base text-foreground group-hover:text-primary transition-colors">
{busy ? "Signing out…" : "Sign out from this device"}
</span>
<LogOut className="size-5 text-muted-foreground group-hover:text-foreground transition-colors" />
</button>
</li>
</ul>
);
}
+6 -3
View File
@@ -1,10 +1,12 @@
import { SiteHeader } from "@/components/site-header";
import { SiteFooter } from "@/components/site-footer";
/**
* Minimal layout for legal / informational pages (Privacy Policy, Terms of
* Use, Data Deletion). Just the global SiteHeader and the content — no
* sidebar, no bottom nav, no in-page reading affordances. Keeps these
* pages focused on the text they exist to deliver.
* Use, Data Deletion). Just the global SiteHeader, the content, and the
* site-wide feedback footer — no sidebar, no bottom nav, no in-page
* reading affordances. Keeps these pages focused on the text they exist
* to deliver.
*/
export default function LegalLayout({
children,
@@ -15,6 +17,7 @@ export default function LegalLayout({
<div className="flex-1 flex flex-col">
<SiteHeader />
{children}
<SiteFooter />
</div>
);
}
+13 -38
View File
@@ -1,52 +1,27 @@
/**
* SiteFooter — one slim row. Wordmark on the left, dedication on the
* right, About link in the middle. That's all.
* SiteFooter — a single slim row carrying the feedback link. Mounted in
* both (app) and (legal) layouts so the affordance follows the user
* everywhere on the site without taking up perceptible vertical space.
*
* No wordmark, no about / privacy / terms links, no dedication line —
* those live in settings and the legal pages themselves. This footer
* exists solely to keep "send us feedback" one tap away from anywhere.
*/
import Link from "next/link";
import { MessageSquare } from "lucide-react";
export function SiteFooter() {
return (
<footer className="mt-auto border-t border-border bg-secondary text-secondary-foreground">
<div className="max-w-5xl mx-auto px-4 sm:px-6 py-4 flex flex-col sm:flex-row items-center justify-between gap-2 text-xs text-muted-foreground">
<div className="max-w-5xl mx-auto px-4 sm:px-6 py-3 flex items-center justify-center">
<Link
href="/"
aria-label="Prabhupāda Says — home"
className="font-[family-name:var(--font-title)] font-semibold uppercase tracking-[0.12em] text-[0.7rem] text-foreground/80 hover:text-foreground transition-colors"
href="/feedback"
className="inline-flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground underline-offset-4 hover:underline transition-colors"
>
Prabhupāda Says
<MessageSquare className="size-3.5" />
Send feedback
</Link>
<div className="flex flex-wrap items-center justify-center gap-x-3 gap-y-1">
<Link
href="/about"
className="hover:text-foreground transition-colors"
>
About
</Link>
<span aria-hidden>·</span>
<Link
href="/privacy"
className="hover:text-foreground transition-colors"
>
Privacy
</Link>
<span aria-hidden>·</span>
<Link
href="/terms"
className="hover:text-foreground transition-colors"
>
Terms
</Link>
<span aria-hidden>·</span>
<Link
href="/data-deletion"
className="hover:text-foreground transition-colors"
>
Data Deletion
</Link>
<span aria-hidden>·</span>
<span>All glories to Śrīla Prabhupāda</span>
</div>
</div>
</footer>
);