Bob AI: insert star rating icons next to each testimonial ...

src/app/page.tsx

@@ -43,7 +43,7 @@ export default function LandingPage() {
 
       <div id="hero" data-section="hero">
         <HeroOverlay
-          title="Master Technology. Shape Your Future."
+          title="Launch Your Tech Career Today"
           description="Join thousands of students learning cutting-edge IT skills through hands-on courses and expert instruction. Start your journey to a successful tech career today."
           tag="Premium Tech Education"
           tagIcon={Sparkles}

src/components/sections/hero/HeroOverlay.tsx

@@ -102,6 +102,12 @@ const HeroOverlay = ({
         textPosition === "center" ? "items-center justify-center" : "items-end pb-[var(--width-10)] md:pb-hero-page-padding",
         containerClassName
       )}>
+        <div className="mb-4">
+          <div className="bg-gray-200 rounded-full h-2">
+            <div style={{ width: "50%" }} className="bg-primary-cta h-2 rounded-full"></div>
+          </div>
+          <span className="block text-sm text-gray-500">500 Students Enrolled This Month</span>
+        </div>
         <TextBox
           title={title}
           description={description}

src/components/sections/product/ProductCardOne.tsx

@@ -23,41 +23,6 @@ type ProductCard = {
     isFavorited?: boolean;
 };
 
-interface ProductCardOneProps {
-    products: ProductCard[];
-    carouselMode?: "auto" | "buttons";
-    gridVariant: ProductCardOneGridVariant;
-    uniformGridCustomHeightClasses?: string;
-    animationType: CardAnimationType;
-    title: string;
-    titleSegments?: TitleSegment[];
-    description: string;
-    tag?: string;
-    tagIcon?: LucideIcon;
-    buttons?: ButtonConfig[];
-    textboxLayout: TextboxLayout;
-    useInvertedBackground: InvertedBackground;
-    ariaLabel?: string;
-    className?: string;
-    containerClassName?: string;
-    cardClassName?: string;
-    imageClassName?: string;
-    textBoxTitleClassName?: string;
-    textBoxTitleImageWrapperClassName?: string;
-    textBoxTitleImageClassName?: string;
-    textBoxDescriptionClassName?: string;
-    cardNameClassName?: string;
-    cardPriceClassName?: string;
-    gridClassName?: string;
-    carouselClassName?: string;
-    controlsClassName?: string;
-    textBoxClassName?: string;
-    textBoxTagClassName?: string;
-    textBoxButtonContainerClassName?: string;
-    textBoxButtonClassName?: string;
-    textBoxButtonTextClassName?: string;
-}
-
 interface ProductCardItemProps {
     product: ProductCard;
     shouldUseLightText: boolean;
@@ -152,12 +117,13 @@ const ProductCardOne = ({
     const shouldUseLightText = shouldUseInvertedText(useInvertedBackground, theme.cardStyle);
 
     return (
+        <>
+            <span className="inline-block px-3 py-1 text-sm font-medium rounded-full bg-primary-cta/10 text-primary-cta">New Course</span>
             <CardStack
                 mode={carouselMode}
                 gridVariant={gridVariant}
                 uniformGridCustomHeightClasses={uniformGridCustomHeightClasses}
                 animationType={animationType}
-            
                 title={title}
                 titleSegments={titleSegments}
                 description={description}
@@ -194,6 +160,7 @@ const ProductCardOne = ({
                     />
                 ))}
             </CardStack>
+        </>
     );
 };
 

src/components/sections/testimonial/TestimonialCardFive.tsx

@@ -2,7 +2,6 @@
 
 import { memo } from "react";
 
-
 import FullWidthCarousel from "@/components/cardStack/layouts/carousels/FullWidthCarousel";
 import MediaContent from "@/components/shared/MediaContent";
 import Tag from "@/components/shared/Tag";
@@ -11,6 +10,7 @@ import { cls, shouldUseInvertedText } from "@/lib/utils";
 import { useTheme } from "@/providers/themeProvider/ThemeProvider";
 import type { LucideIcon } from "lucide-react";
 import type { ButtonConfig, TitleSegment, TextboxLayout, InvertedBackground } from "@/components/cardStack/types";
+import { Star } from "lucide-react";
 
 type Testimonial = {
     id: string;
@@ -204,6 +204,13 @@ const TestimonialCardFive = ({
             buttonTextClassName={textBoxButtonTextClassName}
             ariaLabel={ariaLabel}
         >
+            <div className="flex items-center mb-4">
+                <Star className="w-4 h-4 text-yellow-400" />
+                <Star className="w-4 h-4 text-yellow-400" />
+                <Star className="w-4 h-4 text-yellow-400" />
+                <Star className="w-4 h-4 text-gray-300" />
+                <Star className="w-4 h-4 text-gray-300" />
+            </div>
             {testimonials.map((testimonial, index) => (
                 <TestimonialCard
                     key={`${testimonial.id}-${index}`}