bender/07a5981f-8a4e-46b4-858b-627cf75c99ce
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bob AI: Replace the existing hero section with the 'Hero Billboard C

Browse Source
This commit is contained in:
kudinDmitriyUp
2026-04-21 06:56:11 +00:00
parent 1ed2d109b1
commit 99218ea3ee
2 changed files with 11 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/App.tsx
View File

@@ -85,11 +85,6 @@ export default function App() {
imageSrc: "http://img.b2bpic.net/free-photo/top-view-plastic-box-with-leftover-cookie_23-2148666825.jpg?_wi=1",
},
]}
testimonials={[
{ name: "Sarah J.", review: "The Kimchi Carbonara is absolutely divine! A perfect blend of creamy and spicy. I could eat this every day." },
{ name: "Michael K.", review: "Incredible flavors and super fast delivery. SeoulPasta is my new go-to for takeout. The Gochujang Bolognese is a must-try." },
{ name: "Emily R.", review: "I was skeptical about Korean-Italian fusion, but I'm a convert! The Bulgogi Lasagna was rich, savory, and so unique." },
]}
/>
</div>

27
src/components/sections/hero/HeroBillboardCarousel.tsx
View File

@@ -3,8 +3,7 @@
import useEmblaCarousel from "embla-carousel-react";
import { useCarouselControls } from "@/hooks/useCarouselControls";
import Button from "@/components/ui/Button";
import TestimonialCard from "@/components/shared/TestimonialCard";
import { ChevronLeft, ChevronRight } from "lucide-react";
import { ChevronLeft, ChevronRight, Star } from "lucide-react";
type Slide = {
tag: string;
@@ -15,17 +14,11 @@ type Slide = {
imageSrc: string;
};
type Testimonial = {
name: string;
review: string;
};
type HeroBillboardCarouselProps = {
slides: Slide[];
testimonials: Testimonial[];
};
const HeroBillboardCarousel = ({ slides, testimonials }: HeroBillboardCarouselProps) => {
const HeroBillboardCarousel = ({ slides }: HeroBillboardCarouselProps) => {
const [emblaRef, emblaApi] = useEmblaCarousel({ loop: true });
const { scrollPrev, scrollNext, scrollProgress } = useCarouselControls(emblaApi);
@@ -62,14 +55,16 @@ const HeroBillboardCarousel = ({ slides, testimonials }: HeroBillboardCarouselPr
</button>
</div>
<div className="testimonials-section">
<div className="max-w-6xl mx-auto px-6">
<div className="flex justify-center gap-6 flex-wrap">
{testimonials.map((testimonial, index) => (
<TestimonialCard key={index} name={testimonial.name} review={testimonial.review} />
))}
</div>
<div className="absolute bottom-24 left-1/2 -translate-x-1/2 flex flex-col sm:flex-row items-center gap-4 text-primary-cta-text backdrop-blur-sm bg-black/30 py-2 px-4 rounded-[var(--radius)]">
<div className="flex items-center gap-1">
<Star className="w-5 h-5 fill-current" />
<Star className="w-5 h-5 fill-current" />
<Star className="w-5 h-5 fill-current" />
<Star className="w-5 h-5 fill-current" />
<Star className="w-5 h-5 fill-current" />
</div>
<div className="hidden sm:block w-px h-4 bg-white/30"></div>
<p className="text-sm font-medium">10,000+ happy customers</p>
</div>
</section>
);