Bob AI (stub): Make the nav bar glassmorphic

Merge version_5_1780459584649 into main

src/pages/HomePage.tsx

@@ -12,6 +12,9 @@ import MetricsSection from './HomePage/sections/Metrics';
 import FaqSection from './HomePage/sections/Faq';
 import ContactSection from './HomePage/sections/Contact';
 
+
+{/* webild-stub @2026-06-03T04:09:03.687Z: Make the nav bar glassmorphic */}
+
 export default function HomePage(): React.JSX.Element {
   return (
     <>

src/pages/HomePage/sections/Contact.tsx

@@ -4,23 +4,71 @@
 import React from 'react';
 import ContactCta from '@/components/sections/contact/ContactCta';
 import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+import Tag from "@/components/ui/Tag";
 
 export default function ContactSection(): React.JSX.Element {
   return (
-    <div id="contact" data-section="contact">
+    <div id="contact" data-webild-section="contact" className="py-24 bg-background">
       <SectionErrorBoundary name="contact">
-              <ContactCta
-          tag="Connect With Us"
-          text="Ready for your perfect cup or want to learn more? Visit Joes Coffee and experience the difference, or reach out to our friendly team."
-          primaryButton={{
-            text: "Get Directions",
-            href: "https://www.google.com/maps/search/joes+coffee",
-          }}
-          secondaryButton={{
-            text: "Call Us Now",
-            href: "tel:+1234567890",
-          }}
+        <div className="container mx-auto px-4 max-w-3xl">
+          <div className="text-center mb-12">
+            <Tag text="Get in Touch" className="mb-4" />
+            <h2 className="text-4xl md:text-5xl font-bold tracking-tight text-foreground mb-4">Contact Us</h2>
+            <p className="text-lg text-muted-foreground">
+              Have a question or want to learn more? Fill out the form below and our team will get back to you as soon as possible.
+            </p>
+          </div>
+          
+          <form className="space-y-6 bg-card p-8 rounded-2xl border border-border shadow-sm" onSubmit={(e) => e.preventDefault()}>
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+              <div className="space-y-2">
+                <label htmlFor="firstName" className="text-sm font-medium text-foreground">First Name</label>
+                <input 
+                  type="text" 
+                  id="firstName" 
+                  className="w-full px-4 py-3 rounded-lg border border-border bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-foreground/20 transition-colors"
+                  placeholder="John"
                 />
+              </div>
+              <div className="space-y-2">
+                <label htmlFor="lastName" className="text-sm font-medium text-foreground">Last Name</label>
+                <input 
+                  type="text" 
+                  id="lastName" 
+                  className="w-full px-4 py-3 rounded-lg border border-border bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-foreground/20 transition-colors"
+                  placeholder="Doe"
+                />
+              </div>
+            </div>
+            
+            <div className="space-y-2">
+              <label htmlFor="email" className="text-sm font-medium text-foreground">Email Address</label>
+              <input 
+                type="email" 
+                id="email" 
+                className="w-full px-4 py-3 rounded-lg border border-border bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-foreground/20 transition-colors"
+                placeholder="john@example.com"
+              />
+            </div>
+            
+            <div className="space-y-2">
+              <label htmlFor="message" className="text-sm font-medium text-foreground">Message</label>
+              <textarea 
+                id="message" 
+                rows={5}
+                className="w-full px-4 py-3 rounded-lg border border-border bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-foreground/20 transition-colors resize-none"
+                placeholder="How can we help you?"
+              ></textarea>
+            </div>
+            
+            <button 
+              type="submit"
+              className="w-full py-4 px-6 rounded-full bg-foreground text-background font-medium hover:opacity-90 transition-opacity"
+            >
+              Send Message
+            </button>
+          </form>
+        </div>
       </SectionErrorBoundary>
     </div>
   );

src/pages/HomePage/sections/Menu.tsx

@@ -5,11 +5,13 @@ import React from 'react';
 import Tag from "@/components/ui/Tag";
 import ScrollReveal from "@/components/ui/ScrollReveal";
 import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+import ImageOrVideo from "@/components/ui/ImageOrVideo";
+import Button from "@/components/ui/Button";
 
 export default function MenuSection(): React.JSX.Element {
   return (
     <div id="menu" data-webild-section="menu" className="py-24 bg-background">
-  <div className="container mx-auto px-4 max-w-4xl">
+      <div className="container mx-auto px-4 max-w-6xl">
         <div className="text-center mb-16">
           <Tag text="Our Menu" className="mb-4" />
           <h2 className="text-4xl md:text-5xl font-bold text-foreground mb-6">Crafted for You</h2>
@@ -18,25 +20,31 @@ export default function MenuSection(): React.JSX.Element {
           </p>
         </div>
         
-    <div className="grid grid-cols-1 md:grid-cols-2 gap-x-12 gap-y-8">
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
           {[
-        { name: "Classic Espresso", description: "Rich, concentrated shot of pure coffee essence.", price: "$3.00" },
-        { name: "Vanilla Bean Latte", description: "Smooth espresso blended with steamed milk and real vanilla bean syrup.", price: "$4.50" },
-        { name: "Caramel Macchiato", description: "Steamed milk with vanilla-flavored syrup, marked with espresso and caramel drizzle.", price: "$4.75" },
-        { name: "Mocha Frappuccino", description: "Coffee blended with mocha sauce, milk, and ice, topped with whipped cream.", price: "$5.00" },
-        { name: "Nitro Cold Brew", description: "Our signature cold brew infused with nitrogen for a sweet flavor and velvety crema.", price: "$4.25" },
-        { name: "Iced Americano", description: "Espresso shots topped with cold water produce a light layer of crema, then served over ice.", price: "$3.50" },
-        { name: "Matcha Green Tea Latte", description: "Smooth and creamy matcha lightly sweetened and served with steamed milk.", price: "$4.50" },
-        { name: "Chai Tea Latte", description: "Black tea infused with cinnamon, clove, and other warming spices, combined with steamed milk.", price: "$4.25" },
-        { name: "Artisan Butter Croissant", description: "Flaky, buttery, and baked fresh daily.", price: "$3.25" },
-        { name: "Blueberry Muffin", description: "Moist muffin bursting with fresh blueberries and topped with a crumbly streusel.", price: "$3.50" }
+            { name: "Classic Espresso", description: "Rich, concentrated shot of pure coffee essence.", price: "$3.00", imageSrc: "https://images.unsplash.com/photo-1510591509098-f4fdc6d0ff04?auto=format&fit=crop&q=80&w=800" },
+            { name: "Vanilla Bean Latte", description: "Smooth espresso blended with steamed milk and real vanilla bean syrup.", price: "$4.50", imageSrc: "https://images.unsplash.com/photo-1572442388796-11668a67e53d?auto=format&fit=crop&q=80&w=800" },
+            { name: "Caramel Macchiato", description: "Steamed milk with vanilla-flavored syrup, marked with espresso and caramel drizzle.", price: "$4.75", imageSrc: "https://images.unsplash.com/photo-1485808191679-5f86510681a2?auto=format&fit=crop&q=80&w=800" },
+            { name: "Mocha Frappuccino", description: "Coffee blended with mocha sauce, milk, and ice, topped with whipped cream.", price: "$5.00", imageSrc: "https://images.unsplash.com/photo-1572490122747-3968b75cc699?auto=format&fit=crop&q=80&w=800" },
+            { name: "Nitro Cold Brew", description: "Our signature cold brew infused with nitrogen for a sweet flavor and velvety crema.", price: "$4.25", imageSrc: "https://images.unsplash.com/photo-1461023058943-07fcbe16d735?auto=format&fit=crop&q=80&w=800" },
+            { name: "Iced Americano", description: "Espresso shots topped with cold water produce a light layer of crema, then served over ice.", price: "$3.50", imageSrc: "https://images.unsplash.com/photo-1517701550927-30cf4ba1dba5?auto=format&fit=crop&q=80&w=800" },
+            { name: "Matcha Green Tea Latte", description: "Smooth and creamy matcha lightly sweetened and served with steamed milk.", price: "$4.50", imageSrc: "https://images.unsplash.com/photo-1536514072410-5019a3c69182?auto=format&fit=crop&q=80&w=800" },
+            { name: "Chai Tea Latte", description: "Black tea infused with cinnamon, clove, and other warming spices, combined with steamed milk.", price: "$4.25", imageSrc: "https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?auto=format&fit=crop&q=80&w=800" },
+            { name: "Artisan Butter Croissant", description: "Flaky, buttery, and baked fresh daily.", price: "$3.25", imageSrc: "https://images.unsplash.com/photo-1555507036-ab1f4038808a?auto=format&fit=crop&q=80&w=800" },
+            { name: "Blueberry Muffin", description: "Moist muffin bursting with fresh blueberries and topped with a crumbly streusel.", price: "$3.50", imageSrc: "https://images.unsplash.com/photo-1607958996333-41aef7caefaa?auto=format&fit=crop&q=80&w=800" }
           ].map((item, index) => (
-        <ScrollReveal key={index} variant="slide-up" className="flex flex-col border-b border-border pb-4">
-          <div className="flex justify-between items-baseline mb-2">
-            <h3 className="text-xl font-semibold text-foreground">{item.name}</h3>
-            <span className="text-lg font-medium text-foreground">{item.price}</span>
+            <ScrollReveal key={index} variant="slide-up" className="flex flex-col bg-card rounded-xl overflow-hidden border border-border">
+              <div className="h-48 w-full relative">
+                <ImageOrVideo imageSrc={item.imageSrc} className="w-full h-full object-cover" />
+              </div>
+              <div className="p-6 flex flex-col flex-grow">
+                <div className="flex justify-between items-start mb-2">
+                  <h3 className="text-xl font-semibold text-foreground pr-4">{item.name}</h3>
+                  <span className="text-lg font-bold text-foreground whitespace-nowrap">{item.price}</span>
+                </div>
+                <p className="text-muted-foreground text-sm mb-6 flex-grow">{item.description}</p>
+                <Button text="Purchase" variant="primary" className="w-full justify-center" />
               </div>
-          <p className="text-muted-foreground text-sm">{item.description}</p>
             </ScrollReveal>
           ))}
         </div>

src/pages/HomePage/sections/Testimonials.tsx

@@ -15,34 +15,34 @@ export default function TestimonialsSection(): React.JSX.Element {
           description="Don't just take our word for it – hear from our beloved patrons about their experiences and why Joes Coffee is their favorite spot."
           testimonials={[
             {
-              name: "Sarah J.",
-              role: "Local Artist",
+              name: "Mark Jenkins",
+              role: "Local Artist, Seattle",
               quote: "Joes Coffee is my daily escape. The latte art is always beautiful, and the cozy atmosphere inspires my work. It's truly a hidden gem!",
-              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-smiling-curly-redhead-bearded-man-tasting-coffee-cup_171337-9999.jpg",
+              imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?auto=format&fit=crop&q=80&w=800",
             },
             {
-              name: "Michael L.",
-              role: "Small Business Owner",
+              name: "Sarah Lawson",
+              role: "Small Business Owner, Portland",
               quote: "The best coffee in town, hands down. I appreciate the quality and consistency, and the staff are always incredibly welcoming. My go-to spot for meetings.",
-              imageSrc: "http://img.b2bpic.net/free-photo/pretty-dreaming-young-woman-sitting-cafe-table_171337-17088.jpg",
+              imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?auto=format&fit=crop&q=80&w=800",
             },
             {
-              name: "Emily R.",
-              role: "Student",
+              name: "Emily Roberts",
+              role: "Graduate Student, Austin",
               quote: "I love coming here to study. The quiet corners and endless coffee keep me going. Plus, their sandwiches are amazing when I need a break!",
-              imageSrc: "http://img.b2bpic.net/free-photo/carefree-friends_1098-15889.jpg",
+              imageSrc: "https://images.unsplash.com/photo-1534528741775-53994a69daeb?auto=format&fit=crop&q=80&w=800",
             },
             {
-              name: "David K.",
-              role: "Neighborhood Resident",
+              name: "David Kim",
+              role: "Software Engineer, Chicago",
               quote: "It feels like home here. The baristas know my order, and there's always a friendly face. Joes Coffee is more than just a cafe; it's a community.",
-              imageSrc: "http://img.b2bpic.net/free-photo/people-drinking-coffee-spacious-cafeteria_23-2150423990.jpg",
+              imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?auto=format&fit=crop&q=80&w=800",
             },
             {
-              name: "Olivia M.",
-              role: "Food Blogger",
+              name: "Olivia Martinez",
+              role: "Food Blogger, New York",
               quote: "From the first sip to the last bite of their pastries, Joes Coffee consistently delivers excellence. A must-visit for any coffee enthusiast!",
-              imageSrc: "http://img.b2bpic.net/free-photo/lovely-asian-woman-with-ponytail-dressed-red-oversized-sweater-sits-co-working-space-takes-notes-notebook_197531-16913.jpg",
+              imageSrc: "https://images.unsplash.com/photo-1517841905240-472988babdf9?auto=format&fit=crop&q=80&w=800",
             },
           ]}
         />