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

changed numbers and card text layout

Browse Source
This commit is contained in:
Jacob Delgado 2024-08-14 11:57:10 -07:00
parent c1e317c73d
commit 5a2af4ef1c
3 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/public/batch1/files_list.json
View File

@ -15,7 +15,7 @@
"photo": "batch1/Mockup 134.jpg",
"price": 25,
"size": "Youth-S/M/L/2XL | Adult-S/M/L/2XL",
"inStock": "yes",
"inStock": "no",
"favorite": "no",
"description": "It's not an option.."
},

1
frontend/src/app/page.tsx
View File

@ -11,6 +11,7 @@ import { Poppins } from "next/font/google";
const Popp = Poppins({ weight: "400", subsets: ["latin"] });
// improve to drag & drop side cart for more fun
export default function Home() {
const [isOpen, setIsOpen] = React.useState(false);

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

@ -43,20 +43,21 @@ const MenuCard = ({ Menu }: any) => {
</div>
<div className="m-[8px] space-y-[4px]">
{/* title and description of item */}
<div className="flex flex-col w-full font-sans">
<div className="flex flex-col w-full font-sans text-center">
{/* title and photo */}
<div className="inline-block">
<div className="flex flex-col items-center justify-center text-start">
<h4
className={`pt-2 float-left ${Popp.className} flex-wrap w-3/4 text-emerald-500`}
className={`pt-2 float-left ${Popp.className} flex-wrap w-3/4 text-[#EEEEEE]`}
>
<strong>{menu_item.name}</strong>
<strong>{menu_item.id}</strong>
</h4>
<div className="right-4 absolute h-[25px] flex flex-row w-1/4 mt-2 text-orange-500">
<div className="right-2 absolute h-[25px] flex flex-row w-1/4 mt-2 text-[#7B9922]">
{menu_item.inStock === "yes" ? (
<span>In Stock!</span>
) : (
<span>Out of 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"
@ -76,13 +77,13 @@ const MenuCard = ({ Menu }: any) => {
</div>
</div>
{/* description text */}
<div className="inline-block text-left pt-2">
{/* <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>
</Card>