Fixed images having overflow issues on the website

tommyjepsen · Jan 6, 2025 · 8d1124f · 8d1124f
1 parent b52d96b
commit 8d1124f
Show file tree

Hide file tree

Showing 12 changed files with 30 additions and 30 deletions.
diff --git a/components/blocks/blogs.tsx b/components/blocks/blogs.tsx
@@ -19,7 +19,7 @@ export const Blogs = () => (
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/blogs/blog1" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/blog1.png"
                   alt="blog1"
@@ -34,7 +34,7 @@ export const Blogs = () => (
           </Link>
           <Link href="blocks/blogs/blog2" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/blog2.png"
                   alt="blog2"

diff --git a/components/blocks/cases.tsx b/components/blocks/cases.tsx
@@ -19,7 +19,7 @@ export const Cases = () => (
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/cases/case1" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/case1.png"
                   alt="case1"
@@ -34,7 +34,7 @@ export const Cases = () => (
           </Link>
           <Link href="blocks/cases/case2" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/case2.png"
                   alt="case2"

diff --git a/components/blocks/contacts.tsx b/components/blocks/contacts.tsx
@@ -19,7 +19,7 @@ export const Contacts = () => (
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/contacts/contact1" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/contact1.png"
                   alt="contact1"

diff --git a/components/blocks/ctas.tsx b/components/blocks/ctas.tsx
@@ -18,7 +18,7 @@ export const CTAs = () => (
         </div>
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/ctas/cta1" className="hover:opacity-70">
-            <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+            <div className="bg-muted rounded-md p-8 lg:p-20">
               <Image
                 src="/cta1.png"
                 alt="cta1"
@@ -31,7 +31,7 @@ export const CTAs = () => (
             </div>
           </Link>
           <Link href="blocks/ctas/cta2" className="hover:opacity-70">
-            <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+            <div className="bg-muted rounded-md p-8 lg:p-20">
               <Image
                 src="/cta2.png"
                 alt="cta2"

diff --git a/components/blocks/faqs.tsx b/components/blocks/faqs.tsx
@@ -20,7 +20,7 @@ export const FAQs = () => (
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/faqs/faq1" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/faq1.png"
                   alt="faq1"
@@ -35,7 +35,7 @@ export const FAQs = () => (
           </Link>
           <Link href="blocks/faqs/faq2" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/faq2.png"
                   alt="faq2"

diff --git a/components/blocks/features.tsx b/components/blocks/features.tsx
@@ -19,7 +19,7 @@ export const Features = () => (
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/features/feature1" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/feature1.png"
                   alt="feature1"
@@ -34,7 +34,7 @@ export const Features = () => (
           </Link>
           <Link href="blocks/features/feature2" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/feature2.png"
                   alt="feature2"
@@ -49,7 +49,7 @@ export const Features = () => (
           </Link>
           <Link href="blocks/features/feature3" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/feature3.png"
                   alt="feature3"
@@ -64,7 +64,7 @@ export const Features = () => (
           </Link>
           <Link href="blocks/features/feature4" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/feature4.png"
                   alt="feature4"
@@ -79,7 +79,7 @@ export const Features = () => (
           </Link>
           <Link href="blocks/features/feature5" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/feature5.png"
                   alt="feature5"
@@ -94,7 +94,7 @@ export const Features = () => (
           </Link>
           <Link href="blocks/features/feature6" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/feature6.png"
                   alt="feature6"
@@ -109,7 +109,7 @@ export const Features = () => (
           </Link>
           <Link href="blocks/features/feature7" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/feature7.png"
                   alt="feature7"
@@ -124,7 +124,7 @@ export const Features = () => (
           </Link>
           <Link href="blocks/features/feature8" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/feature8.png"
                   alt="feature8"
@@ -139,7 +139,7 @@ export const Features = () => (
           </Link>
           <Link href="blocks/features/feature9" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/feature9.png"
                   alt="feature9"

diff --git a/components/blocks/footers.tsx b/components/blocks/footers.tsx
@@ -19,7 +19,7 @@ export const Footers = () => (
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/footers/footer1" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/footer1.png"
                   alt="footer1"

diff --git a/components/blocks/headers.tsx b/components/blocks/headers.tsx
@@ -19,7 +19,7 @@ export const Headers = () => (
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/headers/header1" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/header1.png"
                   alt="header1"

diff --git a/components/blocks/heroes.tsx b/components/blocks/heroes.tsx
@@ -19,7 +19,7 @@ export const Heroes = () => (
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/heroes/hero1" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/hero1.png"
                   alt="Hero 1"
@@ -34,7 +34,7 @@ export const Heroes = () => (
           </Link>
           <Link href="blocks/heroes/hero2" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/hero2.png"
                   alt="Hero 2"
@@ -49,7 +49,7 @@ export const Heroes = () => (
           </Link>
           <Link href="blocks/heroes/hero3" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/hero3.png"
                   alt="Hero 3"
@@ -64,7 +64,7 @@ export const Heroes = () => (
           </Link>{" "}
           <Link href="blocks/heroes/hero4" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/hero4.png"
                   alt="Hero 4"
@@ -79,7 +79,7 @@ export const Heroes = () => (
           </Link>
           <Link href="blocks/heroes/hero5" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 relative">
+              <div className="bg-muted rounded-md p-8 lg:p-20 relative">
                 <Badge className="absolute top-4 left-4">
                   Animated using Framer Motion
                 </Badge>

diff --git a/components/blocks/pricings.tsx b/components/blocks/pricings.tsx
@@ -19,7 +19,7 @@ export const Pricings = () => (
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/pricings/pricing1" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/pricing1.png"
                   alt="pricing1"
@@ -34,7 +34,7 @@ export const Pricings = () => (
           </Link>
           <Link href="blocks/pricings/pricing2" className="hover:opacity-70">
             <div className="flex flex-col h-full">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20 h-full">
+              <div className="bg-muted rounded-md p-8 lg:p-20 h-full">
                 <Image
                   src="/pricing2.png"
                   alt="pricing2"

diff --git a/components/blocks/stats.tsx b/components/blocks/stats.tsx
@@ -19,7 +19,7 @@ export const Stats = () => (
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
           <Link href="blocks/stats/stats1" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/stats1.png"
                   alt="stats1"
@@ -34,7 +34,7 @@ export const Stats = () => (
           </Link>
           <Link href="blocks/stats/stats2" className="hover:opacity-70">
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/stats2.png"
                   alt="stats2"

diff --git a/components/blocks/testimonials.tsx b/components/blocks/testimonials.tsx
@@ -22,7 +22,7 @@ export const Testimonials = () => (
             className="hover:opacity-70"
           >
             <div className="flex flex-col gap-2">
-              <div className="bg-muted rounded-md aspect-video p-8 lg:p-20">
+              <div className="bg-muted rounded-md p-8 lg:p-20">
                 <Image
                   src="/testimonials1.png"
                   alt="testimonials1"