From 96bd1cf310f084ca0268a7b11fb04569cf3021af Mon Sep 17 00:00:00 2001
From: ImAlpha <arcjcb11@gmail.com>
Date: Thu, 9 Nov 2023 22:53:16 -0800
Subject: [PATCH] changes to hero section

---
 Websites/BankModern/bun.lockb                 | Bin 134633 -> 134633 bytes
 .../src/components/Navbar/Navbar.jsx          |   2 +-
 Websites/jefes-nextjs/app/about-us/page.tsx   |  43 ++++++++----------
 .../app/components/NavBar/NavBar.css          |   1 +
 .../app/components/NavBar/NavBar.tsx          |  20 ++++----
 .../app/components/NavBar/reserveButton.tsx   |  21 ++++-----
 Websites/jefes-nextjs/app/layout.tsx          |   8 ++--
 Websites/jefes-nextjs/app/menu/layout.tsx     |  14 +++++-
 8 files changed, 55 insertions(+), 54 deletions(-)

diff --git a/Websites/BankModern/bun.lockb b/Websites/BankModern/bun.lockb
index a3e058874986a8b2ebf14e1a472c7dd53fd89e31..d8a9288a0259a4bdad58dc358719017f19f147d3 100755
GIT binary patch
delta 794
zcmaDko8#qdjtv!`C$AB;n0(~3$mHdsDw7|GvIvxAmZUNO!DmJW25tt1hRF*>ML-gh
zMZSnkUJ6tUVyAr30J5zoZxA)WgEbjhCL1aXv$6n<W0_nirjJK0vN>RfOfLBWvJYkl
zC&Uduk;Rbpz}OIVOMVej2UE`rHn-&uF7=XN`I5i5<aNRFTmFFp&=Spm{9w5y|B>~|
zg2bk}Fd~b=+%k|fE682b|FAI<6R|Ldf&*uI2q)M#;FK}Fh7)K4W>6^e0Fx8L=@<qE
zQAnDy2Zj~I&L><10|Ojr(@S_5MW)~3Wz<0nW|(VWG|P4lKE~}qoQ!dX26`rXhGx@G
rBrsMgGR9c|dB%neeL$ChQnuHRlR2#K7l&{##u@7Y;r66N#`ZM;5NsjS

