testing shadcn card
This commit is contained in:
ImAlpha
parent
e374a047de
commit
25b04fad35
@ -57,31 +57,33 @@ const AboutUs = () => {
|
||||
Jefes Mexican Cantina & Cocina
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
My name is Kevin Aguilar, and I am the owner and manager of the
|
||||
Jefes Mexican Cantina and Cocina based in Broken Arrow, Oklahoma.
|
||||
Our combination of authentic Mexican dishes, excellent customer
|
||||
service, and family-friendly environment makes us one of the best
|
||||
Mexican restaurants around.
|
||||
</p>
|
||||
<div className="text-xl max-w-[75ch] space-y-4">
|
||||
<p>
|
||||
My name is Kevin Aguilar, and I am the owner and manager of the
|
||||
Jefes Mexican Cantina and Cocina based in Broken Arrow,
|
||||
Oklahoma. Our combination of authentic Mexican dishes, excellent
|
||||
customer service, and family-friendly environment makes us one
|
||||
of the best Mexican restaurants around.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
Whether you are wanting to book our upstairs venue for an event,
|
||||
wanting to try out our creative alcoholic drinks or just wanting
|
||||
to enjoy a meal with a loved one, you quickly see why so many
|
||||
people choose Jefes. We take pride in our business as one of the
|
||||
highest rated Mexican restaurants in Broken Arrow.
|
||||
</p>
|
||||
<p>
|
||||
Whether you are wanting to book our upstairs venue for an event,
|
||||
wanting to try out our creative alcoholic drinks or just wanting
|
||||
to enjoy a meal with a loved one, you quickly see why so many
|
||||
people choose Jefes. We take pride in our business as one of the
|
||||
highest rated Mexican restaurants in Broken Arrow.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
We just wanted to take a moment to express our heartfelt gratitude
|
||||
to all of our loyal customers. Your continued support and loyalty
|
||||
means the world to us, and it is because of you that we are able
|
||||
to continue doing what we love. Thank you for choosing our
|
||||
restaurant and for allowing us to serve you. We promise to always
|
||||
strive for excellence and to bring you the best dining experience
|
||||
possible. Thank you again!
|
||||
</p>
|
||||
<p>
|
||||
We just wanted to take a moment to express our heartfelt
|
||||
gratitude to all of our loyal customers. Your continued support
|
||||
and loyalty means the world to us, and it is because of you that
|
||||
we are able to continue doing what we love. Thank you for
|
||||
choosing our restaurant and for allowing us to serve you. We
|
||||
promise to always strive for excellence and to bring you the
|
||||
best dining experience possible. Thank you again!
|
||||
</p>
|
||||
</div>
|
||||
<div className="mx-auto flex items-center justify-center w-full pb-6">
|
||||
<Image
|
||||
src="/award.jpg"
|
||||
|
||||
@ -2,3 +2,6 @@
|
||||
z-index: -1;
|
||||
filter: brightness(.19);
|
||||
}
|
||||
.par{
|
||||
text-wrap: pretty;
|
||||
}
|
||||
@ -5,6 +5,7 @@ import NavBar from "./components/NavBar/NavBar";
|
||||
import Image from "next/image";
|
||||
import Footer from "@/components/Footer/footer";
|
||||
import localFont from 'next/font/local';
|
||||
import './layout.css'
|
||||
|
||||
const inter = Inter({ subsets: ["latin"] });
|
||||
const robleAlt = localFont({
|
||||
@ -24,7 +25,7 @@ export default function RootLayout({
|
||||
}) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body className={robleAlt.className}>
|
||||
<body className={`${robleAlt.className} par`}>
|
||||
<NavBar />
|
||||
{/* <Image
|
||||
src="/PaintBackground1.webp"
|
||||
|
||||
@ -45,7 +45,7 @@ const Appetizers = () => {
|
||||
<h4 className="">
|
||||
<strong>{menu_item.name}</strong>
|
||||
</h4>
|
||||
<p>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>
|
||||
|
||||
42
Websites/jefes-nextjs/app/menu/Bar/items.json
Normal file
42
Websites/jefes-nextjs/app/menu/Bar/items.json
Normal file
@ -0,0 +1,42 @@
|
||||
[
|
||||
{
|
||||
"id": 1,
|
||||
"name": "Caguamas",
|
||||
"photo": "Bar/32ozCaguamas.jpeg",
|
||||
"price": 14,
|
||||
"size": "32oz",
|
||||
"description": "A drink."
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"name": "Jefes Tower",
|
||||
"photo": "Bar/100ozTower.jpeg",
|
||||
"price": 35,
|
||||
"size": "100oz",
|
||||
"description": "A tower full of Corona."
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"name": "Chambong",
|
||||
"photo": "Bar/chambong.jpeg",
|
||||
"price": 18,
|
||||
"size": "36oz",
|
||||
"description": "El Chambong."
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"name": "La Mera Mera Margarita",
|
||||
"photo": "Bar/laMeraMera56ozMargarita.jpeg",
|
||||
"price": 20,
|
||||
"size": "56oz",
|
||||
"description": "The special margarita."
|
||||
},
|
||||
{
|
||||
"id": 5,
|
||||
"name": "Michelada",
|
||||
"photo": "Bar/Michelada.jpeg",
|
||||
"price": 13,
|
||||
"size": "24oz",
|
||||
"description": "Corona with tamarindo."
|
||||
}
|
||||
]
|
||||
86
Websites/jefes-nextjs/app/menu/Bar/page.tsx
Normal file
86
Websites/jefes-nextjs/app/menu/Bar/page.tsx
Normal file
@ -0,0 +1,86 @@
|
||||
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";
|
||||
|
||||
const Bar = () => {
|
||||
return (
|
||||
<main>
|
||||
{/* Mapping out the menu
|
||||
<div className=" flex flex-wrap gap-8 pt-6 justify-between w-full">
|
||||
{Menu.map((menu_item) => {
|
||||
return (
|
||||
<div
|
||||
key={menu_item.id}
|
||||
className="flex flex-col flex-grow h-[452px] w-[325px] rounded-lg shadow-xl drop-shadow-xl"
|
||||
>
|
||||
<div className="h-[55%] relative w-full overflow-hidden">
|
||||
<Image
|
||||
src={`/${menu_item.photo}`}
|
||||
alt="chili pepper spice"
|
||||
fill
|
||||
style={{ objectFit: "cover", objectPosition: "center" }}
|
||||
quality={100}
|
||||
className="rounded-t-lg"
|
||||
/>
|
||||
</div>
|
||||
<h4 className="">
|
||||
<strong>{menu_item.name}</strong>
|
||||
</h4>
|
||||
<p className="max-w-[75ch]">
|
||||
Description: {menu_item.description}
|
||||
</p>
|
||||
<div className="flex flex-row justify-evenly">
|
||||
<div className=" flex flex-row">
|
||||
<span>{`$${menu_item.price}`}</span>
|
||||
</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>
|
||||
);
|
||||
})}
|
||||
</div> */}
|
||||
<div>
|
||||
{Menu.map((menu_item) => {
|
||||
return (
|
||||
<Card key={menu_item.id} className="flex flex-wrap gap-8 pt-6 justify-evenly w-full">
|
||||
<CardHeader className="h-[55%] relative w-full overflow-hidden">
|
||||
<Image
|
||||
src={`/${menu_item.photo}`}
|
||||
alt="chili pepper spice"
|
||||
fill
|
||||
style={{ objectFit: "cover", objectPosition: "center" }}
|
||||
quality={100}
|
||||
className="rounded-t-lg"
|
||||
/>
|
||||
</CardHeader>
|
||||
<h4 className="">
|
||||
<strong>{menu_item.name}</strong>
|
||||
</h4>
|
||||
<p className="max-w-[75ch]">
|
||||
Description: {menu_item.description}
|
||||
</p>
|
||||
<div className="flex flex-row justify-evenly">
|
||||
<div className=" flex flex-row">
|
||||
<span>{`$${menu_item.price}`}</span>
|
||||
</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>
|
||||
</main>
|
||||
);
|
||||
};
|
||||
|
||||
export default Bar;
|
||||
Loading…
Reference in New Issue
Block a user