kevos-attire/frontend/src/app/page.tsx

56 lines
1.8 KiB
TypeScript

"use client";
import * as React from "react";
import Image from "next/image";
import MenuCard from "../components/ui/MenuCard/MenuCard";
import Product from "../../public/batch1/files_list.json";
import { Button } from "../components/ui/button";
import Modal from "../components/Modal/Modal";
import ClientPortal from "@/components/ClientPortal/ClientPortal";
import styles from "@/styles/Home.module.css";
import { Poppins } from "next/font/google";
const Popp = Poppins({ weight: "400", subsets: ["latin"] });
export default function Home() {
const [isOpen, setIsOpen] = React.useState(false);
const [showPortal, setShowPortal] = React.useState(false);
const handleModal = () => {
setShowPortal(!showPortal);
};
return (
<main className="flex min-h-screen flex-col px-20 bg-[#F5F5F5">
{/* Title */}
<div className="text-4xl w-full justify-center text-center items-center flex flex-col gap-4 py-12 font-medium text-orange-600">
<span className={`${Popp.className}`}>Kevo&#39;s Attire</span>
<div className={`${Popp.className} text-orange-600 text-center`}>All sizes - $25</div>
</div>
{/* Body */}
<div className="w-full h-content">
<MenuCard Menu={Product} />
</div>
{/* <div>
<Button onClick={() => setIsOpen(true)}>Open Modal</Button>
<Modal open={isOpen} onClose={() => setIsOpen(false)}>
Fancy Modal
</Modal>
</div> */}
{/* Footer */}
<div className="flex w-full h-[250px] items-center text-gray-400">
<div className="font-bold ">
Email us at&nbsp;
<a href="mailto:kevosattire@gmail.com" className="text-emerald-500">
kevosattire@gmail.com
</a>
&nbsp;to order!
</div>
<div></div>
</div>
</main>
);
}