Fixes index page to be responsive for small screens

This commit is contained in:
2025-06-09 16:00:07 -07:00
parent dea9bebdbb
commit 5b8f44461b

View File

@@ -15,8 +15,8 @@ import HeaderLogo from "../assets/HeaderLogo.png";
<body class="relative min-h-dvh">
<Header />
<div class="bg-dark text-light py-16">
<div class="flex flex-col items-center gap-8 w-200 m-auto">
<img src={HeaderLogo.src} alt="Terakoda" />
<div class="flex flex-col items-center gap-8 max-w-200 m-auto px-4">
<img src={HeaderLogo.src} alt="Terakoda" class="max-w-full" />
<p>
Solving Your Unique Software Challenges with Precision and Quality
</p>
@@ -26,9 +26,9 @@ import HeaderLogo from "../assets/HeaderLogo.png";
<main>
<div class="bg-light-accent py-16 text-dark">
<div class="w-200 m-auto">
<div class="max-w-200 m-auto px-4">
<h2 class="text-4xl mb-8 text-center">Our Expertise</h2>
<div class="grid grid-cols-2 gap-8">
<div class="grid md:grid-cols-2 grid-cols-1 gap-8">
<div class="service-item">
<h3>Custom Software Solutions</h3>
<p>
@@ -55,7 +55,7 @@ import HeaderLogo from "../assets/HeaderLogo.png";
</div>
</div>
<div class="py-16 w-200 m-auto">
<div class="py-16 max-w-200 m-auto px-4">
<h2 class="text-4xl mb-8 text-center">Our Commitment to Quality</h2>
<div class="quality-content">
<p>
@@ -76,7 +76,9 @@ import HeaderLogo from "../assets/HeaderLogo.png";
</div>
<div class="py-16 bg-dark text-light" id="contact">
<div class="w-200 m-auto flex flex-col items-center gap-8 text-center">
<div
class="max-w-200 m-auto px-4 flex flex-col items-center gap-8 text-center"
>
<h2 class="text-4xl text-center">
Ready to Solve Your Software Puzzle?
</h2>