From 296f78709b2e83058e756f090f6a4e8d17107761 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= <valknar@pivoine.art>
Date: Sat, 8 Nov 2025 11:34:17 +0100
Subject: [PATCH] style: align header, content, and footer widths
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Standardized all layout sections to use consistent max-width:
- Changed from inconsistent container/max-w-6xl to unified max-w-7xl
- Header: container mx-auto → w-full max-w-7xl mx-auto
- Main: container mx-auto → w-full max-w-7xl mx-auto
- Footer: container mx-auto → w-full max-w-7xl mx-auto
- MainConverter: removed max-w-6xl (inherits from parent)

All sections now align perfectly with matching left/right edges
for a clean, professional layout.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 app/page.tsx                           | 4 ++--
 components/converter/MainConverter.tsx | 2 +-
 components/ui/Footer.tsx               | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/page.tsx b/app/page.tsx
index d078f13..fc4dff6 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -7,13 +7,13 @@ export default function Home() {
     <div className="min-h-screen bg-background flex flex-col">
       {/* Header with theme toggle */}
       <div className="border-b sticky top-0 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60 z-40">
-        <div className="container mx-auto px-4 py-4 flex justify-between items-center">
+        <div className="w-full max-w-7xl mx-auto px-4 py-4 flex justify-between items-center">
           <div className="text-xl font-bold">Units UI</div>
           <ThemeToggle />
         </div>
       </div>
 
-      <main className="container mx-auto px-4 py-8 flex-1">
+      <main className="w-full max-w-7xl mx-auto px-4 py-8 flex-1">
         <header className="text-center mb-12">
           <h1 className="text-5xl font-bold mb-4 bg-gradient-to-r from-blue-600 to-indigo-600 dark:from-blue-400 dark:to-indigo-400 bg-clip-text text-transparent">
             Unit Converter
diff --git a/components/converter/MainConverter.tsx b/components/converter/MainConverter.tsx
index 1193114..e355203 100644
--- a/components/converter/MainConverter.tsx
+++ b/components/converter/MainConverter.tsx
@@ -138,7 +138,7 @@ export default function MainConverter() {
   }, [selectedUnit]);
 
   return (
-    <div className="w-full max-w-6xl mx-auto space-y-6">
+    <div className="w-full space-y-6">
       {/* Command Palette */}
       <CommandPalette
         onSelectMeasure={setSelectedMeasure}
diff --git a/components/ui/Footer.tsx b/components/ui/Footer.tsx
index edabae4..c66fa08 100644
--- a/components/ui/Footer.tsx
+++ b/components/ui/Footer.tsx
@@ -5,7 +5,7 @@ export default function Footer() {
 
   return (
     <footer className="border-t mt-16 bg-background">
-      <div className="container mx-auto px-4 py-8">
+      <div className="w-full max-w-7xl mx-auto px-4 py-8">
         <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
           {/* About */}
           <div>