testimonal-01

1import Image from "next/image"
2import { MdOutlineFormatQuote } from "react-icons/md"
3 
4import {
5  Carousel,
6  CarouselContent,
7  CarouselItem,
8  CarouselNext,
9  CarouselPrevious,
10} from "@/registry/blocks/testimonal-01/components/carousel"
11import Section from "@/registry/blocks/testimonal-01/components/section"
12 
13const companies = [
14  {
15    name: "Google",
16    url: "https://pub-b3533f2e1c954842824758490b95c9d5.r2.dev/Google.svg",
17  },
18  {
19    name: "GitHub",
20    url: "https://pub-b3533f2e1c954842824758490b95c9d5.r2.dev/GitHub.svg",
21  },
22  {
23    name: "Amazon",
24    url: "https://pub-b3533f2e1c954842824758490b95c9d5.r2.dev/Amazon.svg",
25  },
26  {
27    name: "Netflix",
28    url: "https://pub-b3533f2e1c954842824758490b95c9d5.r2.dev/Netflix.svg",
29  },
30  {
31    name: "YouTube",
32    url: "https://pub-b3533f2e1c954842824758490b95c9d5.r2.dev/YouTube.svg",
33  },
34  {
35    name: "Instagram",
36    url: "https://pub-b3533f2e1c954842824758490b95c9d5.r2.dev/Instagram.svg",
37  },
38  {
39    name: "Spotify",
40    url: "https://pub-b3533f2e1c954842824758490b95c9d5.r2.dev/Spotify.svg",
41  },
42]
43 
44export default function Testimonal01Page() {
45  return (
46    <div className="flex min-h-svh w-full items-center justify-center p-6 md:p-10">
47      <div className="w-full max-w-sm md:max-w-3xl">
48        <Section
49          title="Testimonial Highlight"
50          subtitle="What our customers are saying"
51        >
52          <Carousel>
53            <div className="relative mx-auto max-w-2xl">
54              <CarouselContent>
55                {Array.from({ length: 7 }).map((_, index) => (
56                  <CarouselItem key={index}>
57                    <div className="p-2 pb-5">
58                      <div className="text-center">
59                        <MdOutlineFormatQuote className="text-themeDarkGray mx-auto my-4 text-4xl" />
60                        <h4 className="text-1xl mx-auto max-w-lg px-10 font-semibold">
61                          {getTestimonialQuote(index)}
62                        </h4>
63                        <div className="mt-8">
64                          <Image
65                            width={0}
66                            height={40}
67                            src={companies[index % companies.length].url}
68                            alt={`${companies[index % companies.length].name} Logo`}
69                            className="mx-auto h-[40px] w-auto"
70                          />
71                        </div>
72                        <div>
73// … truncated