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", "photo": "batch1/Mockup 134.jpg",
"price": 25, "price": 25,
"size": "Youth-S/M/L/2XL | Adult-S/M/L/2XL", "size": "Youth-S/M/L/2XL | Adult-S/M/L/2XL",
"inStock": "yes", "inStock": "no",
"favorite": "no", "favorite": "no",
"description": "It's not an option.." "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"] }); const Popp = Poppins({ weight: "400", subsets: ["latin"] });
// improve to drag & drop side cart for more fun
export default function Home() { export default function Home() {
const [isOpen, setIsOpen] = React.useState(false); 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>
<div className="m-[8px] space-y-[4px]"> <div className="m-[8px] space-y-[4px]">
{/* title and description of item */} {/* 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 */} {/* title and photo */}
<div className="inline-block"> <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-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> </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" ? ( {menu_item.inStock === "yes" ? (
<span>In Stock!</span> <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" ? ( {menu_item.favorite === "yes" ? (
<Image <Image
src="/star.svg" src="/star.svg"
@ -76,13 +77,13 @@ const MenuCard = ({ Menu }: any) => {
</div> </div>
</div> </div>
{/* description text */} {/* description text */}
<div className="inline-block text-left pt-2"> {/* <div className="inline-block text-left pt-2">
<p <p
className={`max-w-[75ch] ${Popp.className} leading-tight font-[12px] text-blue-400 `} className={`max-w-[75ch] ${Popp.className} leading-tight font-[12px] text-blue-400 `}
> >
{menu_item.description} {menu_item.description}
</p> </p>
</div> </div> */}
</div> </div>
</div> </div>
</Card> </Card>