Resolving display issues on large monitors (#4620)

Author: karlcarstensen

docs-starlight/src/components/dv-Footer.astro

@@ -10,8 +10,9 @@ import IconCloudnuke from '@assets/icon-cloudnuke.svg';
 import IconGitxargs from '@assets/icon-gitxargs.svg';
 ---
 <footer class="flex flex-col bg-[#FAFAFA]">
-    <!-- Subscribe to Newsletter Responsiveness-->
-    <div class="bg-bg-dark flex flex-col md:flex-row items-center justify-between gap-4 px-6 xl:px-8 py-6">
+    <div class="max-w-[1312px] mx-auto w-full">
+        <!-- Subscribe to Newsletter Responsiveness-->
+        <div class="bg-bg-dark flex flex-col md:flex-row items-center justify-between gap-4 px-6 xl:px-8 py-6">
         <p class="text-white w-full md:flex-1">
             Subscribe to the newsletter <span class="text-gray-1">to hear about the latest updates, features and innovations in Terragrunt</span>
         </p>
@@ -109,6 +110,7 @@ import IconGitxargs from '@assets/icon-gitxargs.svg';
             </p>
         </div>
     </div>
+    </div>
 </footer>
 
 <script src="https://js.hsforms.net/forms/v2.js"></script>

docs-starlight/src/components/dv-Testimonials.astro

@@ -21,7 +21,7 @@ import LogoBrand11 from '@assets/logo-brand-11.png';
 ---
 
 <section class="max-w-dvw justify-center items-center px-5 md:px-0 max-h-[80dvh] md:max-h-[90dvh] overflow-hidden relative">
-  <div class="flex flex-col w-full md:w-[680px] lg:w-[900px]">
+  <div class="flex flex-col w-full md:w-[680px] lg:w-[900px] mx-auto">
     <!-- Header Section -->
     <div class="flex flex-col gap-4 md:gap-8 pb-6 md:pb-[60px] md:pl-12 md:pr-8">
       <Eyebrow text="TESTIMONIALS" />

docs-starlight/src/pages/index.astro

@@ -28,7 +28,7 @@ import Testimonials from '@components/dv-Testimonials.astro';
 		<div class="absolute top-[149px] md:top-[83px] w-full">
 			<Hero />
 			<div class="overflow-hidden lg:px-8 xl:px-24 2xl:px-76">
-				<div class="relative flex flex-col lg:border-l-1 lg:border-r-1 lg:border-gray-3">
+				<div class="relative flex flex-col lg:border-l-1 lg:border-r-1 lg:border-gray-3 max-w-[1312px] mx-auto w-full">
 					<div class="z-10">
 						<FeaturedBrands />
 					</div>