make pages more consistent on mobile
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m3s

This commit is contained in:
Lee
2024-04-19 21:53:11 +01:00
parent 95fef83dcf
commit 78390a3bc9
4 changed files with 35 additions and 30 deletions

View File

@ -7,6 +7,7 @@ import { HrefButton } from "./href-button";
import Logo from "./logo";
import { ToggleThemeButton } from "./theme-toggle-button";
import { GithubStar } from "@/app/components/github-star";
import { Card } from "@/app/components/card";
type Page = {
/**
@ -37,7 +38,10 @@ export default function NavBar(): ReactElement {
const path = usePathname();
return (
<div className="bg-secondary relative w-full rounded-lg flex justify-between items-center gap-3 mt-2 px-3 bg-opacity-85 h-12">
<Card
classNameCard="w-full p-0 mt-2 border-none"
classNameContent="p-0 relative rounded-lg flex justify-between items-center gap-3 px-3 bg-opacity-85 h-12"
>
{/* Left */}
<div className="z-50">
<Link href="/" className="flex items-center gap-2">
@ -70,6 +74,6 @@ export default function NavBar(): ReactElement {
<ToggleThemeButton />
<GithubStar />
</div>
</div>
</Card>
);
}