added tons of features

components/shared/home/feature-cards.tsx

@@ -0,0 +1,44 @@
+import Image from 'next/image'
+import * as React from 'react'
+
+import {cards} from '@/lib/data'
+import {Card, CardContent} from '@/ui/card'
+import {Carousel, CarouselContent, CarouselItem} from '@/ui/carousel'
+
+export default function FeatureCards() {
+	return (
+		<Carousel className='mx-auto w-full'>
+			<CarouselContent className='-ml-2 md:-ml-4'>
+				{cards.map((card: any) => (
+					<CarouselItem
+						key={card.title}
+						className='pl-3 md:basis-1/3 lg:basis-1/4 xl:basis-1/5'
+					>
+						<div className='p-1'>
+							<Card className='border-[2px] border-brand-violet'>
+								<CardContent className='aspect-card flex items-center justify-center p-1'>
+									<CarouselItem>
+										<Image
+											src={card.image}
+											width={256}
+											height={256}
+											className='object-scale-down'
+											priority
+											alt={''}
+										/>
+									</CarouselItem>
+								</CardContent>
+							</Card>
+						</div>
+					</CarouselItem>
+				))}
+			</CarouselContent>
+		</Carousel>
+
+		/*<div className='container grid grid-cols-1 md:grid-cols-2 md:gap-44 lg:grid-cols-4'>
+			{cards.map((card: any) => (
+				<ProductCard card={card} key={card.title} />
+			))}
+		</div>*/
+	)
+}