style: align header, content, and footer widths
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>
This commit is contained in:
@@ -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
|
||||
|
||||
@@ -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}
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user