This commit is contained in:
Jacob Delgado 2024-02-28 16:52:41 -08:00
commit 5e8a8f0b2d
38 changed files with 689 additions and 252 deletions

View File

@ -6,7 +6,9 @@
# DATABASE_URL="postgresql://johndoe:randompassword@localhost:5432/mydb?schema=public"
# DATABASE_URL="mysql://root:%21Plop2099341723@192.168.50.190:3306/db"
MAPS_API_KEY="https://www.google.com/maps/embed/v1/place?q=place_id:ChIJQ-7Uc0BitocRQZASTWUyN04&key=AIzaSyBS4qOnpT4llaFa_UKMpeWike3lzDvFZ1U"
MAPS_API_KEY="https://www.google.com/maps/embed/v1/place?q=place_id:ChIJQ-7Uc0BitocRQZASTWUyN04&key=AIzaSyAREyrK0fG1haeNcLFbap0kBhP9Ld2_GSU"
GOOGLE_API_KEY="AIzaSyAREyrK0fG1haeNcLFbap0kBhP9Ld2_GSU"
PLACE_ID_KEY="ChIJQ-7Uc0BitocRQZASTWUyN04"
DB_HOST="aws.connect.psdb.cloud"
DB_USER="11lq0wcjbxyku4zmubji"

View File

