github-such-software/xmrcheckout
1
0
Fork 0
mirror of https://github.com/Such-Software/xmrcheckout.git synced 2026-10-17 05:51:34 +02:00
Code Issues Packages Projects Releases Wiki Activity

ui: highlight active nav item

Browse Source
This commit is contained in:
xmrcheckout
2026-01-30 16:52:36 +00:00
parent a19b3566a6
commit 655d037c49
4 changed files with 76 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/app/(app)/layout.tsx
+5 -4
View File
@@ -4,6 +4,7 @@ import { Suspense } from "react";
import "../(marketing)/marketing.css";
import DonateModal from "../../components/donate-modal";
import NavLink from "../../components/nav-link";
import { logoutAction } from "./dashboard/actions";
export default function AppLayout({
@@ -30,10 +31,10 @@ export default function AppLayout({
</Link>
</div>
<nav className="nav">
<Link href="/invoice">Check Invoice</Link>
<Link href="/docs">Documentation</Link>
<Link href="/faq">FAQ</Link>
<Link href="/dashboard">Dashboard</Link>
<NavLink href="/invoice">Check Invoice</NavLink>
<NavLink href="/docs">Documentation</NavLink>
<NavLink href="/faq">FAQ</NavLink>
<NavLink href="/dashboard">Dashboard</NavLink>
<form action={logoutAction}>
<button type="submit">Log out</button>
</form>
ui/app/(marketing)/layout.tsx
+6 -5
View File
@@ -6,6 +6,7 @@ import { cookies } from "next/headers";
import "./marketing.css";
import DonateModal from "../../components/donate-modal";
import LoginModal, { LoginTrigger } from "../../components/login-modal";
import NavLink from "../../components/nav-link";
import { logoutAction } from "../(app)/dashboard/actions";
export default async function MarketingLayout({
@@ -42,13 +43,13 @@ export default async function MarketingLayout({
</Link>
</div>
<nav className="nav">
<Link href="/invoice">Check Invoice</Link>
<Link href="/tour">Tour</Link>
<Link href="/docs">Documentation</Link>
<Link href="/faq">FAQ</Link>
<NavLink href="/invoice">Check Invoice</NavLink>
<NavLink href="/tour">Tour</NavLink>
<NavLink href="/docs">Documentation</NavLink>
<NavLink href="/faq">FAQ</NavLink>
{isAuthenticated ? (
<>
<Link href="/dashboard">Dashboard</Link>
<NavLink href="/dashboard">Dashboard</NavLink>
<form action={logoutAction}>
<button type="submit">Log out</button>
</form>
ui/app/(marketing)/marketing.css
+18
View File
@@ -266,6 +266,24 @@ a {
opacity: 1;
}
.nav a[aria-current="page"] {
opacity: 1;
font-weight: 600;
position: relative;
}
.nav a[aria-current="page"]::after {
content: "";
position: absolute;
left: -0.15rem;
right: -0.15rem;
bottom: -0.35rem;
height: 0.2rem;
border-radius: 999px;
background: linear-gradient(90deg, var(--clay), var(--sage));
opacity: 0.65;
}
.hero {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));