ImAlpha/kevos-attire
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

working api with external url

Browse Source
This commit is contained in:
Jacob Delgado 2024-11-21 22:43:14 -08:00
parent 96f1917f8f
commit eb1a21828a
2 changed files with 9 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/app/products/page.tsx
View File

@ -41,7 +41,7 @@ const Products = () => {
return ( return (
<div className="products"> <div className="products flex items-center justify-center sm:items-none sm:justify-none">
{/* <div className="left"> {/* <div className="left">
<div className="filterItem"> <div className="filterItem">
<h2>Product Categories</h2> <h2>Product Categories</h2>

45
frontend/src/components/ui/MenuCard/MenuCard.tsx
View File

@ -25,14 +25,14 @@ const MenuCard = ({ Menu }: any) => {
const router = useRouter(); const router = useRouter();
return ( return (
<div className="grid qhd:grid-cols-5 desktop:grid-cols-4 tablet:grid-cols-3 md:grid-cols-2 grid-cols-1 grid-flow-row gap-y-6 md:gap-x-6 "> <div className="grid qhd:grid-cols-5 desktop:grid-cols-4 tablet:grid-cols-3 md:grid-cols-2 grid-cols-1 grid-auto-rows-max gap-y-6 md:gap-x-6 justify-center w-full">
{Menu.map((menu_item: any) => { {Menu.map((menu_item: any) => {
return ( return (
<Card <Card
key={menu_item.id} key={menu_item.id}
className="flex-1 flex-col max-w-[325px] h-[400px] relative overflow-hidden bg-white/10 border-none transition hover:z-50 backdrop-blur-xl" className="flex-1 flex-col w-[325px] h-[400px] relative overflow-hidden bg-white/10 border-none transition hover:z-50 backdrop-blur-xl mx-auto"
> >
<div className="w-full h-[75%]"> <div className="w-full h-[80%] flex justify-center items-center">
<div className="h-full relative w-full"> <div className="h-full relative w-full">
{/* Flask */} {/* Flask */}
{/* <Image {/* <Image
@ -58,49 +58,20 @@ const MenuCard = ({ Menu }: any) => {
/> />
</div> </div>
</div> </div>
<div className="m-[8px] space-y-[4px]"> <div className="mt-[20px] space-y-[4px] bg-black/20 h-full">
{/* title and description of item */} {/* title and description of item */}
<div className="flex flex-col w-full font-sans text-center"> <div className="flex flex-col w-full font-sans text-center text-lg">
{/* title and photo */} {/* title and photo */}
<div className="flex flex-col items-center justify-center text-start"> <div className="flex flex-col items-center justify-center text-start">
<h4 <h4
className={`pt-2 float-left ${Popp.className} flex-wrap w-3/4 text-[#EEEEEE]`} className={`pt-2 float-left ${Popp.className} flex-wrap w-3/4 text-[#EEEEEE]`}
> >
<span>{menu_item.description}</span> <span>{menu_item.title}</span>
</h4> </h4>
<div className="right-2 absolute h-[25px] flex flex-row w-1/4 mt-2 text-[#7B9922]"> <div className="right-2 absolute h-[25px] flex flex-row w-1/4 mt-2 text-[#7B9922] font-bold">
{menu_item.inStock === "yes" ? ( ${menu_item.price}
<span>In Stock!</span>
) : (
<span className="text-orange-600">Out of Stock</span>
)}
{/* Check if item is a favorite */}
{/* {menu_item.favorite === "yes" ? (
<Image
src="/star.svg"
alt="jefe's star"
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>
</div> </div>
{/* description text */}
{/* <div className="inline-block text-left pt-2">
<p
className={`max-w-[75ch] ${Popp.className} leading-tight font-[12px] text-blue-400 `}
>
{menu_item.description}
</p>
</div> */}
</div> </div>
</div> </div>
</Card> </Card>