@ -30,7 +30,7 @@ const NavBar = () => {
const links = [
{ label: "HOME", href: "/" },
{ label: "MENU", href: "/menu" },
{ label: "GALLERY", href: "/gallery" },
// { label: "GALLERY", href: "/gallery" },
{ label: "ABOUT", href: "/about-us" },
{ label: "CONTACT", href: "/contact" },
];
@ -76,13 +76,18 @@ const NavBar = () => {
<div className="flex flex-row h-full">
{/* left side */}
<div className="flex w-1/2 lg:gap-6 gap-4 relative lg:left-20 left-0 ">
<div className="flex items-center justify-center gap-1">
<div className="flex items-center justify-center gap-1 z-10">
<a
href="https://www.google.com/maps/place/Jefe's+Mexican+Cocina+Y+Cantina/@36.0190665,-95.7069482,15z/data=!4m14!1m7!3m6!1s0x87b6624073d4ee43:0x4e3732654d129041!2sJefe's+Mexican+Cocina+Y+Cantina!8m2!3d36.0190665!4d-95.7069482!16s%2Fg%2F11f0wkrmd3!3m5!1s0x87b6624073d4ee43:0x4e3732654d129041!8m2!3d36.0190665!4d-95.7069482!16s%2Fg%2F11f0wkrmd3?entry=ttu"
className="flex items-center justify-center gap-1"
>
<div className="text-xl brightness-90">
<IoLocationSharp />
</div>
<span className="flex flex-wrap brightness-90 font-sans text-sm">
24188 E Hwy 51, Broken Arrow, OK 74014
</span>
</a>
</div>
<div className="flex items-center justify-center">
<StoreHours />

View File

@ -7,9 +7,16 @@ const Reserve = () => {
return (
<div>
<div className="right-2 hidden md:block">
<Button size='sm' className="xl:text-lg bg-red-800 hover:bg-slate-800 text-xs">
<Button
size="sm"
className="xl:text-lg bg-red-800 hover:bg-slate-800 text-xs"
>
<span className="flex flex-row">
<span className="flex flex-row">ORDER ONLINE</span>
<span className="flex flex-row">
<a href="https://www.grubhub.com/restaurant/jefes-mexican-cocina-y-cantina-24188-e-hwy-51-broken-arrow/2735039?pickup=true&rwg_token=AAh05qZCcKFQ2Z7gD1Zk8cKMX6nulMnyaXXy0WFPLpaVJpzOl7Hmg_7_21m5_lqd6Px-CeiFlA0OBrR9wjNyhFbJLOA6sURn_fdyCxIc6A4f4duiviHGfos%3D">
ORDER ONLINE
</a>
</span>
</span>
{/* <Image
src="/fork.svg"

View File

@ -2,13 +2,13 @@ import React from 'react';
import GoogleReviews from './google_reviews';
const App = () => {
const apiKey = 'AIzaSyClfOGrkQNRjDFzvnTk-W7Oeh-yyDNCXN0'; // Replace with your Google API key
const placeId = 'ChIJQ-7Uc0BitocRQZASTWUyN04'; // Replace with the Google Place ID of the location
const apiKey = ''; // Replace with your Google API key
const placeId = ''; // Replace with the Google Place ID of the location
return (
<div>
<h1>Google Reviews</h1>
<GoogleReviews apiKey={apiKey} placeId={placeId} />
<GoogleReviews apiKey={process.env.GOOGLE_API_KEY} placeId={process.env.PLACE_ID_KEY} />
</div>
);
};

View File

@ -27,7 +27,7 @@ const contact = () => {
</div>
</div>
<div className="flex flex-col bg-gray-800 w-full">
<div>Contact Us</div>
<div>Contact Us Today</div>
<Calendar />
<Form />
</div>

View File

@ -54,7 +54,7 @@ const Gallery = () => {
quality={100}
className="brightness-[20%] "
/>
<div className="flex flex-col w-full text-center xl:text-5xl xl:block text-white lg:text-2xl z-10">
<div className="flex flex-col w-full text-center xl:text-5xl xl:block text-white lg:text-2xl absolute">
<div className="p-6 ">
<p className="py-4">
<span className="">GALLERY</span>

View File

@ -6,6 +6,7 @@
"price_large": 7,
"price_small": 5,
"spicy": "no",
"favorite": "yes",
"description": "avocado dripppppp"
},
{

View File

@ -3,10 +3,13 @@ import Image from "next/image";
import "./appetizers.css";
import Menu from "./items.json";
import { Button } from "@/components/ui/button";
import MenuCard from "../MenuCard/MenuCard";
const Appetizers = () => {
return (
<div className="flex flex-col w-full">
<main>
<MenuCard Menu={Menu} />
{/* <div className="flex flex-col w-full">
<div className="text-4xl flex flex-row text-black antialiased font-bold items-center justify-center">
<Image
src="/gun01.svg"
@ -23,9 +26,9 @@ const Appetizers = () => {
width={70}
height={50}
/>
</div>
</div> */}
{/* Mapping out the menu */}
<div className=" flex flex-wrap gap-8 pt-6 justify-between w-full">
{/* <div className=" flex flex-wrap gap-8 pt-6 justify-between w-full">
{Menu.map((menu_item) => {
return (
<div
@ -45,7 +48,9 @@ const Appetizers = () => {
<h4 className="">
<strong>{menu_item.name}</strong>
</h4>
<p className="max-w-[75ch]">Description: {menu_item.description}</p>
<p className="max-w-[75ch]">
Description: {menu_item.description}
</p>
<div className="flex flex-row bg-gray-500 justify-evenly">
<div className="bg-red-400 flex flex-row">
<span>
@ -61,9 +66,7 @@ const Appetizers = () => {
</div>
<div className="flex bg-emerald-400 w-1/2 relative">
<div className="flex bg-blue-600 w-3 h-full items-end justify-end">
<div className="">
</div>
<div className=""></div>
</div>
</div>
</div>
@ -71,7 +74,7 @@ const Appetizers = () => {
);
})}
</div>
</div> */}
{/* <div className="col-span-2 gap-6 bg-green-400">
<div className="flex flex-row space-x-2 bg-gray-400">
<h4 className="text-semibold">
@ -100,7 +103,7 @@ const Appetizers = () => {
</div>
</div>
</div> */}
</div>
</main>
);
};

View File

@ -5,6 +5,8 @@
"photo": "Bar/32ozCaguamas.jpeg",
"price": 14,
"size": "32oz",
"spicy": "no",
"favorite": "no",
"description": "A drink."
},
{
@ -13,6 +15,8 @@
"photo": "Bar/100ozTower.jpeg",
"price": 35,
"size": "100oz",
"spicy": "yes",
"favorite": "no",
"description": "A tower full of Corona."
},
{
@ -21,6 +25,8 @@
"photo": "Bar/chambong.jpeg",
"price": 18,
"size": "36oz",
"spicy": "no",
"favorite": "yes",
"description": "El Chambong."
},
{
@ -29,6 +35,8 @@
"photo": "Bar/laMeraMera56ozMargarita.jpeg",
"price": 20,
"size": "56oz",
"spicy": "yes",
"favorite": "yes",
"description": "The special margarita."
},
{
@ -37,6 +45,8 @@
"photo": "Bar/Michelada.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Corona with tamarindo."
},
{
@ -45,6 +55,8 @@
"photo": "Bar/Michelada.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
}
]

