style: add responsive padding to BentoReviews component for mobile devices

This commit is contained in:
2025-09-19 00:30:38 +02:00
parent a035500c34
commit a78bc67ed3

View File

@@ -55,9 +55,9 @@ const items = [
export function BentoReviews() { export function BentoReviews() {
return ( return (
<div> <div>
<div className="relative isolate pt-24 pb-12 bg-black text-center w-full"> <div className="relative isolate pt-24 pb-12 bg-black text-center w-full lg:px-0 px-4">
<FadeIn transition={{ duration: 0.8, delay: 0.1 }}> <FadeIn transition={{ duration: 0.8, delay: 0.1 }}>
<div className="mx-auto max-w-5xl"> <div className="mx-auto max-w-5xl ">
<H2 className="text-center">Mycelium Technologies</H2> <H2 className="text-center">Mycelium Technologies</H2>
</div> </div>
</FadeIn> </FadeIn>
@@ -70,7 +70,7 @@ export function BentoReviews() {
</div> </div>
</FadeIn> </FadeIn>
</div> </div>
<BentoGrid className="max-w-8xl px-12 pb-12 lg:grid-cols-3"> <BentoGrid className="max-w-8xl lg:px-12 px-4pb-12 lg:grid-cols-3">
{items.map((item, i) => ( {items.map((item, i) => (
<MotionBentoGridItem <MotionBentoGridItem
key={i} key={i}