delta 3406
zcmeHKF-rq66n?3-w6)3&sT?|p&c#`9>EPt1C@vz^dc&1N#XC!#A~?8-5Nd`liY|gf
zQBi+_;^H6B$)yN7v_luGNqg5`iym$9&c(pXCEw-vUcQ%?<O;c9As5VNih-Hix5M3e
zdK?|3nGuWv^sG2c^F=)I1OO3$ousCYr*r@x@26Em;SVSxfIj|Cv|BMMm1K%b*ffbI
zN-?77D_g3z3XeUF4?V=lUlE(Uq$ZVzGj5(R=~8~b2rw_=X@yR-EweCdjD4IPBkc}!
zX&l+Hd*c#`0|#lA&~s-NY-!hN?3~o1i)EQ6%DC0YrlPNFX$3BDE#JlFk<@iXPXZJM
z0mA0y;Sxr?AaUR@^WCM{IS@m25hh8C)I$E0YN%r2Jq<UuV7D;h1&ISkE#KXmoda=I
z{*+3*liG4dgjmrvb<N=6C1U{nW{TB84>7*q*}U<P*yJ6p$>2atH$G%)eBdrkqWOwU
zuPV4rljzZ>Oiw@Y4<=>fNX||n{BOUifyBxI6l*=6+~_C1JMt#^dK7o)*LeWR%*Spq
zmI<L4I|w1%d9`%C0Kkvk`emNq-{D~qAZo)z?sSK-=P(*#FJbPQTb0B%B1mRNgme6E
w6=w%w<iCjwpv&2iPlzB2yGx+$(Rz2EL*j>Lx_qzozMsqm%{MnI%V_WX3nu2%p#T5?

diff --git a/Websites/BankModern/src/components/Navbar/Navbar.jsx b/Websites/BankModern/src/components/Navbar/Navbar.jsx
index a094974..7e8f61d 100644
--- a/Websites/BankModern/src/components/Navbar/Navbar.jsx
+++ b/Websites/BankModern/src/components/Navbar/Navbar.jsx
@@ -57,4 +57,4 @@ const Navbar = () => {
   );
 };
 
-export default Navbar;
\ No newline at end of file
+export default Navbar;
diff --git a/Websites/jefes-nextjs/app/about-us/page.tsx b/Websites/jefes-nextjs/app/about-us/page.tsx
index 7e0ad2e..a42e3cb 100644
--- a/Websites/jefes-nextjs/app/about-us/page.tsx
+++ b/Websites/jefes-nextjs/app/about-us/page.tsx
@@ -3,41 +3,34 @@ import Image from "next/image";
 
 const AboutUs = () => {
   return (
-    <div className="">
-      <div className="flex items-center justify-center text-center text-4xl hidden xl:block text-secondary">
+    <div className="flex flex-col pt-20">
+      <Image
+        src="/header02.webp"
+        alt="nav image"
+        priority
+        fill
+        style={{ objectFit: "cover", objectPosition: "75%" }}
+        quality={100}
+        className="brightness-[25%]"
+      />
+      <div className="flex items-center pt-4 justify-center text-center text-4xl hidden xl:block text-white lg:pt-4 lg:text-2xl">
         About Us
       </div>
-      <div className="flex items-center justify-center p-4  text-center text-2xl block xl:hidden text-secondary">
-        About Us
-      </div>
-      <div className="flex items-center justify-center p-4  text-center text-4xl hidden xl:block text-secondary">
+      <div className="flex items-center justify-center p-4  text-center text-4xl hidden xl:block text-white lg:h-16 lg:text-2xl">
         Jefe's Mexican Cantina & Cocina
       </div>
-      <div className="flex items-center justify-center h-16 p-4  text-center text-2xl block xl:hidden text-secondary">
-        Jefe's Mexican Cantina & Cocina
-      </div>
-      <div className="flex mb-5 mx-auto max-w-xl relative items-center justify-center">
+      <div className="flex relative mb-5 mx-auto max-w-xl relative items-center justify-center">
         <Image
           src="/kevin.webp"
-          width={0}
-          height={0}
-          sizes="100vw"
-          style={{ width: "60%", height: "auto" }}
+          fill
+          style={{ objectFit: "contain" }}
+          quality={100}
           alt="Photo of Kevin mobile."
-          className="block xl:hidden"
+          className=""
         />
       </div>
       <div className="flex gap-8 mx-auto relative max-w-screen-xl text-xl font-serif antialiased">
-        <Image
-          src="/kevin.webp"
-          width={0}
-          height={0}
-          sizes="100vw"
-          style={{ width: "100%", height: "auto" }}
-          alt="Photo of Kevin."
-          className="hidden xl:block p-4"
-        />
-        <div className="space-y-6">
+        <div className="space-y-6 text-white p-20">
           <p>
             My name is Kevin Aguilar, and I am the owner and manager of the
             Jefe's Mexican Cantina and Cocina based in Broken Arrow, Oklahoma.
diff --git a/Websites/jefes-nextjs/app/components/NavBar/NavBar.css b/Websites/jefes-nextjs/app/components/NavBar/NavBar.css
index b5d233e..9799072 100644
--- a/Websites/jefes-nextjs/app/components/NavBar/NavBar.css
+++ b/Websites/jefes-nextjs/app/components/NavBar/NavBar.css
@@ -5,4 +5,5 @@
 }
 .logo{
     margin: 0 auto;
+    align-items: center;
 }
\ No newline at end of file
diff --git a/Websites/jefes-nextjs/app/components/NavBar/NavBar.tsx b/Websites/jefes-nextjs/app/components/NavBar/NavBar.tsx
index 91d95f8..8b64e55 100644
--- a/Websites/jefes-nextjs/app/components/NavBar/NavBar.tsx
+++ b/Websites/jefes-nextjs/app/components/NavBar/NavBar.tsx
@@ -42,8 +42,8 @@ const NavBar = () => {
   return (
     <nav className="">
       {/* <center className="text-accent bg-black">O</center> */}
-      <div className="flex items-center justify-center p-2 mx-auto bg-red-800">
-        <ul className="hover:cursor-pointer hidden md:block space-x-4 text-xl font-sans antialiased">
+      <div className="flex items-center justify-center xl:p-1 mx-auto bg-transparent md:p-4 absolute z-10 w-full">
+        <ul className="hover:cursor-pointer hidden md:block space-x-4 xl:text-xl font-sans antialiased">
           {links.map((link) => (
             <Link
               key={link.href}
@@ -67,10 +67,10 @@ const NavBar = () => {
             src="/logo.svg"
             width={0}
             height={0}
-            sizes="200vw"
-            style={{ width: "50%", height: "auto" }}
+            sizes="100vw"
+            style={{ width: "40%", height: "auto" }}
             alt="Logo"
-            className="hidden md:block logo"
+            className="hidden xl:block logo"
           />
           <Image
             src="/logo.svg"
@@ -83,7 +83,7 @@ const NavBar = () => {
           />
         </Link>
 
-        <ul className="hover:cursor-pointer hidden md:block space-x-4 text-xl font-sans antialiased">
+        <ul className="hover:cursor-pointer hidden md:block space-x-4 xl:text-xl font-sans antialiased md:pl-4">
           {links2.map((link) => (
             <Link
               key={link.href}
@@ -101,11 +101,13 @@ const NavBar = () => {
             </Link>
           ))}
         </ul>
+
         {/* Reservation button */}
-        <div className="right-2 hidden xl:block absolute overflow-hidden">
+        <div className="right-2 hidden md:block absolute overflow-hidden">
           <Reserve />
         </div>
-        <div className="overflow-hidden">
+        {/* Header image */}
+        {/* <div className="overflow-hidden">
           <Image
             src="/header02.webp"
             alt="nav image"
@@ -121,7 +123,7 @@ const NavBar = () => {
             style={{ objectFit: "cover" }}
             className="block md:hidden nav_background"
           />
-        </div>
+        </div> */}
       </div>
       <div className={menu_open ? "hidden" : ""}>
         {" "}
diff --git a/Websites/jefes-nextjs/app/components/NavBar/reserveButton.tsx b/Websites/jefes-nextjs/app/components/NavBar/reserveButton.tsx
index 6dcbb0e..5e76471 100644
--- a/Websites/jefes-nextjs/app/components/NavBar/reserveButton.tsx
+++ b/Websites/jefes-nextjs/app/components/NavBar/reserveButton.tsx
@@ -6,29 +6,24 @@ import { Button } from "@/components/ui/button";
 const Reserve = () => {
   return (
     <div>
-      <div className="right-2 hidden xl:block">
-        <Button className="text-lg text-accent bg-red-800">
+      <div className="right-2 hidden md:block">
+        <Button className="xl:text-lg border bg-transparent">
           <span className="flex flex-row">
             <span className="flex flex-row">ORDER ONLINE</span>
           </span>
           <Image
             src="/fork.svg"
-            width={20}
-            height={20}
+            width={30}
+            height={30}
             alt="fork"
+            className="pl-2 xl:block hidden"
           />
-        </Button>
-      </div>
-      <div className="flex top-2 hidden md:block xl:hidden">
-        <Button className="btn btn-primary text-md text-accent">
-          <span className="">
-            <span className="">ORDER ONLINE</span>
-          </span>
           <Image
             src="/fork.svg"
-            width={10}
-            height={10}
+            width={25}
+            height={25}
             alt="fork"
+            className="pl-2 xl:hidden block"
           />
         </Button>
       </div>
diff --git a/Websites/jefes-nextjs/app/layout.tsx b/Websites/jefes-nextjs/app/layout.tsx
index fedd92d..ecd4089 100644
--- a/Websites/jefes-nextjs/app/layout.tsx
+++ b/Websites/jefes-nextjs/app/layout.tsx
@@ -19,16 +19,16 @@ export default function RootLayout({
   return (
     <html lang="en" data-theme="jefes">
       <body className={inter.className}>
-        <NavBar />
-        <Image
+        <NavBar/>
+        {/* <Image
             src="/PaintBackground1.webp"
             width={0}
             height={0}
             style={{ width: "100%", height: "auto" }}
             alt="Logo"
             className="hidden md:block absolute -z-10"
-          />
-        <main>{children}</main>
+          /> */}
+        <main className="">{children}</main>
       </body>
     </html>
   );
diff --git a/Websites/jefes-nextjs/app/menu/layout.tsx b/Websites/jefes-nextjs/app/menu/layout.tsx
index 72181b3..2f4279d 100644
--- a/Websites/jefes-nextjs/app/menu/layout.tsx
+++ b/Websites/jefes-nextjs/app/menu/layout.tsx
@@ -1,10 +1,20 @@
 import React from "react";
+import Image from "next/image";
 
 const layout = ({ children }: { children: React.ReactNode }) => {
   return (
-    <div className="flex flex-col w-full md:overflow-hidden bg-gray-700">
+    <section className="relative w-full min-h-screen md:h-screen flex md:block flex-col justify-center">
+      <Image
+            src="/header02.webp"
+            alt="nav image"
+            priority
+            fill
+            style={{ objectFit: "cover" , objectPosition: '75%'}}
+            quality={100}
+            className="brightness-[25%]"
+          />
       <div className="flex-grow p-6 md:overflow-y-auto md:p-12">{children}</div>
-    </div>
+    </section>
   );
 };