View File

@ -1,84 +1,14 @@
"use client";
import * as React from "react";
import { Card, CardContent, CardHeader } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import Menu from "./items.json";
import Image from "next/image";
import localFont from 'next/font/local';
const interBold = localFont({
src: './Inter-Bold.woff',
display: 'swap',
})
import MenuCard from "../MenuCard/MenuCard";
const Bar = () => {
let pic = "cover";
return (
<main>
<div className="flex flex-wrap gap-8">
{Menu.map((menu_item) => {
return (
<Card key={menu_item.id} className="flex flex-grow flex-col w-[325px] h-[452px]">
<div className="w-full h-[55%]">
<div className="h-full relative w-full">
<Image
src={`/${menu_item.photo}`}
alt="chili pepper spice"
fill
style={{ objectFit: "cover", objectPosition: "center" }}
quality={100}
className="rounded-t-lg"
/>
</div>
</div>
<div className="m-[8px] space-y-[4px]">
{/* title and description of item */}
<div className="flex flex-col w-full font-sans">
{/* title and photo */}
<div className="inline-block">
<h4 className={`pt-2 float-left ${interBold.className}`}>
<strong>{menu_item.name}</strong>
</h4>
{/* <div className="bg-red-300 float-right relative w-[25px] h-[25px]">
<Image
src="/red-chili-pepper.svg"
alt="chili pepper spice"
fill
style={{
objectFit: "contain",
}}
quality={100}
className=""
/>
</div> */}
</div>
{/* paragraph text */}
<div className="inline-block text-left">
<p className={`max-w-[75ch] ${interBold.className} font-semibold`}>
{menu_item.description}
</p>
{/* 16px line height */}
<p className="leading-4 text-[#8F8F8F]">
{menu_item.description}
</p>
</div>
</div>
{/* cart addon */}
<div className="flex flex-row">
<div className=" flex flex-row">
<strong>{`$${menu_item.price}`}</strong>
</div>
<div className="flex w-1/2 relative">
<div className="flex w-3 h-full items-end justify-end">
<div className=""></div>
</div>
</div>
</div>
</div>
</Card>
);
})}
</div>
<MenuCard Menu={Menu} />
</main>
);
};

View File

@ -0,0 +1,62 @@
[
{
"id": 1,
"name": "Caguamas",
"photo": "Bar/32ozCaguamas.jpeg",
"price": 14,
"size": "32oz",
"spicy": "no",
"favorite": "no",
"description": "A drink."
},
{
"id": 2,
"name": "Jefes Tower",
"photo": "Bar/100ozTower.jpeg",
"price": 35,
"size": "100oz",
"spicy": "yes",
"favorite": "no",
"description": "A tower full of Corona."
},
{
"id": 3,
"name": "Chambong",
"photo": "Bar/chambong.jpeg",
"price": 18,
"size": "36oz",
"spicy": "no",
"favorite": "yes",
"description": "El Chambong."
},
{
"id": 4,
"name": "La Mera Mera Margarita",
"photo": "Bar/laMeraMera56ozMargarita.jpeg",
"price": 20,
"size": "56oz",
"spicy": "yes",
"favorite": "yes",
"description": "The special margarita."
},
{
"id": 5,
"name": "Michelada",
"photo": "Bar/Michelada.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Corona with tamarindo."
},
{
"id": 6,
"name": "Cheesy Mac & Cheese With a Fruit Cup",
"photo": "Bar/Michelada.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
}
]

View File

