fixing features conflicts

latosa-frontend/app/contact/page.tsx

@@ -0,0 +1,5 @@
+import Contact from "@/components/contact";
+
+export default function ContactPage() {
+	return <Contact />;
+}

latosa-frontend/app/layout.tsx

@@ -2,6 +2,7 @@ import type { Metadata } from "next";
 import { Geist, Geist_Mono } from "next/font/google";
 import "./globals.css";
 import Navbar from "@/components/nav-bar";
+import Footer from "@/components/footer";
 
 const geistSans = Geist({
 	variable: "--font-geist-sans",
@@ -30,6 +31,7 @@ export default function RootLayout({
 			>
 				<Navbar />
 				{children}
+				<Footer />
 			</body>
 		</html>
 	);

latosa-frontend/app/login/page.tsx

@@ -0,0 +1,24 @@
+import { GalleryVerticalEnd } from "lucide-react";
+
+import { LoginForm } from "@/components/login-form";
+
+export default function LoginPage() {
+	return (
+		<div className="grid min-h-svh lg:grid-cols-2">
+			<div className="flex flex-col gap-4 p-6 md:p-10">
+				<div className="flex flex-1 items-center justify-center">
+					<div className="w-full max-w-xs">
+						<LoginForm />
+					</div>
+				</div>
+			</div>
+			<div className="relative hidden bg-muted lg:block">
+				<img
+					src="/placeholder.svg"
+					alt="Image"
+					className="absolute inset-0 h-full w-full object-cover dark:brightness-[0.2] dark:grayscale"
+				/>
+			</div>
+		</div>
+	);
+}

latosa-frontend/app/page.tsx

@@ -1,8 +1,10 @@
+"use server";
+
 import Features, { FeatureItem } from "@/components/features";
 import Gallery6 from "@/components/gallery";
 import Hero from "@/components/hero";
 
-export default function Home() {
+export default async function Home() {
 	return (
 		<main>
 			<Hero />

latosa-frontend/components/contact.tsx

@@ -0,0 +1,91 @@
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+
+const Contact = () => {
+	return (
+		<section className="py-32">
+			<div className="p-4">
+				<div className="mx-auto flex max-w-screen-xl flex-col justify-between gap-10 lg:flex-row lg:gap-20">
+					<div className="self-center max-w-lg flex flex-col justify-between gap-10">
+						<div className="text-center lg:text-left">
+							<h1 className="mb-2 text-5xl font-semibold lg:mb-1 lg:text-6xl">
+								Contactez-nous !
+							</h1>
+							<p className="text-muted-foreground">
+								Nous nous rendons disponible pour répondre à
+								toutes vos questions.
+							</p>
+						</div>
+						<div className="mx-auto w-fit lg:mx-0">
+							<h3 className="mb-6 text-center text-2xl font-semibold lg:text-left">
+								Informations de contact
+							</h3>
+							<ul className="ml-4 list-disc">
+								<li>
+									<span className="font-bold">
+										Téléphone:{" "}
+									</span>
+									(123) 34567890
+								</li>
+								<li>
+									<span className="font-bold">Email: </span>
+									<a href="" className="underline">
+										nicolas.goruk@orange.fr
+									</a>
+								</li>
+							</ul>
+						</div>
+					</div>
+					<div className="mx-auto flex max-w-screen-md flex-col gap-6 rounded-lg border p-10">
+						<div className="flex gap-4">
+							<div className="grid w-full items-center gap-1.5">
+								<Label htmlFor="firstname">Prénom</Label>
+								<Input
+									type="text"
+									id="firstname"
+									placeholder="Prénom"
+								/>
+							</div>
+							<div className="grid w-full items-center gap-1.5">
+								<Label htmlFor="lastname">Nom de famille</Label>
+								<Input
+									type="text"
+									id="lastname"
+									placeholder="Nom de famille"
+								/>
+							</div>
+						</div>
+						<div className="grid w-full items-center gap-1.5">
+							<Label htmlFor="email">Email</Label>
+							<Input
+								type="email"
+								id="email"
+								placeholder="Email"
+							/>
+						</div>
+						<div className="grid w-full items-center gap-1.5">
+							<Label htmlFor="subject">Objet</Label>
+							<Input
+								type="text"
+								id="subject"
+								placeholder="Objet"
+							/>
+						</div>
+						<div className="grid w-full gap-1.5">
+							<Label htmlFor="message">Message</Label>
+							<Textarea
+								placeholder="Écrivez votre message ici."
+								id="message"
+							/>
+						</div>
+						<Button className="w-full">Envoyer</Button>
+					</div>
+				</div>
+			</div>
+		</section>
+	);
+};
+
+export default Contact;

latosa-frontend/components/footer.tsx

@@ -0,0 +1,118 @@
+import {
+	FaFacebook,
+	FaInstagram,
+	FaLinkedin,
+	FaTwitter,
+	FaYoutube,
+} from "react-icons/fa";
+
+const sections = [
+	{
+		title: "Product",
+		links: [
+			{ name: "Overview", href: "#" },
+			{ name: "Pricing", href: "#" },
+			{ name: "Marketplace", href: "#" },
+			{ name: "Features", href: "#" },
+		],
+	},
+	{
+		title: "Company",
+		links: [
+			{ name: "About", href: "#" },
+			{ name: "Team", href: "#" },
+			{ name: "Blog", href: "#" },
+			{ name: "Careers", href: "#" },
+		],
+	},
+	{
+		title: "Resources",
+		links: [
+			{ name: "Help", href: "#" },
+			{ name: "Sales", href: "#" },
+			{ name: "Advertise", href: "#" },
+			{ name: "Privacy", href: "#" },
+		],
+	},
+];
+
+const Footer = () => {
+	return (
+		<section className="p-16">
+			<div className="">
+				<footer>
+					<div className="flex flex-col items-center justify-between gap-10 text-center lg:flex-row lg:text-left">
+						<div className="flex w-full max-w-96 shrink flex-col items-center justify-between gap-6 lg:items-start">
+							<div>
+								<span className="flex items-center justify-center gap-4 lg:justify-start">
+									<img
+										src="https://shadcnblocks.com/images/block/block-1.svg"
+										alt="logo"
+										className="h-11"
+									/>
+									<p className="text-3xl font-semibold">
+										Latosa-Escrima
+									</p>
+								</span>
+								<p className="mt-6 text-sm text-muted-foreground">
+									A collection of 100+ responsive HTML
+									templates for your startup business or side
+									project.
+								</p>
+							</div>
+							<ul className="flex items-center space-x-6 text-muted-foreground">
+								<li className="font-medium hover:text-primary">
+									<a href="https://www.facebook.com/wingtsun.picardie">
+										<FaFacebook className="size-6" />
+									</a>
+								</li>
+								<li className="font-medium hover:text-primary">
+									<a href="https://www.youtube.com/@WingTsunPicardie">
+										<FaYoutube className="size-6" />
+									</a>
+								</li>
+							</ul>
+						</div>
+						<div className="grid grid-cols-3 gap-6 lg:gap-20">
+							{sections.map((section, sectionIdx) => (
+								<div key={sectionIdx}>
+									<h3 className="mb-6 font-bold">
+										{section.title}
+									</h3>
+									<ul className="space-y-4 text-sm text-muted-foreground">
+										{section.links.map((link, linkIdx) => (
+											<li
+												key={linkIdx}
+												className="font-medium hover:text-primary"
+											>
+												<a href={link.href}>
+													{link.name}
+												</a>
+											</li>
+										))}
+									</ul>
+								</div>
+							))}
+						</div>
+					</div>
+					<div className="mt-20 flex flex-col justify-between gap-4 border-t pt-8 text-center text-sm font-medium text-muted-foreground lg:flex-row lg:items-center lg:text-left">
+						<p>
+							© {new Date(Date.now()).getFullYear()}{" "}
+							Latosa-Escrima. Tous droits réservés.
+						</p>
+						<ul className="flex justify-center gap-4 lg:justify-start">
+							<li className="hover:text-primary">
+								<a href="#"> Terms and Conditions</a>
+							</li>
+							<li className="hover:text-primary">
+								<a href="#"> Privacy Policy</a>
+							</li>
+						</ul>
+					</div>
+				</footer>
+			</div>
+		</section>
+	);
+};
+
+export default Footer;

latosa-frontend/components/hero.tsx

@@ -4,13 +4,11 @@ import { cn } from "@/lib/utils";
 
 import { Badge } from "@/components/ui/badge";
 import { Button, buttonVariants } from "@/components/ui/button";
+import Link from "next/link";
 
 const Hero = () => {
 	return (
-		<section
+		<section className="flex h-[calc(100vh-68px)] justify-center items-center relative overflow-hidden py-32">
-			style={{ height: "calc(100vh - 68px)" }}
-			className="flex justify-center items-center relative overflow-hidden py-32"
-		>
 			<div className="">
 				<div className="bg-blue-50 magicpattern absolute inset-x-0 top-0 -z-10 flex h-full w-full items-center justify-center opacity-100" />
 				<div className="mx-auto flex max-w-5xl flex-col items-center">
@@ -30,7 +28,9 @@ const Hero = () => {
 							</p>
 						</div>
 						<div className="mt-4 flex justify-center gap-2">
-							<Button>Nous contacter</Button>
+							<Button>
+								<Link href="/contact">Nous contacter</Link>
+							</Button>
 							<Button variant="outline">
 								À propos
 								<ExternalLink className="ml-2 h-4" />

latosa-frontend/components/login-form.tsx

@@ -0,0 +1,68 @@
+import { cn } from "@/lib/utils";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+
+export function LoginForm({
+	className,
+	...props
+}: React.ComponentPropsWithoutRef<"form">) {
+	return (
+		<form className={cn("flex flex-col gap-6", className)} {...props}>
+			<div className="flex flex-col items-center gap-2 text-center">
+				<h1 className="text-2xl font-bold">
+					Connectez-vous à votre compte.
+				</h1>
+				<p className="text-balance text-sm text-muted-foreground">
+					Entrez votre adresse e-mail pour vous connecter
+				</p>
+			</div>
+			<div className="grid gap-6">
+				<div className="grid gap-2">
+					<Label htmlFor="email">E-Mail</Label>
+					<Input
+						id="email"
+						type="email"
+						placeholder="m@example.com"
+						required
+					/>
+				</div>
+				<div className="grid gap-2">
+					<div className="flex items-center">
+						<Label htmlFor="password">Mot de passe</Label>
+						<a
+							href="#"
+							className="ml-auto text-sm underline-offset-4 hover:underline"
+						>
+							Forgot your password?
+						</a>
+					</div>
+					<Input id="password" type="password" required />
+				</div>
+				<Button type="submit" className="w-full">
+					Se connecter
+				</Button>
+				<div className="relative text-center text-sm after:absolute after:inset-0 after:top-1/2 after:z-0 after:flex after:items-center after:border-t after:border-border">
+					<span className="relative z-10 bg-background px-2 text-muted-foreground">
+						Ou connectez-vous avec
+					</span>
+				</div>
+				<Button variant="outline" className="w-full">
+					<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+						<path
+							d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"
+							fill="currentColor"
+						/>
+					</svg>
+					Login with GitHub
+				</Button>
+			</div>
+			<div className="text-center text-sm">
+				Pas de compte ?{" "}
+				<a href="#" className="underline underline-offset-4">
+					Créer un compte
+				</a>
+			</div>
+		</form>
+	);
+}

latosa-frontend/components/nav-bar.tsx

@@ -25,6 +25,7 @@ import {
 	SheetTitle,
 	SheetTrigger,
 } from "@/components/ui/sheet";
+import Link from "next/link";
 
 const subMenuItemsOne = [
 	{
@@ -75,7 +76,7 @@ const subMenuItemsTwo = [
 
 const Navbar = () => {
 	return (
-		<section className="p-4">
+		<section className="p-4 top-0 sticky bg-white z-[100]">
 			<div className="">
 				<nav className="hidden justify-between lg:flex">
 					<div className="flex items-center gap-6">
@@ -90,7 +91,7 @@ const Navbar = () => {
 							</span>
 						</div>
 						<div className="flex items-center">
-							<a
+							<Link
 								className={cn(
 									"text-muted-foreground",
 									navigationMenuTriggerStyle,
@@ -98,10 +99,10 @@ const Navbar = () => {
 										variant: "ghost",
 									}),
 								)}
-								href="#"
+								href="/"
 							>
-								Home
+								Accueil
-							</a>
+							</Link>
 							<NavigationMenu>
 								<NavigationMenuList>
 									<NavigationMenuItem className="text-muted-foreground">
@@ -208,7 +209,9 @@ const Navbar = () => {
 						</div>
 					</div>
 					<div className="flex gap-2">
-						<Button variant="outline">Log in</Button>
+						<Button variant="outline">
+							<Link href="/login">Se connecter</Link>
+						</Button>
 						<Button>Sign up</Button>
 					</div>
 				</nav>
@@ -221,7 +224,7 @@ const Navbar = () => {
 								alt="logo"
 							/>
 							<span className="text-xl font-bold">
-								Shadcn Blocks
+								Latosa-Escrima
 							</span>
 						</div>
 						<Sheet>
@@ -240,15 +243,15 @@ const Navbar = () => {
 												alt="logo"
 											/>
 											<span className="text-xl font-bold">
-												Shadcn Blocks
+												Latosa-Escrima
 											</span>
 										</div>
 									</SheetTitle>
 								</SheetHeader>
 								<div className="mb-8 mt-8 flex flex-col gap-4">
-									<a href="#" className="font-semibold">
+									<Link href="/" className="font-semibold">
-										Home
+										Accueil
-									</a>
+									</Link>
 									<Accordion
 										type="single"
 										collapsible
@@ -399,7 +402,9 @@ const Navbar = () => {
 									</div>
 									<div className="mt-2 flex flex-col gap-3">
 										<Button variant="outline">
-											Log in
+											<Link href="/login">
+												Se connecter
+											</Link>
 										</Button>
 										<Button>Sign up</Button>
 									</div>

latosa-frontend/components/ui/textarea.tsx

@@ -0,0 +1,22 @@
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+const Textarea = React.forwardRef<
+	HTMLTextAreaElement,
+	React.ComponentProps<"textarea">
+>(({ className, ...props }, ref) => {
+	return (
+		<textarea
+			className={cn(
+				"flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+				className,
+			)}
+			ref={ref}
+			{...props}
+		/>
+	);
+});
+Textarea.displayName = "Textarea";
+
+export { Textarea };

latosa-frontend/package.json

@@ -22,6 +22,7 @@
 		"next": "15.1.4",
 		"react": "^19.0.0",
 		"react-dom": "^19.0.0",
+		"react-icons": "^5.4.0",
 		"tailwind-merge": "^2.6.0",
 		"tailwindcss-animate": "^1.0.7"
 	},