fixed small sized sizing

ezTxmMC · ezTxmMC · commit 37e050bc2ac1 · 2025-12-31T20:41:44.000+01:00
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
@@ -3,7 +3,7 @@ import { Github } from "@lucide/astro";
 ---
 
 <footer
-  class="relative mt-12 px-96 sm:px-8 md:px-16 lg:px-32 xl:px-64 w-screen h-80 flex flex-col justify-center items-center border-t border-t-(--background-lighter)"
+  class="relative mt-12 px-8 md:px-16 lg:px-16 xl:px-32 w-screen h-80 flex flex-col justify-center items-center border-t border-t-(--background-lighter)"
 >
   <div class="flex gap-32">
     <div class="w-80 flex flex-col">
diff --git a/src/components/Header.astro b/src/components/Header.astro
@@ -1,5 +1,5 @@
 <header
-  class="px-96 sm:px-8 md:px-16 lg:px-32 xl:px-64 w-screen h-20 flex justify-center items-center border-b border-b-(--background-lighter)"
+  class="px-8 md:px-16 lg:px-16 xl:px-32 w-screen h-20 flex justify-center items-center border-b border-b-(--background-lighter)"
 >
   <div class="flex-1 flex justify-start items-center gap-2">
     <img src="/logo.png" class="w-12 h-12" />
diff --git a/src/components/Project.astro b/src/components/Project.astro
@@ -22,7 +22,7 @@ function getColor(language: string) {
 ---
 
 <div
-  class="relative w-full sm:w-full md:w-[calc(50%-0.75rem)] lg:w-[calc(25%-0.75rem)] p-8 flex flex-col gap-4 bg-(--background-light) border border-(--background-lightest) rounded-lg"
+  class="relative w-full sm:w-full xl:w-[calc(50%-0.75rem)] 2xl:w-[calc(25%-0.75rem)] p-8 flex flex-col gap-4 bg-(--background-light) border border-(--background-lightest) rounded-lg"
 >
   <div class="flex gap-2 justify-between">
     <div class="flex gap-2">
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
@@ -19,7 +19,7 @@ import Footer from "../components/Footer.astro";
   </head>
   <body class="w-screen min-h-screen flex flex-col gap-8 bg-(--background)">
     <Header />
-    <main class="px-96 sm:px-8 md:px-16 lg:px-32 xl:px-64 flex flex-col gap-6">
+    <main class="px-8 md:px-16 lg:px-16 xl:px-32 flex flex-col gap-6">
       <slot />
     </main>
     <Footer />

Original file line number	Diff line number	Diff line change
`@@ -3,7 +3,7 @@ import { Github } from "@lucide/astro";`
`3`	`3`	`---`
`4`	`4`
`5`	`5`	`<footer`
`6`		`- class="relative mt-12 px-96 sm:px-8 md:px-16 lg:px-32 xl:px-64 w-screen h-80 flex flex-col justify-center items-center border-t border-t-(--background-lighter)"`
	`6`	`+ class="relative mt-12 px-8 md:px-16 lg:px-16 xl:px-32 w-screen h-80 flex flex-col justify-center items-center border-t border-t-(--background-lighter)"`
`7`	`7`	`>`
`8`	`8`	`<div class="flex gap-32">`
`9`	`9`	`<div class="w-80 flex flex-col">`
Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,5 @@`
`1`	`1`	`<header`
`2`		`- class="px-96 sm:px-8 md:px-16 lg:px-32 xl:px-64 w-screen h-20 flex justify-center items-center border-b border-b-(--background-lighter)"`
	`2`	`+ class="px-8 md:px-16 lg:px-16 xl:px-32 w-screen h-20 flex justify-center items-center border-b border-b-(--background-lighter)"`
`3`	`3`	`>`
`4`	`4`	`<div class="flex-1 flex justify-start items-center gap-2">`
`5`	`5`	`<img src="/logo.png" class="w-12 h-12" />`
Original file line number	Diff line number	Diff line change
`@@ -22,7 +22,7 @@ function getColor(language: string) {`
`22`	`22`	`---`
`23`	`23`
`24`	`24`	`<div`
`25`		`- class="relative w-full sm:w-full md:w-[calc(50%-0.75rem)] lg:w-[calc(25%-0.75rem)] p-8 flex flex-col gap-4 bg-(--background-light) border border-(--background-lightest) rounded-lg"`
	`25`	`+ class="relative w-full sm:w-full xl:w-[calc(50%-0.75rem)] 2xl:w-[calc(25%-0.75rem)] p-8 flex flex-col gap-4 bg-(--background-light) border border-(--background-lightest) rounded-lg"`
`26`	`26`	`>`
`27`	`27`	`<div class="flex gap-2 justify-between">`
`28`	`28`	`<div class="flex gap-2">`