added and improved literary analysis page

This commit is contained in:
Harivansh Rathi 2024-12-03 23:23:10 -05:00
parent b9eb7cf738
commit 0134c81526
13 changed files with 1136 additions and 101 deletions

View file

@ -1,62 +1,43 @@
import { Link } from 'react-router-dom';
import { Feather, Heart, BookOpen, Mail, Users } from 'lucide-react';
import { Button } from '@/components/ui/button';
import {
NavigationMenu,
NavigationMenuContent,
NavigationMenuItem,
NavigationMenuLink,
NavigationMenuList,
NavigationMenuTrigger,
} from '@/components/ui/navigation-menu';
import { Feather } from 'lucide-react';
const Navbar = () => {
return (
<header className="border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
<div className="container flex h-16 items-center px-4">
<Link to="/" className="flex items-center space-x-2">
<Feather className="h-6 w-6" />
<span className="font-serif text-xl">Austen's Wedding Guide</span>
</Link>
<NavigationMenu className="ml-auto">
<NavigationMenuList>
<NavigationMenuItem>
<NavigationMenuTrigger>Advice</NavigationMenuTrigger>
<NavigationMenuContent>
<div className="grid gap-3 p-4 w-[400px]">
<NavigationMenuLink asChild>
<Link to="/blogs" className="flex items-center space-x-2">
<BookOpen className="h-4 w-4" />
<span>Character Blogs</span>
</Link>
</NavigationMenuLink>
<NavigationMenuLink asChild>
<Link to="/dear-jane" className="flex items-center space-x-2">
<Mail className="h-4 w-4" />
<span>Dear Jane</span>
</Link>
</NavigationMenuLink>
</div>
</NavigationMenuContent>
</NavigationMenuItem>
<NavigationMenuItem>
<Link to="/quiz">
<Button variant="secondary" size="sm">
<Users className="mr-2 h-4 w-4" />
Quiz
</Button>
</Link>
</NavigationMenuItem>
<NavigationMenuItem>
<Link to="/success-stories">
<Button variant="secondary" size="sm">
<Heart className="mr-2 h-4 w-4" />
Success Stories
</Button>
</Link>
</NavigationMenuItem>
</NavigationMenuList>
</NavigationMenu>
<header className="border-b bg-cream-50">
<div className="container mx-auto px-4">
<div className="flex h-16 items-center justify-between">
<Link to="/" className="flex items-center space-x-2">
<Feather className="h-6 w-6 text-sage-700" />
<span className="font-cormorant text-xl text-sage-900">Austen's Wedding Guide</span>
</Link>
<nav className="flex items-center space-x-6">
<Link to="/blogs" className="text-sage-700 hover:text-sage-900 transition-colors">
Character Blogs
</Link>
<Link to="/quiz" className="text-sage-700 hover:text-sage-900 transition-colors">
Bride Quiz
</Link>
<Link to="/dear-jane" className="text-sage-700 hover:text-sage-900 transition-colors">
Dear Jane
</Link>
<Link to="/vendors" className="text-sage-700 hover:text-sage-900 transition-colors">
Vendors
</Link>
<Link to="/success-stories" className="text-sage-700 hover:text-sage-900 transition-colors">
Success Stories
</Link>
<Link to="/market-calculator" className="text-sage-700 hover:text-sage-900 transition-colors">
Market Value
</Link>
<Link
to="/analysis"
className="bg-sage-100 text-sage-700 hover:bg-sage-200 px-4 py-2 rounded-md transition-colors"
>
Literary Analysis
</Link>
</nav>
</div>
</div>
</header>
);

View file

@ -4,6 +4,7 @@ import Blogs from '@/pages/Blogs';
import DearJane from '@/pages/DearJane';
import Quiz from '@/pages/Quiz';
import SuccessStories from '@/pages/SuccessStories';
import Analysis from '@/pages/Analysis';
const Routes = () => {
return (
@ -13,8 +14,9 @@ const Routes = () => {
<Route path="/dear-jane" element={<DearJane />} />
<Route path="/quiz" element={<Quiz />} />
<Route path="/success-stories" element={<SuccessStories />} />
<Route path="/analysis" element={<Analysis />} />
</RouterRoutes>
);
}
export default Routes;
export default Routes;

View file

@ -1,28 +1,10 @@
import { Link } from 'react-router-dom';
import { Toaster } from '@/components/ui/toaster';
import Navbar from '../Navbar';
const MainLayout = ({ children }: { children: React.ReactNode }) => {
return (
<div className="min-h-screen bg-cream-50">
<nav className="bg-sage-100 border-b border-sage-200">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex justify-between h-16">
<div className="flex">
<Link to="/" className="flex items-center font-cormorant text-2xl text-sage-900">
Austen's Wedding Guide
</Link>
</div>
<div className="hidden sm:ml-6 sm:flex sm:space-x-8">
<Link to="/blogs" className="nav-link">Character Blogs</Link>
<Link to="/quiz" className="nav-link">Bride Quiz</Link>
<Link to="/advice" className="nav-link">Dear Jane</Link>
<Link to="/vendors" className="nav-link">Vendors</Link>
<Link to="/success-stories" className="nav-link">Success Stories</Link>
<Link to="/calculator" className="nav-link">Market Value</Link>
</div>
</div>
</div>
</nav>
<Navbar />
<main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
{children}