From 2d98c8e41949d70092bdb535708b0fd098585709 Mon Sep 17 00:00:00 2001
From: kudindmitriy <kudin.dima@gmail.com>
Date: Mon, 20 Apr 2026 23:48:40 +0300
Subject: [PATCH] Bob AI: to each section add glassmorphic badge with random
 funny fac

---
 src/components/sections/about/AboutMediaOverlay.tsx          | 3 +++
 src/components/sections/contact/ContactSplitForm.tsx         | 3 +++
 src/components/sections/faq/FaqSplitMedia.tsx                | 3 +++
 src/components/sections/features/FeaturesMediaCards.tsx      | 3 +++
 src/components/sections/footer/FooterBasic.tsx               | 3 +++
 src/components/sections/hero/HeroBrand.tsx                   | 3 +++
 src/components/sections/metrics/MetricsGradientCards.tsx     | 3 +++
 src/components/sections/social-proof/SocialProofMarquee.tsx  | 3 +++
 .../sections/testimonial/TestimonialQuoteCards.tsx           | 3 +++
 src/components/ui/NavbarCentered.tsx                         | 5 ++++-
 10 files changed, 31 insertions(+), 1 deletion(-)

diff --git a/src/components/sections/about/AboutMediaOverlay.tsx b/src/components/sections/about/AboutMediaOverlay.tsx
index fb57149..b5eb57e 100644
--- a/src/components/sections/about/AboutMediaOverlay.tsx
+++ b/src/components/sections/about/AboutMediaOverlay.tsx
@@ -30,6 +30,9 @@ const AboutMediaOverlay = ({
 
         <div className="relative z-10 flex items-center justify-center px-5 py-10 mx-auto min-h-100 md:min-h-120 md:w-1/2 w-content-width">
           <div className="flex flex-col items-center gap-3 md:gap-1 text-center">
+            <div className="mb-2">
+              <div className="inline-block px-3 py-1 text-sm rounded-full bg-white/20 backdrop-blur-sm border border-white/30 text-foreground">We have a rubber duck for debugging. His name is Sir Quacks-A-Lot.</div>
+            </div>
             <motion.span
               initial={{ opacity: 0, y: 10 }}
               whileInView={{ opacity: 1, y: 0 }}
diff --git a/src/components/sections/contact/ContactSplitForm.tsx b/src/components/sections/contact/ContactSplitForm.tsx
index 65f8f45..8f97ec4 100644
--- a/src/components/sections/contact/ContactSplitForm.tsx
+++ b/src/components/sections/contact/ContactSplitForm.tsx
@@ -79,6 +79,9 @@ const ContactSplitForm = ({
           <div className="p-5 md:p-10 card rounded">
             <form onSubmit={handleSubmit} className="flex flex-col gap-5">
               <div className="flex flex-col items-center gap-1 text-center">
+                <div className="mb-2">
+                  <div className="inline-block px-3 py-1 text-sm rounded-full bg-card/20 backdrop-blur-sm border border-card/30 text-foreground">Our contact form is powered by a hamster on a wheel. Please be patient.</div>
+                </div>
                 <span className="card rounded px-3 py-1 text-sm">{tag}</span>
 
                 <TextAnimation
diff --git a/src/components/sections/faq/FaqSplitMedia.tsx b/src/components/sections/faq/FaqSplitMedia.tsx
index 88052ce..fbb1824 100644
--- a/src/components/sections/faq/FaqSplitMedia.tsx
+++ b/src/components/sections/faq/FaqSplitMedia.tsx
@@ -40,6 +40,9 @@ const FaqSplitMedia = ({
     <section aria-label="FAQ section" className="py-20">
       <div className="w-content-width mx-auto flex flex-col gap-8">
         <div className="flex flex-col items-center gap-3 md:gap-2">
+          <div className="mb-2">
+            <div className="inline-block px-3 py-1 text-sm rounded-full bg-card/20 backdrop-blur-sm border border-card/30 text-foreground">FAQ: Do you sleep? Answer: Rarely.</div>
+          </div>
           <span className="card rounded px-3 py-1 text-sm">{tag}</span>
 
           <TextAnimation
diff --git a/src/components/sections/features/FeaturesMediaCards.tsx b/src/components/sections/features/FeaturesMediaCards.tsx
index 105778c..e714709 100644
--- a/src/components/sections/features/FeaturesMediaCards.tsx
+++ b/src/components/sections/features/FeaturesMediaCards.tsx
@@ -30,6 +30,9 @@ const FeaturesMediaCards = ({
     <section aria-label="Features section" className="py-20">
       <div className="flex flex-col gap-8">
         <div className="flex flex-col items-center w-content-width mx-auto gap-3 md:gap-2">
+          <div className="mb-2">
+            <div className="inline-block px-3 py-1 text-sm rounded-full bg-card/20 backdrop-blur-sm border border-card/30 text-foreground">Our secret feature is a button that orders pizza. It's still in beta.</div>
+          </div>
           <span className="px-3 py-1 text-sm card rounded">{tag}</span>
 
           <TextAnimation
diff --git a/src/components/sections/footer/FooterBasic.tsx b/src/components/sections/footer/FooterBasic.tsx
index 6505663..e38555c 100644
--- a/src/components/sections/footer/FooterBasic.tsx
+++ b/src/components/sections/footer/FooterBasic.tsx
@@ -36,6 +36,9 @@ const FooterBasic = ({
   return (
     <footer aria-label="Site footer" className="w-full pt-20 pb-10">
       <div className="w-content-width mx-auto">
+        <div className="w-full flex justify-center mb-8">
+          <div className="inline-block px-3 py-1 text-sm rounded-full bg-card/20 backdrop-blur-sm border border-card/30 text-foreground">Made with ❤️ and too many energy drinks.</div>
+        </div>
         <div className="w-full flex flex-wrap justify-between gap-y-10 mb-10">
           {columns.map((column) => (
             <div key={column.title} className="w-1/2 md:w-auto flex flex-col items-start gap-3">
diff --git a/src/components/sections/hero/HeroBrand.tsx b/src/components/sections/hero/HeroBrand.tsx
index 2239e0f..5fc366e 100644
--- a/src/components/sections/hero/HeroBrand.tsx
+++ b/src/components/sections/hero/HeroBrand.tsx
@@ -36,6 +36,9 @@ const HeroBrand = ({
 
       <div className="relative z-10 w-content-width mx-auto pb-5">
         <div className="flex flex-col">
+          <div className="mb-4">
+            <div className="inline-block px-3 py-1 text-sm rounded-full bg-white/20 backdrop-blur-sm border border-white/30 text-primary-cta-text">Powered by caffeine and the occasional reboot.</div>
+          </div>
           <div className="w-full flex flex-col md:flex-row md:justify-between items-start md:items-end gap-3 md:gap-5">
             <TextAnimation
               text={description}
diff --git a/src/components/sections/metrics/MetricsGradientCards.tsx b/src/components/sections/metrics/MetricsGradientCards.tsx
index 4f1d27f..83f0b33 100644
--- a/src/components/sections/metrics/MetricsGradientCards.tsx
+++ b/src/components/sections/metrics/MetricsGradientCards.tsx
@@ -30,6 +30,9 @@ const MetricsGradientCards = ({
   <section aria-label="Metrics section" className="py-20">
     <div className="flex flex-col gap-8">
       <div className="flex flex-col items-center gap-3 md:gap-2 w-content-width mx-auto">
+        <div className="mb-2">
+          <div className="inline-block px-3 py-1 text-sm rounded-full bg-card/20 backdrop-blur-sm border border-card/30 text-foreground">Our uptime is 99.9%, but our coffee machine's is closer to 50%.</div>
+        </div>
         <span className="px-3 py-1 text-sm card rounded">{tag}</span>
 
         <TextAnimation
diff --git a/src/components/sections/social-proof/SocialProofMarquee.tsx b/src/components/sections/social-proof/SocialProofMarquee.tsx
index fc7fa01..b520184 100644
--- a/src/components/sections/social-proof/SocialProofMarquee.tsx
+++ b/src/components/sections/social-proof/SocialProofMarquee.tsx
@@ -21,6 +21,9 @@ const SocialProofMarquee = ({
     <section aria-label="Social proof section" className="py-20">
       <div className="flex flex-col gap-8">
         <div className="flex flex-col items-center gap-3 md:gap-2 w-content-width mx-auto">
+          <div className="mb-2">
+            <div className="inline-block px-3 py-1 text-sm rounded-full bg-card/20 backdrop-blur-sm border border-card/30 text-foreground">Even our CEO's mom thinks we're a big deal.</div>
+          </div>
           <span className="px-3 py-1 text-sm rounded card">{tag}</span>
 
           <TextAnimation
diff --git a/src/components/sections/testimonial/TestimonialQuoteCards.tsx b/src/components/sections/testimonial/TestimonialQuoteCards.tsx
index c24c7e6..2b32754 100644
--- a/src/components/sections/testimonial/TestimonialQuoteCards.tsx
+++ b/src/components/sections/testimonial/TestimonialQuoteCards.tsx
@@ -28,6 +28,9 @@ const TestimonialQuoteCards = ({
   <section aria-label="Testimonials section" className="py-20">
     <div className="flex flex-col gap-8">
       <div className="flex flex-col items-center gap-3 md:gap-2 w-content-width mx-auto">
+        <div className="mb-2">
+          <div className="inline-block px-3 py-1 text-sm rounded-full bg-card/20 backdrop-blur-sm border border-card/30 text-foreground">Our clients love us. We have the thank-you cards to prove it.</div>
+        </div>
         <span className="px-3 py-1 text-sm card rounded">{tag}</span>
 
         <TextAnimation
diff --git a/src/components/ui/NavbarCentered.tsx b/src/components/ui/NavbarCentered.tsx
index de8cb8c..bb49ab6 100644
--- a/src/components/ui/NavbarCentered.tsx
+++ b/src/components/ui/NavbarCentered.tsx
@@ -64,7 +64,10 @@ const NavbarCentered = ({ logo, navItems, ctaButton }: NavbarCenteredProps) => {
         )}
       >
         <div className="relative flex items-center justify-between h-full w-content-width mx-auto">
-          <Link to="/" className="text-xl font-medium text-foreground">{logo}</Link>
+          <div className="flex items-center gap-4">
+            <Link to="/" className="text-xl font-medium text-foreground">{logo}</Link>
+            <div className="hidden lg:block px-3 py-1 text-xs rounded-full bg-card/20 backdrop-blur-sm border border-card/30 text-foreground">Our office coffee is 90% caffeine, 10% existential dread.</div>
+          </div>
 
           <div className="hidden md:flex absolute left-1/2 items-center gap-6 -translate-x-1/2">
             {navItems.map((item) => (
-- 
2.49.1