Added 3XL

Added tailwind selector 3XL (width: 1900px )
Modified Layouts and Navigation to be wider for 2xl

src/components/NavbarSkeleton.astro

@@ -4,7 +4,7 @@
 			class="sm:grid sm:grid-cols-6 lg:grid-cols-12"
 		>
 			<div
-				class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 2xl:col-start-4 2xl:col-end-10 "
+				class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 3xl:col-start-4 3xl:col-end-10 "
 			>
 				<div
 					class="container mx-auto px-6 py-2 flex items-center justify-between"

src/layouts/SinglePage.astro

@@ -1,7 +1,7 @@
 <div class="snap-start h-screen overflow-clip pt-14">
 	<div class="bg-bkg h-full w-full sm:grid sm:grid-cols-6 lg:grid-cols-12">
 		<div
-			class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 xl:col-start-3 xl:col-end-11 2xl:col-start-4 2xl:col-end-10 h-full p-2 sm:p-6"
+			class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 xl:col-start-3 xl:col-end-11 3xl:col-start-4 3xl:col-end-10 h-full p-2 sm:p-6"
 		>
 			<slot />
 		</div>

src/layouts/SinglePageBlogMode.astro

@@ -1,7 +1,7 @@
 <div class="h-screen pt-14">
 	<div class="bg-bkg h-full w-full sm:grid sm:grid-cols-6 lg:grid-cols-12">
 		<div
-			class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 xl:col-start-3 xl:col-end-11 2xl:col-start-4 2xl:col-end-10 h-full p-2 sm:p-6"
+			class="sm:col-start-2 sm:col-end-6 lg:col-start-3 lg:col-end-11 xl:col-start-3 xl:col-end-11 3xl:col-start-4 3xl:col-end-10 h-full p-2 sm:p-6"
 		>
 			<slot />
 		</div>

tailwind.config.mjs

@@ -27,6 +27,9 @@ module.exports = {
       },
     },
     extend: {
+      screens: {
+        "3xl": "1900px"
+      },
       colors: {
         bkg: withOpacity('--color-bkg'),
         bkgNavbar: withOpacity('--color-bkgNavbar'),