fix: layout style (#30)

Author: richhost

docs/package.json

@@ -17,13 +17,13 @@
 		"@sveltejs/adapter-cloudflare": "^4.8.0",
 		"@sveltejs/kit": "^2.0.0",
 		"@sveltejs/vite-plugin-svelte": "^4.0.0",
-		"@tailwindcss/vite": "4.0.0-beta.5",
+		"@tailwindcss/vite": "^4.0.1",
 		"mdsx": "^0.0.6",
 		"phosphor-svelte": "^3.0.0",
 		"svelte": "^5.2.11",
 		"svelte-check": "^4.0.0",
 		"svelte-preprocess": "^6.0.3",
-		"tailwindcss": "4.0.0-beta.5",
+		"tailwindcss": "^4.0.1",
 		"typescript": "^5.0.0",
 		"velite": "^0.2.1",
 		"vite": "^5.0.11"

package.json

@@ -25,7 +25,7 @@
 		"@changesets/cli": "^2.27.10",
 		"@eslint/js": "^9.12.0",
 		"@svitejs/changesets-changelog-github-compact": "^1.2.0",
-		"@tailwindcss/vite": "4.0.0-beta.4",
+		"@tailwindcss/vite": "^4.0.1",
 		"@types/node": "^22.10.1",
 		"@typescript-eslint/eslint-plugin": "^8.10.0",
 		"@typescript-eslint/scope-manager": "^8.10.0",

packages/kit/package.json

@@ -59,7 +59,7 @@
 		"@sveltejs/kit": "^2.9.0",
 		"@sveltejs/package": "^2.3.7",
 		"@sveltejs/vite-plugin-svelte": "^4.0.0",
-		"@tailwindcss/vite": "4.0.0-beta.6",
+		"@tailwindcss/vite": "^4.0.1",
 		"@types/hast": "^3.0.4",
 		"@types/mdast": "^4.0.4",
 		"@types/node": "^22.10.1",
@@ -69,7 +69,7 @@
 		"publint": "^0.2.0",
 		"svelte": "^5.11.0",
 		"svelte-check": "^4.0.0",
-		"tailwindcss": "4.0.0-beta.6",
+		"tailwindcss": "^4.0.1",
 		"typescript": "^5.0.0",
 		"unified": "^11.0.5",
 		"vite": "^5.0.11"

packages/kit/src/lib/components/layout/doc-page.svelte

@@ -26,7 +26,7 @@
 		<Toc toc={{ items: toc }} />
 	</div>
 </aside>
-<main class="mx-auto w-full min-w-0 max-w-[760px] pb-12" id="main-content">
+<main class="mx-auto w-full min-w-0 max-w-[640px] pb-12 2xl:max-w-[760px]" id="main-content">
 	<PageHeader {title} {description} />
 	<PageComponent />
 </main>

packages/kit/src/lib/components/layout/docs-layout.svelte

@@ -24,7 +24,7 @@
 	<Sidebar.Inset>
 		<Header />
 		<div
-			class="bg-background flex w-full flex-1 flex-row-reverse gap-4 px-4 py-8 lg:pl-0 lg:pr-8"
+			class="bg-background flex w-full flex-1 flex-row-reverse px-4 py-8 lg:pl-0 lg:pr-8 xl:gap-4"
 			id="content"
 		>
 			{@render children?.()}