ImAlpha/Portfolio
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
ImAlpha 2024-01-25 23:46:27 -08:00
parent 4d76551577
commit c111271fe8
1 changed files with 23 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
Websites/jefes-nextjs/app/menu/Bar/page.tsx
View File

@ -4,16 +4,16 @@ import { Card, CardContent, CardHeader } from "@/components/ui/card";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import Menu from "./items.json"; import Menu from "./items.json";
import Image from "next/image"; import Image from "next/image";
import localFont from 'next/font/local'; import localFont from "next/font/local";
const interBold = localFont({ const interBold = localFont({
src: './Inter-Bold.woff', src: "./Inter-Bold.woff",
display: 'swap', display: "swap",
}) });
const extraBold = localFont({ const extraBold = localFont({
src: './Inter-ExtraBold.woff', src: "./Inter-ExtraBold.woff",
display: 'swap', display: "swap",
}) });
const Bar = () => { const Bar = () => {
let pic = "cover"; let pic = "cover";
@ -22,7 +22,10 @@ const Bar = () => {
<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"> <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) => { {Menu.map((menu_item) => {
return ( return (
<Card key={menu_item.id} className="flex-1 flex-col max-w-[325px] h-[452px] relative"> <Card
key={menu_item.id}
className="flex-1 flex-col max-w-[325px] h-[452px] relative"
>
<div className="w-full h-[55%]"> <div className="w-full h-[55%]">
<div className="h-full relative w-full"> <div className="h-full relative w-full">
<Image <Image
@ -58,23 +61,25 @@ const Bar = () => {
</div> </div>
{/* description text */} {/* description text */}
<div className="inline-block text-left pt-2"> <div className="inline-block text-left pt-2">
<p className={`max-w-[75ch] ${interBold.className} leading-tight font-[12px] text-[#D7D7D7]`}> <p
className={`max-w-[75ch] ${interBold.className} leading-tight font-[12px] text-[#D7D7D7]`}
>
{menu_item.description} {menu_item.description}
</p> </p>
</div> </div>
</div> </div>
</div> </div>
{/* cart addon */} {/* cart addon */}
<div className="flex flex-row bottom-0 absolute m-2"> <div className="flex flex-row bottom-0 absolute m-2">
<div className="flex flex-row"> <div className="flex flex-row">
<strong>{`$${menu_item.price}`}</strong> <strong>{`$${menu_item.price}`}</strong>
</div> </div>
<div className="flex w-1/2 relative"> <div className="flex w-1/2 relative">
<div className="flex w-3 h-full items-end justify-end"> <div className="flex w-3 h-full items-end justify-end">
<div className=""></div> <div className=""></div>
</div>
</div> </div>
</div> </div>
</div>
</Card> </Card>
); );
})} })}