cdricms/latosa-escrima
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added theme switcher + optimized youtube loading + about changes

Browse Source
This commit is contained in:
cdricms
2025-01-31 17:28:13 +01:00
parent f7dd0c60d6
commit 90945b161d
8 changed files with 306 additions and 267 deletions
Download Patch File Download Diff File Expand all files Collapse all files

312
frontend/components/nav-bar.tsx
View File

@@ -21,6 +21,7 @@ import {
import Link from "next/link";
import { deleteCookie, getCookie } from "cookies-next";
import { useEffect, useState } from "react";
import { ThemeSwitcher } from "./theme-switcher";
const subMenuItemsOne = [
{
@@ -142,6 +143,7 @@ const Navbar = () => {
</div>
</div>
<div className="flex gap-2 animate-in ease-in-out">
<ThemeSwitcher />
<Button variant="outline">
{cookie ? (
<Link href="/dashboard">Compte</Link>
@@ -175,190 +177,136 @@ const Navbar = () => {
Latosa-Escrima
</span>
</div>
<Sheet>
<SheetTrigger asChild>
<Button variant="outline" size="icon">
<Menu className="size-4" />
</Button>
</SheetTrigger>
<SheetContent className="overflow-y-auto">
<SheetHeader>
<SheetTitle>
<div className="flex items-center gap-2">
<img
src="https://shadcnblocks.com/images/block/block-1.svg"
className="w-8"
alt="logo"
/>
<span className="text-xl font-bold">
Latosa-Escrima
</span>
<div className="flex gap-2">
<ThemeSwitcher />
<Sheet>
<SheetTrigger asChild>
<Button variant="outline" size="icon">
<Menu className="size-4" />
</Button>
</SheetTrigger>
<SheetContent className="overflow-y-auto">
<SheetHeader>
<SheetTitle>
<div className="flex items-center gap-2">
<img
src="https://shadcnblocks.com/images/block/block-1.svg"
className="w-8"
alt="logo"
/>
<span className="text-xl font-bold">
Latosa-Escrima
</span>
</div>
</SheetTitle>
</SheetHeader>
<div className="mb-8 mt-8 flex flex-col gap-4">
<Link
href="/"
className="font-semibold"
>
Accueil
</Link>
<Link
href="/planning"
className="font-semibold"
>
Planning
</Link>
<Link
href="/about"
className="font-semibold"
>
À propos
</Link>
<Link
href="/blog"
className="font-semibold"
>
Blog
</Link>
</div>
<div className="border-t pt-4">
<div className="grid grid-cols-2 justify-start">
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Press
</a>
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Contact
</a>
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Imprint
</a>
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Sitemap
</a>
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Legal
</a>
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Cookie Settings
</a>
</div>
<div className="mt-2 flex flex-col gap-3">
<Button variant="outline">
<Link href="/login">
Se connecter
</Link>
</Button>
<Button>Sign up</Button>
</div>
</SheetTitle>
</SheetHeader>
<div className="mb-8 mt-8 flex flex-col gap-4">
<Link href="/" className="font-semibold">
Accueil
</Link>
<Accordion
type="single"
collapsible
className="w-full"
>
<AccordionItem
value="products"
className="border-b-0"
>
<AccordionTrigger className="mb-4 py-0 font-semibold hover:no-underline">
Products
</AccordionTrigger>
<AccordionContent className="mt-2">
{subMenuItemsOne.map(
(item, idx) => (
<a
key={idx}
className={cn(
"flex select-none gap-4 rounded-md p-3 leading-none outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
)}
href="#"
>
{item.icon}
<div>
<div className="text-sm font-semibold">
{item.title}
</div>
<p className="text-sm leading-snug text-muted-foreground">
{
item.description
}
</p>
</div>
</a>
),
)}
</AccordionContent>
</AccordionItem>
<AccordionItem
value="resources"
className="border-b-0"
>
<AccordionTrigger className="py-0 font-semibold hover:no-underline">
Resources
</AccordionTrigger>
<AccordionContent className="mt-2">
{subMenuItemsTwo.map(
(item, idx) => (
<a
key={idx}
className={cn(
"flex select-none gap-4 rounded-md p-3 leading-none outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
)}
href="#"
>
{item.icon}
<div>
<div className="text-sm font-semibold">
{item.title}
</div>
<p className="text-sm leading-snug text-muted-foreground">
{
item.description
}
</p>
</div>
</a>
),
)}
</AccordionContent>
</AccordionItem>
</Accordion>
<a href="#" className="font-semibold">
Pricing
</a>
<a href="#" className="font-semibold">
Blog
</a>
</div>
<div className="border-t pt-4">
<div className="grid grid-cols-2 justify-start">
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Press
</a>
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Contact
</a>
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Imprint
</a>
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Sitemap
</a>
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Legal
</a>
<a
className={cn(
buttonVariants({
variant: "ghost",
}),
"justify-start text-muted-foreground",
)}
href="#"
>
Cookie Settings
</a>
</div>
<div className="mt-2 flex flex-col gap-3">
<Button variant="outline">
<Link href="/login">
Se connecter
</Link>
</Button>
<Button>Sign up</Button>
</div>
</div>
</SheetContent>
</Sheet>
</SheetContent>
</Sheet>
</div>
</div>
</div>
</div>