@ -1,9 +1,13 @@
import React from 'react'
import React from "react";
import Menu from "./items.json";
import MenuCard from "../MenuCard/MenuCard";
const page = () => {
return (
<div>Beverages</div>
)
}
<main>
<MenuCard Menu={Menu} />
</main>
);
};
export default page
export default page;

View File

@ -0,0 +1,62 @@
[
{
"id": 1,
"name": "Caguamas",
"photo": "Bar/32ozCaguamas.jpeg",
"price": 14,
"size": "32oz",
"spicy": "no",
"favorite": "no",
"description": "A drink."
},
{
"id": 2,
"name": "Jefes Tower",
"photo": "Bar/100ozTower.jpeg",
"price": 35,
"size": "100oz",
"spicy": "yes",
"favorite": "no",
"description": "A tower full of Corona."
},
{
"id": 3,
"name": "Chambong",
"photo": "Bar/chambong.jpeg",
"price": 18,
"size": "36oz",
"spicy": "no",
"favorite": "yes",
"description": "El Chambong."
},
{
"id": 4,
"name": "La Mera Mera Margarita",
"photo": "Bar/laMeraMera56ozMargarita.jpeg",
"price": 20,
"size": "56oz",
"spicy": "yes",
"favorite": "yes",
"description": "The special margarita."
},
{
"id": 5,
"name": "Michelada",
"photo": "Bar/Michelada.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Corona with tamarindo."
},
{
"id": 6,
"name": "Cheesy Mac & Cheese With a Fruit Cup",
"photo": "Bar/Michelada.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
}
]

View File

@ -1,9 +1,13 @@
import React from 'react'
import React from "react";
import Menu from "./items.json";
import MenuCard from "../MenuCard/MenuCard";
const page = () => {
return (
<div>Brunch</div>
)
}
<main>
<MenuCard Menu={Menu} />
</main>
);
};
export default page
export default page;

View File

@ -0,0 +1,102 @@
[
{
"id": 1,
"name": "Camarones Fundidos",
"photo": "Dinner/camaronesFundidos.jpeg",
"price": 14,
"size": "32oz",
"spicy": "no",
"favorite": "no",
"description": "A drink."
},
{
"id": 2,
"name": "Chile Colorado",
"photo": "Dinner/chileColorado.jpeg",
"price": 35,
"size": "100oz",
"spicy": "yes",
"favorite": "no",
"description": "A tower full of Corona."
},
{
"id": 3,
"name": "Crab and Shrimp Salad",
"photo": "Dinner/crabAndShrimpSalad.jpeg",
"price": 18,
"size": "36oz",
"spicy": "no",
"favorite": "yes",
"description": "El Chambong."
},
{
"id": 4,
"name": "Fajitas",
"photo": "Dinner/fajitas.jpeg",
"price": 20,
"size": "56oz",
"spicy": "yes",
"favorite": "yes",
"description": "The special margarita."
},
{
"id": 5,
"name": "Grilled Chicken and Bacon Quesadilla",
"photo": "Dinner/grilledChickenBaconQuesadilla.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Corona with tamarindo."
},
{
"id": 6,
"name": "Jefes bowl",
"photo": "Dinner/jefesBowl.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
},
{
"id": 7,
"name": "Las Enchiladas",
"photo": "Dinner/lasEnchiladas.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
},
{
"id": 8,
"name": "Molcajete",
"photo": "Dinner/molcajete.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
},
{
"id": 9,
"name": "Street Tacos",
"photo": "Dinner/streetTacos.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
},
{
"id": 10,
"name": "Torta",
"photo": "Dinner/torta.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
}
]

View File

@ -1,9 +1,13 @@
import React from 'react'
import React from "react";
import Menu from "./items.json";
import MenuCard from "../MenuCard/MenuCard";
const page = () => {
return (
<div>page</div>
)
}
<main>
<MenuCard Menu={Menu} />
</main>
);
};
export default page
export default page;

View File

