about page finished, heroes updated

Websites/jefes-nextjs/app/about-us/page.tsx

@@ -1,53 +1,74 @@
+/* eslint no-use-before-define: 0 */
 import React from "react";
 import Image from "next/image";
 
 const AboutUs = () => {
   return (
-    <div className="flex flex-col pt-20">
+    <div className="flex flex-col relative justify-center items-center ">
-      <Image
+      <div className="flex relative -z-10 pt-40 w-[100vw] h-[400px] overflow-hidden">
-        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-4xl hidden xl:block text-white lg:h-16 lg:text-2xl">
-        Jefe's Mexican Cantina & Cocina
-      </div>
-      <div className="flex relative mb-5 mx-auto max-w-xl relative items-center justify-center">
         <Image
-          src="/kevin.webp"
+          src="/IMG_2431.jpg"
+          alt="nav image"
+          priority
           fill
-          style={{ objectFit: "contain" }}
+          style={{ objectFit: "cover", objectPosition: "center" }}
           quality={100}
-          alt="Photo of Kevin mobile."
+          className="brightness-[20%] "
-          className=""
         />
+        <div className="flex flex-col w-full text-center xl:text-5xl xl:block text-white lg:text-2xl z-10">
+          <div className="p-6 ">
+            <p className="py-4">
+              <span className="">About Us</span>
+            </p>
+          </div>
+        </div>
       </div>
-      <div className="flex gap-8 mx-auto relative max-w-screen-xl text-xl font-serif antialiased">
+
-        <div className="space-y-6 text-white p-20">
+      <div className="flex flex-col items-center text-xl font-serif antialiased ">
-          <p>
+        <div className="flex flex-row space-y-6 text-black pt-10 pl-28 pr-32 bg-paintbg w-full">
-            My name is Kevin Aguilar, and I am the owner and manager of the
+          <div className="flex flex-col relative aspect-square container mr-20">
-            Jefe's Mexican Cantina and Cocina based in Broken Arrow, Oklahoma.
+            <Image
-            Our combination of authentic Mexican dishes, excellent customer
+              src="/kevin.webp"
-            service, and family-friendly environment makes us one of the best
+              fill
-            Mexican restaurants around.
+              style={{ objectFit: "contain" }}
-          </p>
+              quality={100}
-          <div>
+              alt="Photo of Kevin mobile."
+              className=""
+            />
+          </div>
+
+          <div className="flex flex-col space-y-6">
+            <div className="flex flex-row">
+              <div className="flex ">
+                <Image
+                  src="/mexican-flag.svg"
+                  alt="nav image"
+                  width={40}
+                  height={10}
+                  quality={100}
+                  className="brightness-[100%] mr-4"
+                />
+              </div>
+              <div className="flex text-4xl font-bold">
+                Jefes Mexican Cantina & Cocina
+              </div>
+            </div>
+            <p>
+              My name is Kevin Aguilar, and I am the owner and manager of the
+              Jefes Mexican Cantina and Cocina based in Broken Arrow, Oklahoma.
+              Our combination of authentic Mexican dishes, excellent customer
+              service, and family-friendly environment makes us one of the best
+              Mexican restaurants around.
+            </p>
+
             <p>
               Whether you are wanting to book our upstairs venue for an event,
               wanting to try out our creative alcoholic drinks or just wanting
               to enjoy a meal with a loved one, you quickly see why so many
-              people choose Jefe's. We take pride in our business as one of the
+              people choose Jefes. We take pride in our business as one of the
               highest rated Mexican restaurants in Broken Arrow.
             </p>
-          </div>
+
-          <div>
             <p>
               We just wanted to take a moment to express our heartfelt gratitude
               to all of our loyal customers. Your continued support and loyalty
@@ -57,19 +78,19 @@ const AboutUs = () => {
               strive for excellence and to bring you the best dining experience
               possible. Thank you again!
             </p>
+            <div className="mx-auto flex items-center justify-center w-full">
+              <Image
+                src="/award.jpg"
+                width={0}
+                height={0}
+                sizes="20vw"
+                style={{ width: "20%", height: "auto" }}
+                alt="Photo of award."
+              />
+            </div>
           </div>
         </div>
       </div>
-      <div className="mx-auto flex items-center justify-center top-2">
-        <Image
-          src="/award.jpg"
-          width={0}
-          height={0}
-          sizes="20vw"
-          style={{ width: "10%", height: "auto" }}
-          alt="Photo of award."
-        />
-      </div>
     </div>
   );
 };

Websites/jefes-nextjs/app/components/NavBar/NavBar.tsx

@@ -106,27 +106,10 @@ const NavBar = () => {
         <div className="right-2 hidden md:block absolute overflow-hidden">
           <Reserve />
         </div>
-        {/* Header image */}
-        {/* <div className="overflow-hidden">
-          <Image
-            src="/header02.webp"
-            alt="nav image"
-            fill
-            style={{ objectFit: "cover" }}
-            quality={100}
-            className="hidden md:block nav_background"
-          />
-          <Image
-            src="/header02.webp"
-            alt="nav image"
-            fill
-            style={{ objectFit: "cover" }}
-            className="block md:hidden nav_background"
-          />
-        </div> */}
       </div>
+
+      
       <div className={menu_open ? "hidden" : ""}>
-        {" "}
         <div
           onClick={handleNav}
           className="md:hidden cursor-pointer pl-24 text-white top-3 right-3 absolute"

Websites/jefes-nextjs/app/gallery/carousel.css

@@ -3,9 +3,12 @@
   }
   .embla__container {
     display: flex;
+    height: 1080px;
   }
   .embla__slide {
     flex: 0 0 100%;
     min-width: 0;
+    height: 800px;
+    position: relative;
   }
   

Websites/jefes-nextjs/app/gallery/carousel.tsx

@@ -2,46 +2,43 @@
 import React from "react";
 import useEmblaCarousel from "embla-carousel-react";
 import Image from "next/image";
-import './carousel.css';
+import "./carousel.css";
 import Autoplay from "embla-carousel-autoplay";
-import AutoHeight from 'embla-carousel-auto-height'
+import AutoHeight from "embla-carousel-auto-height";
 
 export const EmblaCarousel = () => {
-  const [emblaRef] = useEmblaCarousel({loop: false}, [Autoplay(), AutoHeight()]);
+  const [emblaRef] = useEmblaCarousel({ loop: false }, [Autoplay()]);
 
   return (
     <div className="embla" ref={emblaRef}>
-      <div className="embla__container">
+      <div className="embla__container w-full">
-        <div className="embla__slide">
+        <div className="embla__slide relative w-full">
           <Image
             src="/img01.webp"
             alt="/"
-            width={0}
+            fill
-            height={0}
+            style={{ objectFit: "cover", objectPosition: 'center' }} // optional
-            sizes="100vw"
+            quality={100}
-            style={{ width: "100%", height: "auto" }} // optional
           />
         </div>
-        <div className="embla__slide">
+        <div className="embla__slide relative w-full">
           {" "}
           <Image
             src="/IMG_2431.jpg"
             alt="/"
-            width={0}
+            fill
-            height={0}
+            style={{ objectFit: "cover", objectPosition: 'center' }} // optional
-            sizes="100vw"
+            quality={100}
-            style={{ width: "100%", height: "auto" }} // optional
           />
         </div>
-        <div className="embla__slide">
+        <div className="embla__slide relative w-full">
           {" "}
           <Image
             src="/images/bar01.jpg"
             alt="/"
-            width={0}
+            fill
-            height={0}
+            style={{ objectFit: "cover", objectPosition: 'center' }} // optional
-            sizes="100vw"
+            quality={100}
-            style={{ width: "100%", height: "auto" }} // optional
           />
         </div>
       </div>

Websites/jefes-nextjs/app/gallery/page.tsx

@@ -3,12 +3,32 @@ import { useState } from "react";
 import { BsChevronCompactLeft, BsChevronCompactRight } from "react-icons/bs";
 import { RxDotFilled } from "react-icons/rx";
 import { EmblaCarousel } from "./carousel";
+import Image from "next/image";
 
 const Gallery = () => {
-
   return (
-    <div className="">
+    <div className="flex flex-col relative ">
-      <EmblaCarousel />
+      <div className="flex relative -z-10 pt-40 w-[100vw] h-[400px] overflow-hidden">
+        <Image
+          src="/IMG_2431.jpg"
+          alt="nav image"
+          priority
+          fill
+          style={{ objectFit: "cover", objectPosition: "center" }}
+          quality={100}
+          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="p-6 ">
+            <p className="py-4">
+              <span className="">GALLERY</span>
+            </p>
+          </div>
+        </div>
+      </div>
+      <div className="">
+        <EmblaCarousel />
+      </div>
     </div>
   );
 };

Websites/jefes-nextjs/app/globals.css

@@ -33,6 +33,8 @@
     --ring: 222.2 84% 4.9%;
  
     --radius: 0.5rem;
+    --jefesred: "#B3121E",
+    --jefesblack: "#18191a",
   }
  
   .dark {

Websites/jefes-nextjs/package.json

@@ -28,6 +28,7 @@
     "react-hook-form": "^7.47.0",
     "react-icons": "^4.11.0",
     "react-simplemde-editor": "^5.2.0",
+    "sharp": "^0.32.6",
     "tailwind-merge": "^2.0.0",
     "tailwindcss-animate": "^1.0.7",
     "zod": "^3.22.4"

Websites/jefes-nextjs/prisma/seed.ts

@@ -1,51 +1,51 @@
-import { PrismaClient } from "@prisma/client";
+// import { PrismaClient } from "@prisma/client";
-const prisma = new PrismaClient();
+// const prisma = new PrismaClient();
-async function main() {
+// async function main() {
-  const alice = await prisma.user.upsert({
+//   const alice = await prisma.user.upsert({
-    where: { email: "alice@prisma.io" },
+//     where: { email: "alice@prisma.io" },
-    update: {},
+//     update: {},
-    create: {
+//     create: {
-      email: "alice@prisma.io",
+//       email: "alice@prisma.io",
-      name: "Alice",
+//       name: "Alice",
-      posts: {
+//       posts: {
-        create: {
+//         create: {
-          title: "Check out Prisma with Next.js",
+//           title: "Check out Prisma with Next.js",
-          content: "https://www.prisma.io/nextjs",
+//           content: "https://www.prisma.io/nextjs",
-          published: true,
+//           published: true,
-        },
+//         },
-      },
+//       },
-    },
+//     },
-  });
+//   });
-  const bob = await prisma.user.upsert({
+//   const bob = await prisma.user.upsert({
-    where: { email: "bob@prisma.io" },
+//     where: { email: "bob@prisma.io" },
-    update: {},
+//     update: {},
-    create: {
+//     create: {
-      email: "bob@prisma.io",
+//       email: "bob@prisma.io",
-      name: "Bob",
+//       name: "Bob",
-      posts: {
+//       posts: {
-        create: [
+//         create: [
-          {
+//           {
-            title: "Follow Prisma on Twitter",
+//             title: "Follow Prisma on Twitter",
-            content: "https://twitter.com/prisma",
+//             content: "https://twitter.com/prisma",
-            published: true,
+//             published: true,
-          },
+//           },
-          {
+//           {
-            title: "Follow Nexus on Twitter",
+//             title: "Follow Nexus on Twitter",
-            content: "https://twitter.com/nexusgql",
+//             content: "https://twitter.com/nexusgql",
-            published: true,
+//             published: true,
-          },
+//           },
-        ],
+//         ],
-      },
+//       },
-    },
+//     },
-  });
+//   });
-  console.log({ alice, bob });
+//   console.log({ alice, bob });
-}
+// }
-main()
+// main()
-  .then(async () => {
+//   .then(async () => {
-    await prisma.$disconnect();
+//     await prisma.$disconnect();
-  })
+//   })
-  .catch(async (e) => {
+//   .catch(async (e) => {
-    console.error(e);
+//     console.error(e);
-    await prisma.$disconnect();
+//     await prisma.$disconnect();
-    process.exit(1);
+//     process.exit(1);
-  });
+//   });

Websites/jefes-nextjs/public/mexican-flag.py

@@ -0,0 +1,76 @@
+import os 
+import shutil
+import time
+import re
+
+EXCLUDE_FILE = 'LNFolders.py'
+
+def create_dir(path, volume):
+    if not os.path.exists(volume):
+            os.mkdir(volume)
+
+
+def move_files(target_path, file, volume):
+    shutil.move(file, volume) # (src, dst)
+
+
+# def main():
+#     while True:
+#         # Get current directory and set it as the target path
+#         cwd = os.getcwd()
+#         target_path = os.path.join(cwd)
+
+#         # Set up the number of files originally for automation
+#         number_of_files = len(os.listdir(cwd))
+#         time.sleep(20)
+#         old_number = number_of_files
+#         number_of_files = len(os.listdir(cwd))
+
+#         # If new files detected, organize them
+#         if number_of_files != old_number:
+#             # Get all file volensions present in the directory
+#             volensions = {item.split('.')[-1] for item in os.listdir(target_path) 
+#             if os.path.isfile(os.path.join(target_path, item))}
+#             # print(volensions)
+
+#             # Create a folder for volension types
+#             create_dir(target_path, volensions)
+
+#             # Move the files into the folder
+#             move_files(target_path)
+
+def main():
+    # Get current directory and set it as the target path
+    cwd = os.getcwd()
+    target_path = os.path.join(cwd)
+
+    # Get all file volumes present in the directory
+    # volumes = {item.split('.')[-1] for item in os.listdir(target_path) 
+    # if os.path.isfile(os.path.join(target_path, item))}
+    # print(volensions)
+
+    # Test string 
+    # test_string = "MKnR 01    -(t)- Enrollment (I).epub"
+    # Strip until title and volume number are separate
+    for item in os.listdir(target_path):
+        if item != EXCLUDE_FILE:
+            volume_number = re.sub(r'\D', '', item)
+            volume_title = re.sub(r'\d', '', item)
+            volume_title = volume_title.split(')-')
+            volume_title = volume_title[1].split('.')
+            volume_title = volume_title[0]
+            # print(volume_number)
+            # print(volume_title)
+            volume = 'Volume ' + volume_number + volume_title
+            print(volume)
+            # if os.path.isfile(os.path.join(target_path, item))
+        
+
+
+    # Create a folder for volumes
+            create_dir(target_path, volume)
+
+    # Move the files into the folder
+            move_files(target_path, item, volume)
+
+main()

Websites/jefes-nextjs/public/mexican-flag.svg

@@ -0,0 +1 @@
+<svg height="512" width="512" xmlns="http://www.w3.org/2000/svg"><path d="M22.5 22.5h30v482h-30z" fill="#b0b0b0"/><path d="M52.5 7.5h-30v30h30c8.284 0 15-6.716 15-15s-6.716-15-15-15z" fill="#ffce53"/><circle cx="22.5" cy="22.5" fill="#ffe373" r="15"/><path d="M504.5 187.5v272h-30l-60-136 60-136z" fill="#de2318"/><path d="M238.17 97.5l60 136-60 136H82.5v-272z" fill="#22783c"/><path d="M474.5 187.5v272H363.83l-60-136 60-136z" fill="#ff2e23"/><path d="M333.83 187.5v-45c0-24.75-20.25-45-45-45h-29.997l45 301.845L348.83 437V202.5z" fill="#fff7d6"/><path d="M258.833 97.5H238.17v272h30l35.663 29.845V142.5c0-24.75-20.25-45-45-45z" fill="#fff"/><path d="M311.33 369.5h-43.16V437h65.66v-45c0-12.43-10.07-22.5-22.5-22.5z" fill="#ffe373"/><path d="M363.83 187.5v272h-73.16c-12.43 0-22.5-10.07-22.5-22.5s10.07-22.5 22.5-22.5h20.66c12.43 0 22.5-10.07 22.5-22.5V187.5z" fill="#fff"/><path d="M504.5 180H341.333v-37.5c0-28.949-23.551-52.5-52.5-52.5H89.245C86.255 75.328 74.672 63.745 60 60.755V43.71c8.729-3.096 15-11.432 15-21.21C75 10.093 64.907 0 52.5 0h-30C10.093 0 0 10.093 0 22.5c0 9.778 6.271 18.114 15 21.21V504.5a7.5 7.5 0 007.5 7.5h30a7.5 7.5 0 007.5-7.5v-98.255c14.672-2.99 26.255-14.573 29.245-29.245h171.421v60c0 16.542 13.458 30 30 30H504.5a7.5 7.5 0 007.5-7.5v-272a7.5 7.5 0 00-7.5-7.5zM22.5 15h30c4.136 0 7.5 3.364 7.5 7.5S56.636 30 52.5 30h-30c-4.136 0-7.5-3.364-7.5-7.5s3.364-7.5 7.5-7.5zM30 497V45h15v452zm45-127.5c0 9.778-6.271 18.114-15 21.21V76.29c8.729 3.096 15 11.432 15 21.21zm251.333-227v223.536a29.8 29.8 0 00-15-4.036h-65.667V157.5a7.5 7.5 0 00-15 0V362H90V105h140.667v22.5a7.5 7.5 0 0015 0V105h43.167c20.677 0 37.499 16.822 37.499 37.5zm-15 234.5c8.271 0 15 6.729 15 15s-6.729 15-15 15h-20.667a29.81 29.81 0 00-15 4.036V377zm-35.666 60c0-8.271 6.729-15 15-15h20.667c16.542 0 30-13.458 30-30V195h15v257h-65.667c-8.271 0-15-6.729-15-15zM497 452H371.333V195H497z"/></svg>

Websites/jefes-nextjs/tailwind.config.js

@@ -1,76 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-  darkMode: ["class"],
-  content: [
-    './pages/**/*.{ts,tsx}',
-    './components/**/*.{ts,tsx}',
-    './app/**/*.{ts,tsx}',
-    './src/**/*.{ts,tsx}',
-	],
-  theme: {
-    container: {
-      center: true,
-      padding: "2rem",
-      screens: {
-        "2xl": "1400px",
-      },
-    },
-    extend: {
-      colors: {
-        border: "hsl(var(--border))",
-        input: "hsl(var(--input))",
-        ring: "hsl(var(--ring))",
-        background: "hsl(var(--background))",
-        foreground: "hsl(var(--foreground))",
-        primary: {
-          DEFAULT: "hsl(var(--primary))",
-          foreground: "hsl(var(--primary-foreground))",
-        },
-        secondary: {
-          DEFAULT: "hsl(var(--secondary))",
-          foreground: "hsl(var(--secondary-foreground))",
-        },
-        destructive: {
-          DEFAULT: "hsl(var(--destructive))",
-          foreground: "hsl(var(--destructive-foreground))",
-        },
-        muted: {
-          DEFAULT: "hsl(var(--muted))",
-          foreground: "hsl(var(--muted-foreground))",
-        },
-        accent: {
-          DEFAULT: "hsl(var(--accent))",
-          foreground: "hsl(var(--accent-foreground))",
-        },
-        popover: {
-          DEFAULT: "hsl(var(--popover))",
-          foreground: "hsl(var(--popover-foreground))",
-        },
-        card: {
-          DEFAULT: "hsl(var(--card))",
-          foreground: "hsl(var(--card-foreground))",
-        },
-      },
-      borderRadius: {
-        lg: "var(--radius)",
-        md: "calc(var(--radius) - 2px)",
-        sm: "calc(var(--radius) - 4px)",
-      },
-      keyframes: {
-        "accordion-down": {
-          from: { height: 0 },
-          to: { height: "var(--radix-accordion-content-height)" },
-        },
-        "accordion-up": {
-          from: { height: "var(--radix-accordion-content-height)" },
-          to: { height: 0 },
-        },
-      },
-      animation: {
-        "accordion-down": "accordion-down 0.2s ease-out",
-        "accordion-up": "accordion-up 0.2s ease-out",
-      },
-    },
-  },
-  plugins: [require("tailwindcss-animate")],
-}

Websites/jefes-nextjs/tailwind.config.ts

@@ -16,13 +16,13 @@ module.exports = {
       },
     },
     extend: {
+      backgroundImage: { paintbg: "url('/PaintBackground1.webp')" },
       colors: {
         border: "hsl(var(--border))",
         input: "hsl(var(--input))",
         ring: "hsl(var(--ring))",
         background: "hsl(var(--background))",
         foreground: "hsl(var(--foreground))",
-        jefesRed: "#B3121E",
         primary: {
           DEFAULT: "hsl(var(--primary))",
           foreground: "hsl(var(--primary-foreground))",