FIXED: Footer alignment issue in large screen

tfsojon · tfsojon · commit d05a98a5a174 · 2024-03-17T16:39:28.000+06:00
Closes zeon-studio#32
diff --git a/src/layouts/Base.astro b/src/layouts/Base.astro
@@ -170,7 +170,7 @@ const { title, meta_title, description, image, noindex, canonical } =
     />
     <meta name="twitter:card" content="summary_large_image" />
   </head>
-  <body>
+  <body class="flex flex-col min-h-screen items-center [&>*]:w-full [&>footer]:mt-auto">
     <TwSizeIndicator />
     <Header />
     <SearchModal client:load />
diff --git a/src/layouts/components/TwSizeIndicator.astro b/src/layouts/components/TwSizeIndicator.astro
@@ -3,7 +3,7 @@
 
 {
   process.env.NODE_ENV === "development" && (
-    <div class="fixed left-0 top-0 z-50 flex w-[30px] items-center justify-center bg-gray-200 py-[2.5px] text-[12px] uppercase text-black sm:bg-red-200 md:bg-yellow-200 lg:bg-green-200 xl:bg-blue-200 2xl:bg-pink-200">
+    <div class="fixed left-0 top-0 z-50 flex !w-[30px] items-center justify-center bg-gray-200 py-[2.5px] text-[12px] uppercase text-black sm:bg-red-200 md:bg-yellow-200 lg:bg-green-200 xl:bg-blue-200 2xl:bg-pink-200">
       <span class="block sm:hidden">all</span>
       <span class="hidden sm:block md:hidden">sm</span>
       <span class="hidden md:block lg:hidden">md</span>

Original file line number	Diff line number	Diff line change
`@@ -3,7 +3,7 @@`
`3`	`3`
`4`	`4`	`{`
`5`	`5`	`process.env.NODE_ENV === "development" && (`
`6`		`- <div class="fixed left-0 top-0 z-50 flex w-[30px] items-center justify-center bg-gray-200 py-[2.5px] text-[12px] uppercase text-black sm:bg-red-200 md:bg-yellow-200 lg:bg-green-200 xl:bg-blue-200 2xl:bg-pink-200">`
	`6`	`+ <div class="fixed left-0 top-0 z-50 flex !w-[30px] items-center justify-center bg-gray-200 py-[2.5px] text-[12px] uppercase text-black sm:bg-red-200 md:bg-yellow-200 lg:bg-green-200 xl:bg-blue-200 2xl:bg-pink-200">`
`7`	`7`	`<span class="block sm:hidden">all</span>`
`8`	`8`	`<span class="hidden sm:block md:hidden">sm</span>`
`9`	`9`	`<span class="hidden md:block lg:hidden">md</span>`