@ -0,0 +1,62 @@
[
{
"id": 1,
"name": "Caguamas",
"photo": "Bar/32ozCaguamas.jpeg",
"price": 14,
"size": "32oz",
"spicy": "no",
"favorite": "no",
"description": "A drink."
},
{
"id": 2,
"name": "Jefes Tower",
"photo": "Bar/100ozTower.jpeg",
"price": 35,
"size": "100oz",
"spicy": "yes",
"favorite": "no",
"description": "A tower full of Corona."
},
{
"id": 3,
"name": "Chambong",
"photo": "Bar/chambong.jpeg",
"price": 18,
"size": "36oz",
"spicy": "no",
"favorite": "yes",
"description": "El Chambong."
},
{
"id": 4,
"name": "La Mera Mera Margarita",
"photo": "Bar/laMeraMera56ozMargarita.jpeg",
"price": 20,
"size": "56oz",
"spicy": "yes",
"favorite": "yes",
"description": "The special margarita."
},
{
"id": 5,
"name": "Michelada",
"photo": "Bar/Michelada.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Corona with tamarindo."
},
{
"id": 6,
"name": "Cheesy Mac & Cheese With a Fruit Cup",
"photo": "Bar/Michelada.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
}
]

View File

@ -1,57 +1,14 @@
import React from 'react'
import Image from 'next/image'
import React from "react";
import Image from "next/image";
import Menu from "./items.json";
import MenuCard from "../MenuCard/MenuCard";
const page = () => {
return (
<div>
<div className="heading">
<h2 className="bev-h2">Quesadillas</h2>
<p className="">
Contains bell peppers, tomatoes, onions with a side of guacamole salad
upon request. Add rice & beans $2.{" "}
<span className="detail">Choose from the following proteins:</span>{" "}
</p>
<div className="head">
<h4>
ASADA | CHICKEN | CHORIZO | CARNITAS | AL PASTOR | SHRIMP | FISH |
BARBACOA - $11
</h4>
</div>
<div className="decor" aria-hidden="true">
<div className="left"></div>
<Image
src="/gun01.svg"
alt="gun icon for decor"
className=""
width="61"
height="101"
/>
<div className="right"></div>
</div>
</div>
<ul className="items items-small">
<li className="item">
<div className="head">
<h4>Grilled Chicken & Bacon Quesadilla</h4>
<span>- $10</span>
</div>
</li>
<li className="item">
<div className="head">
<h4>Quesadilla Del Mar</h4>
<span>- $12</span>
</div>
</li>
<li className="item">
<div className="head">
<h4>Fajita Quesadilla</h4>
<span>- $11</span>
</div>
<p>Chicken or Steak</p>
</li>
</ul>
</div>
)
}
<main>
<MenuCard Menu={Menu} />
</main>
);
};
export default page
export default page;

View File

@ -0,0 +1,114 @@
"use client";
import * as React from "react";
import Image from "next/image";
import localFont from "next/font/local";
import { Inter } from "next/font/google";
import { Card } from "@/components/ui/card";
const interBold = localFont({
src: "./Inter-Bold.woff",
display: "swap",
});
const extraBold = localFont({
src: "./Inter-ExtraBold.woff",
display: "swap",
});
const inter = Inter({ subsets: ["latin"] });
const MenuCard = ({ Menu }: any) => {
return (
<div className="grid desktop:grid-cols-5 tablet:grid-cols-3 md:grid-cols-2 grid-flow-row gap-y-6 md:gap-x-6">
{Menu.map((menu_item: any) => {
return (
<Card
key={menu_item.id}
className="flex-1 flex-col max-w-[325px] h-[452px] relative"
>
<div className="w-full h-[55%]">
<div className="h-full relative w-full">
<Image
src={`/${menu_item.photo}`}
alt="chili pepper spice"
fill
style={{ objectFit: "cover", objectPosition: "center" }}
quality={75}
sizes="(max-width: 325px) 100vw, (max-width: 1200px) 50vw, 33vw"
className="flex"
/>
</div>
</div>
<div className="m-[8px] space-y-[4px]">
{/* title and description of item */}
<div className="flex flex-col w-full font-sans">
{/* title and photo */}
<div className="inline-block">
<h4
className={`pt-2 float-left ${extraBold.className} flex-wrap w-3/4`}
>
<strong>{menu_item.name}</strong>
</h4>
<div className="right-4 absolute h-[25px] flex flex-row w-1/4 mt-2">
{menu_item.spicy === "yes" ? (
<Image
src="/red-chili-pepper.svg"
alt="chili pepper spice"
fill
style={{
objectFit: "contain",
objectPosition: "center",
}}
quality={100}
sizes="(max-width: 25px) 100vw, (max-width: 1200px) 50vw, 33vw"
className="flex"
/>
) : (
<div className="hidden"></div>
)}
{menu_item.favorite === "yes" ? (
<Image
src="/star.svg"
alt="chili pepper spice"
fill
style={{
objectFit: "contain",
objectPosition: "right",
}}
quality={100}
sizes="(max-width: 25px) 100vw, (max-width: 325px) 50vw, 33vw"
className="flex"
/>
) : (
<div className="hidden"></div>
)}
</div>
</div>
{/* description text */}
<div className="inline-block text-left pt-2">
<p
className={`max-w-[75ch] ${inter.className} leading-tight font-[12px] text-gray-400 `}
>
{menu_item.description}
</p>
</div>
</div>
</div>
{/* cart addon */}
<div className="flex flex-row bottom-0 absolute m-2">
<div className="flex flex-row">
<strong>{`$${menu_item.price}`}</strong>
</div>
<div className="flex w-1/2 relative">
<div className="flex w-3 h-full items-end justify-end">
<div className=""></div>
</div>
</div>
</div>
</Card>
);
})}
</div>
);
};
export default MenuCard;

