Made a lot of the front end

This commit is contained in:
2024-11-29 19:37:14 -06:00
parent 04a6322b55
commit 6ff62ca0a6
37 changed files with 1360 additions and 70 deletions

View File

@@ -8,6 +8,7 @@ import { type Metadata } from "next";
import Theme_Toggle from '~/components/theme/theme_toggle'
import { Button } from "~/components/ui/button"
import Link from 'next/link'
import Avatar_Popover from "~/components/auth/AvatarPopover";
export const metadata: Metadata = {
title: "Tenant Portal",
@@ -25,8 +26,76 @@ export default async function RootLayout({
}: Readonly<{ children: React.ReactNode }>) {
const session = await auth();
if (!session?.user) {
}
return (
return (
<html lang="en">
<body
className={cn(
"min-h-screen bg-background font-sans antialiased",
fontSans.variable)}
>
<Theme_Provider
attribute="class"
defaultTheme="system"
enableSystem={true}
disableTransitionOnChange={true}
>
<SessionProvider>
<div className="flex flex-col min-h-screen">
<header className="bg-background shadow-sm">
<div className="container mx-auto px-4 py-4 flex justify-between items-center">
<Link href="/" className="md:text-2xl font-bold text-primary">Magnolia Coast Properties</Link>
<nav className="hidden md:flex space-x-2 lg:space-x-4 text-sm lg:text-lg">
<Link href="/properties" className="text-gray-600 hover:text-primary">Properties</Link>
<Link href="/services" className="text-gray-600 hover:text-primary">Services</Link>
<Link href="/about" className="text-gray-600 hover:text-primary">About</Link>
<Link href="/contact" className="text-gray-600 hover:text-primary">Contact</Link>
</nav>
<div className="flex space-x-2 md:space-x-4">
<Theme_Toggle/>
<Link href="/login">
<Button variant="outline">Login</Button>
</Link>
</div>
</div>
</header>
{children}
<footer className="bg-background text-primary py-8">
<div className="container mx-auto px-4">
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
<div>
<h3 className="text-xl font-bold mb-4">Magnolia Coast Property Management</h3>
<p>Your trusted partner in property management</p>
</div>
<div>
<h4 className="text-lg font-semibold mb-4">Quick Links</h4>
<ul className="space-y-2">
<li><Link href="/properties" className="hover:text-primary-foreground">Properties</Link></li>
<li><Link href="/services" className="hover:text-primary-foreground">Services</Link></li>
<li><Link href="/about" className="hover:text-primary-foreground">About Us</Link></li>
<li><Link href="/contact" className="hover:text-primary-foreground">Contact</Link></li>
</ul>
</div>
<div>
<h4 className="text-lg font-semibold mb-4">Contact Us</h4>
<p>123 Property Street</p>
<p>City, State 12345</p>
<p>Phone: (123) 456-7890</p>
<p>Email: info@propertypro.com</p>
</div>
</div>
<div className="mt-8 text-center">
<p>&copy; 2024 Magnolia Coast Property Management LLC. All rights reserved.</p>
</div>
</div>
</footer>
</div>
</SessionProvider>
</Theme_Provider>
</body>
</html>
);
} else {
return (
<html lang="en">
<body
className={cn(
@@ -44,18 +113,17 @@ export default async function RootLayout({
<div className="flex flex-col min-h-screen">
<header className="bg-background shadow-sm">
<div className="container mx-auto px-4 py-4 flex justify-between items-center">
<Link href="/" className="text-2xl:md font-bold text-primary">Magnolia Coast Properties</Link>
<Link href="/" className="md:text-2xl font-bold text-primary">Magnolia Coast Properties</Link>
<nav className="hidden md:flex space-x-2 lg:space-x-4 text-sm lg:text-lg">
<Link href="#" className="text-gray-600 hover:text-primary">Home</Link>
<Link href="#" className="text-gray-600 hover:text-primary">Properties</Link>
<Link href="#" className="text-gray-600 hover:text-primary">Services</Link>
<Link href="#" className="text-gray-600 hover:text-primary">About</Link>
<Link href="#" className="text-gray-600 hover:text-primary">Contact</Link>
<Link href="/account" className="text-gray-600 hover:text-primary">My Account</Link>
<Link href="/properties" className="text-gray-600 hover:text-primary">Properties</Link>
<Link href="/services" className="text-gray-600 hover:text-primary">Services</Link>
<Link href="/about" className="text-gray-600 hover:text-primary">About</Link>
<Link href="/contact" className="text-gray-600 hover:text-primary">Contact</Link>
</nav>
<div className="flex space-x-2">
<div className="flex space-x-2 md:space-x-4">
<Theme_Toggle/>
<Button variant="outline">Login</Button>
<Button>Register</Button>
<Avatar_Popover/>
</div>
</div>
</header>
@@ -70,11 +138,11 @@ export default async function RootLayout({
<div>
<h4 className="text-lg font-semibold mb-4">Quick Links</h4>
<ul className="space-y-2">
<li><Link href="#" className="hover:text-primary-foreground">Home</Link></li>
<li><Link href="#" className="hover:text-primary-foreground">Properties</Link></li>
<li><Link href="#" className="hover:text-primary-foreground">Services</Link></li>
<li><Link href="#" className="hover:text-primary-foreground">About Us</Link></li>
<li><Link href="#" className="hover:text-primary-foreground">Contact</Link></li>
<li><Link href="/account" className="hover:text-primary-foreground">My Account</Link></li>
<li><Link href="/properties" className="hover:text-primary-foreground">Properties</Link></li>
<li><Link href="/services" className="hover:text-primary-foreground">Services</Link></li>
<li><Link href="/about" className="hover:text-primary-foreground">About Us</Link></li>
<li><Link href="/contact" className="hover:text-primary-foreground">Contact</Link></li>
</ul>
</div>
<div>
@@ -95,5 +163,6 @@ export default async function RootLayout({
</Theme_Provider>
</body>
</html>
);
);
}
}