feat(ui): add Container component and replace manual container divs
Implement a reusable Container component with size variants (sm, md, lg, xl, full) to standardize content width across the application. Replace all manual container divs with the new component for consistent styling and maintainability.
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
import { personalInfo } from "@/lib/data";
|
||||
import LanguageSwitcher from "./LanguageSwitcher";
|
||||
import ThemeToggle from "./ui/theme-toggle";
|
||||
import Container from "./ui/Container";
|
||||
import { useTranslations, getLocalizedPath, type Lang } from "@/i18n/utils";
|
||||
import { useState, useEffect } from "react";
|
||||
import { motion, AnimatePresence } from "framer-motion";
|
||||
@@ -43,7 +44,7 @@ export default function GlassHeader({ lang: propLang }: GlassHeaderProps) {
|
||||
? 'backdrop-blur-md backdrop-filter bg-white/80 dark:bg-black/80 border-b border-border/30 shadow-lg shadow-black/5 dark:shadow-black/20'
|
||||
: 'bg-transparent'
|
||||
}`}>
|
||||
<div className="container max-w-4xl mx-auto p-4 flex justify-between items-center">
|
||||
<Container size="sm" className="p-4 flex justify-between items-center">
|
||||
<a
|
||||
className="flex items-center text-lg font-medium transition-opacity duration-150 hover:opacity-80"
|
||||
href={getLocalizedPath('/', lang)}
|
||||
@@ -85,7 +86,7 @@ export default function GlassHeader({ lang: propLang }: GlassHeaderProps) {
|
||||
{isMenuOpen ? <X size={24} /> : <Menu size={24} />}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</Container>
|
||||
|
||||
{/* Mobile Navigation */}
|
||||
<div className={`md:hidden overflow-hidden transition-all duration-200 ease-out ${
|
||||
|
||||
Reference in New Issue
Block a user