View File

@ -1,9 +0,0 @@
import React from 'react'
const page = () => {
return (
<div>page</div>
)
}
export default page

View File

@ -0,0 +1,62 @@
[
{
"id": 1,
"name": "Caguamas",
"photo": "Bar/32ozCaguamas.jpeg",
"price": 14,
"size": "32oz",
"spicy": "no",
"favorite": "no",
"description": "A drink."
},
{
"id": 2,
"name": "Jefes Tower",
"photo": "Bar/100ozTower.jpeg",
"price": 35,
"size": "100oz",
"spicy": "yes",
"favorite": "no",
"description": "A tower full of Corona."
},
{
"id": 3,
"name": "Chambong",
"photo": "Bar/chambong.jpeg",
"price": 18,
"size": "36oz",
"spicy": "no",
"favorite": "yes",
"description": "El Chambong."
},
{
"id": 4,
"name": "La Mera Mera Margarita",
"photo": "Bar/laMeraMera56ozMargarita.jpeg",
"price": 20,
"size": "56oz",
"spicy": "yes",
"favorite": "yes",
"description": "The special margarita."
},
{
"id": 5,
"name": "Michelada",
"photo": "Bar/Michelada.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Corona with tamarindo."
},
{
"id": 6,
"name": "Cheesy Mac & Cheese With a Fruit Cup",
"photo": "Bar/Michelada.jpeg",
"price": 13,
"size": "24oz",
"spicy": "yes",
"favorite": "no",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
}
]

View File

@ -1,9 +1,13 @@
import React from 'react'
import React from "react";
import Menu from "./items.json";
import MenuCard from "../MenuCard/MenuCard";
const page = () => {
return (
<div>page</div>
)
}
<main>
<MenuCard Menu={Menu} />
</main>
);
};
export default page
export default page;

View File

@ -15,7 +15,7 @@ const layout = ({ children }: { children: React.ReactNode }) => {
quality={100}
className="brightness-[20%] "
/>
<div className="flex flex-col w-full text-center xl:text-5xl xl:block text-white lg:text-2xl z-10 ">
<div className="flex flex-col w-full text-center xl:text-5xl xl:block text-white lg:text-2xl absolute">
<div className="p-6 ">
<p className="py-4">
<span className="">Menu</span>
@ -26,7 +26,42 @@ const layout = ({ children }: { children: React.ReactNode }) => {
<div className="flex flex-row justify-evenly pt-4">
<MenuLinks />
</div>
<div className="flex-grow w-full p-6 md:overflow-y-auto md:p-12">{children}</div>
<div className="flex flex-row items-center justify-evenly text-xl relative font-normal mt-4">
<span className="grid grid-rows-1 grid-cols-2">
Spicy-
<div className="relative w-1/2">
<Image
src="/red-chili-pepper.svg"
alt="chili pepper spice"
fill
style={{
objectFit: "contain",
}}
quality={100}
className=""
/>
</div>
</span>
<span className="grid grid-cols-2">
Favorite-
<div className="relative w-1/3">
<Image
src="/star.svg"
alt="chili pepper spice"
fill
style={{
objectFit: "contain",
}}
quality={100}
className=""
/>
</div>
</span>
</div>
<div className="flex-grow w-full h-full p-6 md:overflow-y-auto md:px-14">
{children}
</div>
</div>
);
};

