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

update cards

Browse Source
This commit is contained in:
ImAlpha 2024-01-24 23:41:19 -08:00
parent fb8dd85dbf
commit ff7b0d7f47
5 changed files with 17 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Websites/jefes-nextjs/app/components/NavBar/NavBar.tsx
View File

@ -30,7 +30,7 @@ const NavBar = () => {
const links = [ const links = [
{ label: "HOME", href: "/" }, { label: "HOME", href: "/" },
{ label: "MENU", href: "/menu" }, { label: "MENU", href: "/menu" },
{ label: "GALLERY", href: "/gallery" }, // { label: "GALLERY", href: "/gallery" },
{ label: "ABOUT", href: "/about-us" }, { label: "ABOUT", href: "/about-us" },
{ label: "CONTACT", href: "/contact" }, { label: "CONTACT", href: "/contact" },
]; ];

2
Websites/jefes-nextjs/app/gallery/page.tsx
View File

@ -54,7 +54,7 @@ const Gallery = () => {
quality={100} quality={100}
className="brightness-[20%] " className="brightness-[20%] "
/> />
<div className="flex flex-col w-full text-center xl:text-5xl xl:block text-white lg:text-2xl z-10"> <div className="flex flex-col w-full text-center xl:text-5xl xl:block text-white lg:text-2xl absolute">
<div className="p-6 "> <div className="p-6 ">
<p className="py-4"> <p className="py-4">
<span className="">GALLERY</span> <span className="">GALLERY</span>

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

@ -10,15 +10,19 @@ const interBold = localFont({
src: './Inter-Bold.woff', src: './Inter-Bold.woff',
display: 'swap', display: 'swap',
}) })
const extraBold = localFont({
src: './Inter-ExtraBold.woff',
display: 'swap',
})
const Bar = () => { const Bar = () => {
let pic = "cover"; let pic = "cover";
return ( return (
<main> <main>
<div className="grid lg:grid-cols-5 md:grid-cols-2 grid-flow-row gap-8"> <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 flex-grow flex-col w-[325px] h-[452px]"> <Card key={menu_item.id} className="flex-1 flex-col max-w-[325px] h-[452px]">
<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
@ -36,7 +40,7 @@ const Bar = () => {
<div className="flex flex-col w-full font-sans"> <div className="flex flex-col w-full font-sans">
{/* title and photo */} {/* title and photo */}
<div className="inline-block"> <div className="inline-block">
<h4 className={`pt-2 float-left ${interBold.className}`}> <h4 className={`pt-2 float-left ${extraBold.className}`}>
<strong>{menu_item.name}</strong> <strong>{menu_item.name}</strong>
</h4> </h4>
{/* <div className="bg-red-300 float-right relative w-[25px] h-[25px]"> {/* <div className="bg-red-300 float-right relative w-[25px] h-[25px]">
@ -52,13 +56,9 @@ const Bar = () => {
/> />
</div> */} </div> */}
</div> </div>
{/* paragraph text */} {/* description text */}
<div className="inline-block text-left"> <div className="inline-block text-left">
<p className={`max-w-[75ch] ${interBold.className} font-semibold`}> <p className={`max-w-[75ch] ${interBold.className} leading-tight font-light`}>
{menu_item.description}
</p>
{/* 16px line height */}
<p className="leading-4 text-[#8F8F8F]">
{menu_item.description} {menu_item.description}
</p> </p>
</div> </div>

4
Websites/jefes-nextjs/app/menu/layout.tsx
View File

@ -15,7 +15,7 @@ const layout = ({ children }: { children: React.ReactNode }) => {
quality={100} quality={100}
className="brightness-[20%] " className="brightness-[20%] "
/> />
<div className="flex flex-col w-full text-center xl:text-5xl xl:block text-white lg:text-2xl z-10 "> <div className="flex flex-col w-full text-center xl:text-5xl xl:block text-white lg:text-2xl absolute">
<div className="p-6 "> <div className="p-6 ">
<p className="py-4"> <p className="py-4">
<span className="">Menu</span> <span className="">Menu</span>
@ -26,7 +26,7 @@ const layout = ({ children }: { children: React.ReactNode }) => {
<div className="flex flex-row justify-evenly pt-4"> <div className="flex flex-row justify-evenly pt-4">
<MenuLinks /> <MenuLinks />
</div> </div>
<div className="flex-grow w-full p-6 md:overflow-y-auto md:p-12">{children}</div> <div className="flex-grow w-full h-full p-6 md:overflow-y-auto md:p-12">{children}</div>
</div> </div>
); );
}; };

4
Websites/jefes-nextjs/tailwind.config.ts
View File

@ -74,6 +74,10 @@ module.exports = {
"accordion-down": "accordion-down 0.2s ease-out", "accordion-down": "accordion-down 0.2s ease-out",
"accordion-up": "accordion-up 0.2s ease-out", "accordion-up": "accordion-up 0.2s ease-out",
}, },
screens: {
"tablet": "860px",
"desktop": "1080px",
},
}, },
}, },
plugins: [require("tailwindcss-animate")], plugins: [require("tailwindcss-animate")],