first commit
This commit is contained in:
@@ -0,0 +1,13 @@
|
||||
export default function Description() {
|
||||
return (
|
||||
<div className="mt-4">
|
||||
<p className="text-lg font-light">
|
||||
The classics you love prepared with a perfect twist, all served up in an
|
||||
atmosphere that feels just right. That’s the Milestones promise. So,
|
||||
whether you’re celebrating a milestone, making the most of Happy Hour or
|
||||
enjoying brunch with friends, you can be sure that every Milestones
|
||||
experience is a simple and perfectly memorable one.
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
export default function Header() {
|
||||
return (
|
||||
<div className="h-96 overflow-hidden">
|
||||
<div className="bg-center bg-gradient-to-r from-[#0f1f47] to-[#5f6984] h-full flex justify-center items-center">
|
||||
<h1 className="text-7xl text-white captitalize text-shadow text-center">
|
||||
Milestones Grill (Toronto)
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,34 @@
|
||||
export default function Images() {
|
||||
return (
|
||||
<div>
|
||||
<h1 className="font-bold text-3xl mt-10 mb-7 border-b pb-5">5 photos</h1>
|
||||
<div className="flex flex-wrap">
|
||||
<img
|
||||
className="w-56 h-44 mr-1 mb-1"
|
||||
src="https://resizer.otstatic.com/v2/photos/xlarge/3/41701449.jpg"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
className="w-56 h-44 mr-1 mb-1"
|
||||
src="https://resizer.otstatic.com/v2/photos/xlarge/2/41701450.jpg"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
className="w-56 h-44 mr-1 mb-1"
|
||||
src="https://resizer.otstatic.com/v2/photos/xlarge/2/41701452.jpg"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
className="w-56 h-44 mr-1 mb-1"
|
||||
src="https://resizer.otstatic.com/v2/photos/xlarge/2/41701453.jpg"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
className="w-56 h-44 mr-1 mb-1"
|
||||
src="https://resizer.otstatic.com/v2/photos/xlarge/2/41701454.jpg"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
import MenuCard from "./MenuCard";
|
||||
|
||||
export default function Menu() {
|
||||
return (
|
||||
<main className="bg-white mt-5">
|
||||
<div>
|
||||
<div className="mt-4 pb-1 mb-1">
|
||||
<h1 className="font-bold text-4xl">Menu</h1>
|
||||
</div>
|
||||
<div className="flex flex-wrap justify-between">
|
||||
<MenuCard />
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
export default function MenuCard() {
|
||||
return (
|
||||
<div className=" border rounded p-3 w-[49%] mb-3">
|
||||
<h3 className="font-bold text-lg">Surf and Turf</h3>
|
||||
<p className="font-light mt-1 text-sm">
|
||||
A well done steak with lobster and rice
|
||||
</p>
|
||||
<p className="mt-7">$80.00</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,13 @@
|
||||
export default function Rating() {
|
||||
return (
|
||||
<div className="flex items-end">
|
||||
<div className="ratings mt-2 flex items-center">
|
||||
<p>*****</p>
|
||||
<p className="text-reg ml-3">4.9</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-reg ml-4">600 Reviews</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
"use client"
|
||||
|
||||
export default function ReservationCard() {
|
||||
return (
|
||||
<div className="fixed w-[15%] bg-white rounded p-3 shadow">
|
||||
<div className="text-center border-b pb-2 font-bold">
|
||||
<h4 className="mr-7 text-lg">Make a Reservation</h4>
|
||||
</div>
|
||||
<div className="my-3 flex flex-col">
|
||||
<label htmlFor="">Party size</label>
|
||||
<select name="" className="py-3 border-b font-light" id="">
|
||||
<option value="">1 person</option>
|
||||
<option value="">2 people</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<div className="flex flex-col w-[48%]">
|
||||
<label htmlFor="">Date</label>
|
||||
<input type="text" className="py-3 border-b font-light w-28" />
|
||||
</div>
|
||||
<div className="flex flex-col w-[48%]">
|
||||
<label htmlFor="">Time</label>
|
||||
<select name="" id="" className="py-3 border-b font-light">
|
||||
<option value="">7:30 AM</option>
|
||||
<option value="">9:30 AM</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-5">
|
||||
<button className="bg-red-600 rounded w-full px-4 text-white font-bold h-16">
|
||||
Find a Time
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
import Link from "next/link";
|
||||
|
||||
export default function RestaurantNavBar() {
|
||||
return (
|
||||
<nav className="flex text-reg border-b pb-2">
|
||||
<Link href="/restaurant/milestonegrill/" className="mr-7">
|
||||
Overview
|
||||
</Link>
|
||||
<Link href="/restaurant/milestonegrill/menu" className="mr-7">
|
||||
Menu
|
||||
</Link>
|
||||
</nav>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
export default function Reviews() {
|
||||
return (
|
||||
<div>
|
||||
<h1 className="font-bold text-3xl mt-10 mb-7 borber-b pb-5">
|
||||
What 100 people are saying
|
||||
</h1>
|
||||
<div>
|
||||
<div className="border-b pb-7 mb-7">
|
||||
<div className="flex">
|
||||
<div className="w-1/6 flex flex-col items-center">
|
||||
<div className="rounded-full bg-blue-400 w-16 h-16 flex items-center justify-center">
|
||||
<h2 className="text-white text-2xl">MJ</h2>
|
||||
</div>
|
||||
<p className="text-center">Micheal Jordan</p>
|
||||
</div>
|
||||
<div className="ml-10 w-5/6">
|
||||
<div className="flex items-center">
|
||||
<div className="flex mr-5">*****</div>
|
||||
</div>
|
||||
<div className="mt-5">
|
||||
<p className="text-lg font-light">
|
||||
Laurie was on top of everything! Slow night due to the snow
|
||||
storm so it worked in our favor to have more one on one with
|
||||
the staff. Delicious and well worth the money.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
export default function Title() {
|
||||
return (
|
||||
<div className="mt-4 border-b pb-6">
|
||||
<h1 className="font-bold text-6xl">Milesstone Grill</h1>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
export default function Head() {
|
||||
return (
|
||||
<>
|
||||
<title>Restaurant</title>
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
||||
<meta name="description" content="Generated by create next app" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
import Header from "./components/Header";
|
||||
|
||||
export default function RestorantLayout({
|
||||
children,
|
||||
}: {
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
return (
|
||||
<main>
|
||||
<Header />
|
||||
<div className="flex m-auto w-2/3 justify-between items-start 0 -mt-11">
|
||||
{children}
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
export default function Head() {
|
||||
return (
|
||||
<>
|
||||
<title>Menu</title>
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
||||
<meta name="description" content="Generated by create next app" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,12 @@
|
||||
import Header from "../components/Header";
|
||||
import Menu from "../components/Menu";
|
||||
import RestaurantNavBar from "../components/RestaurantNavBar";
|
||||
|
||||
export default function RestaurantMenu() {
|
||||
return (
|
||||
<div className="bg-white w-[100%] rounded p-3 shadow">
|
||||
<RestaurantNavBar />
|
||||
<Menu />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
import Description from "./components/Description";
|
||||
import Header from "./components/Header";
|
||||
import Images from "./components/Images";
|
||||
import Rating from "./components/Rating";
|
||||
import ReservationCard from "./components/ReservationCard";
|
||||
import RestaurantNavBar from "./components/RestaurantNavBar";
|
||||
import Reviews from "./components/Reviews";
|
||||
import Title from "./components/Title";
|
||||
|
||||
export default function RestaurantDetails() {
|
||||
return (
|
||||
<>
|
||||
<div className="bg-white w-[70%] rounded p-3 shadow">
|
||||
<RestaurantNavBar />
|
||||
<Title />
|
||||
<Rating />
|
||||
<Description />
|
||||
<Images />
|
||||
<Reviews />
|
||||
</div>
|
||||
<div className="w-[27%] relative text-reg">
|
||||
<ReservationCard />
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user