View File

@ -1,14 +1,20 @@
"use client";
import { Button } from "@/components/ui/button";
import React from "react";
import Link from "next/link";
const MenuButton = () => {
return (
<div>
<div className="right-2 hidden md:block">
<Button size="sm" className="xl:text-lg bg-zinc-900 hover:bg-slate-600">
<Button
size="sm"
className="xl:text-lg bg-zinc-900 hover:bg-slate-600"
>
<span className="flex flex-row px-3">
<span className="flex flex-row">VIEW MENU</span>
<span className="flex flex-row">
<Link href="/menu">VIEW MENU</Link>
</span>
</span>
</Button>
</div>

View File

@ -1,4 +1,3 @@
/* eslint-disable react/no-unescaped-entities */
import Link from "next/link";
import Image from "next/image";
import { EmblaCarousel } from "./carousel";
@ -6,7 +5,6 @@ import Reserve from "./components/NavBar/reserveButton";
import MenuButton from "./menuButton";
import "./home.css";
import GoogleMap from "@/components/Maps/MapComponent";
import { cn } from "../lib/utils";
export default function Home() {
return (
@ -23,7 +21,7 @@ export default function Home() {
className="brightness-[20%] -z-90"
/>
<div className="flex flex-col items-center justify-center text-white absolute w-full h-[95svh] gap-6">
{/* <center className="bg-gray-700 w-full">0</center> */}
{/* <center classNae="bg-gray-700 w-full">0</center> */}
<div className="flex w-full h-[24svh] relative">
<Image
src="/award01.png"
@ -36,7 +34,7 @@ export default function Home() {
/>
</div>
<p className="flex flex-col w-full justify-center px-[24svw] text-xl 2xl:px-[25svw] text-center py-[10px] leading-relaxed">
Jefe's Mexican Cocina Y Cantina serves the best Mexican food in
Jefe&apos;s Mexican Cocina Y Cantina serves the best Mexican food in
town. Be our guests and have an enjoyable experience with an
authentic Mexican meal right here in Broken Arrow, OK.
</p>
@ -57,7 +55,7 @@ export default function Home() {
</h2>
<div className="text-xl">
<p>
Jefe's Mexican cocina y cantina is a family owned authentic
Jefe&apos;s Mexican cocina y cantina is a family owned authentic
mexican restaurant that provides a variety of different dishes
and cocktails. We are one of the best restaurants around because
nowhere else can you find the most extraordinary homemade
@ -165,7 +163,7 @@ export default function Home() {
</h2>
<div className="w-[70%] md:w-[28svw]">
<p className="lg:text-xl text-base lg:font-normal font-semibold">
Jefe's is known for our amazing bar counter and attentive
Jefe&apos;s is known for our amazing bar counter and attentive
customer service. We want each and every one of our customers to
have a great time no matter the occasion. Because of our great
selection of alcoholic drinks, we know youll be more than happy
@ -220,10 +218,10 @@ export default function Home() {
</div>
<div className="w-[70%] md:w-[29svw]">
<p className="lg:text-xl text-base lg:font-normal font-semibold">
Jefe's is known for our amazing bar counter and attentive
Jefe&apos;s is known for our amazing bar counter and attentive
customer service. We want each and every one of our customers to
have a great time no matter the occasion. Because of our great
selection of alcoholic drinks, we know youll be more than happy
selection of alcoholic drinks, we know you&apos;ll be more than happy
with our beverages.
</p>
</div>
@ -285,7 +283,8 @@ export default function Home() {
</div>
<div className="w-full h-[80svh] bg-blue-300">
{/* <GoogleReviews /> */}
{/* <GoogleMap /> */}
<GoogleMap />
<div className="flex flex-col">Come Visit Us! We're located right off the 51!</div>
</div>
{/* <div className="flex flex-col w-full h-[180vh]">
<EmblaCarousel />

Binary file not shown.

View File

@ -20,7 +20,7 @@ const Footer = () => {
<div className="bg-stone-900 w-full items-center justify-center md:h-[25vh] flex sm:h-[50svh] overflow-hidden">
<div className=" w-[60%] flex flex-col md:flex-row text-white justify-evenly leading-relaxed items-center text-center mx-auto relative h-full">
<div className="w-full h-full flex flex-col items-center justify-evenly relative">
<div className="h-1/2 w-full relative">
<div className="h-1/2 w-full relative -mt-2">
{/* logo */}
<Link href="/" className="">
<Image
@ -28,6 +28,7 @@ const Footer = () => {
fill
style={{ objectFit: "contain", objectPosition: "center" }}
alt="Logo"
sizes="(max-width: 25px) 100vw, (max-width: 1200px) 50vw, 33vw"
quality={100}
/>
</Link>
@ -89,9 +90,12 @@ const Footer = () => {
</h2>
<div className="bg-red-800 h-0.5 w-[20%] "></div>
<div className="flex flex-row justify-evenly items-center text-white w-[60%] relative h-1/2">
<FaTiktok size={30} className="cursor-pointer" />
<AiOutlineInstagram size={30} className="cursor-pointer" />
<AiOutlineFacebook size={30} className="cursor-pointer" />
<a href="https://www.tiktok.com/@jefesbrokenarrow"><FaTiktok size={30} className="cursor-pointer" /></a>
<a href="https://www.instagram.com/jefesbrokenarrow/"><AiOutlineInstagram size={30} className="cursor-pointer" /></a>
<a href="https://www.facebook.com/jefesbrokenarrow"><AiOutlineFacebook size={30} className="cursor-pointer" /></a>
{/* Grub hub link https://www.grubhub.com/restaurant/jefes-mexican-cocina-y-cantina-24188-e-hwy-51-broken-arrow/2735039?pickup=true&rwg_token=AAh05qZCcKFQ2Z7gD1Zk8cKMX6nulMnyaXXy0WFPLpaVJpzOl7Hmg_7_21m5_lqd6Px-CeiFlA0OBrR9wjNyhFbJLOA6sURn_fdyCxIc6A4f4duiviHGfos%3D */}
{/* yelp link https://www.yelp.com/biz/jefes-mexican-cocina-and-cantina-broken-arrow */}
</div>
</div>
</div>

View File

@ -10,6 +10,7 @@
},
"dependencies": {
"@auth/drizzle-adapter": "^0.3.9",
"@plaiceholder/next": "^3.0.0",
"@planetscale/database": "^1.11.0",
"@radix-ui/react-slot": "^1.0.2",
"@react-google-maps/api": "^2.19.2",
@ -34,7 +35,7 @@
"react-hook-form": "^7.47.0",
"react-icons": "^4.11.0",
"react-simplemde-editor": "^5.2.0",
"sharp": "^0.32.6",
"sharp": "^0.33.2",
"tailwind-merge": "^2.0.0",
"tailwindcss-animate": "^1.0.7",
"tsx": "^4.6.1",

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

View File

@ -74,6 +74,10 @@ module.exports = {
"accordion-down": "accordion-down 0.2s ease-out",
"accordion-up": "accordion-up 0.2s ease-out",
},
screens: {
"tablet": "860px",
"desktop": "1080px",
},
},
},
plugins: [require("tailwindcss-animate")],

View File

@ -34,7 +34,7 @@
"**/*.ts",
"**/*.tsx",
".next/types/**/*.ts",
"../UnusedPages/AddToCart.tsx"
"build/types/**/*.ts"
],
"exclude": [
"node_modules"