kunthawat/dealplustech
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Change Header and Footer to white background

Browse Source 
- Header: white background with dark text for navigation
- Footer: light gray background with dark text
- All text colors updated for readability
- No white text on white background issues
This commit is contained in:
Kunthawat Greethong
2026-02-26 09:29:26 +07:00
parent 88d06a4edd
commit e7adbd8e98
4 changed files with 22 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/layout/Header.tsx
View File

@@ -11,7 +11,7 @@ export default function Header() {
const [activeDropdown, setActiveDropdown] = useState<string | null>(null);
return (
<header className="fixed top-0 left-0 right-0 z-50 bg-secondary-900 shadow-industrial">
<header className="fixed top-0 left-0 right-0 z-50 bg-white shadow-md">
{/* Top Bar */}
<div className="bg-primary-600 py-2">
<div className="container mx-auto px-4 flex justify-between items-center text-sm">
@@ -67,7 +67,7 @@ export default function Header() {
<Link
href={item.href}
className={cn(
"px-4 py-2 text-white font-medium hover:text-primary-400 transition-colors flex items-center gap-1",
"px-4 py-2 text-secondary-700 font-medium hover:text-primary-600 transition-colors flex items-center gap-1",
item.children && "pr-2"
)}
>
@@ -81,7 +81,7 @@ export default function Header() {
{/* Dropdown */}
{item.children && activeDropdown === item.href && (
<div className="absolute top-full left-0 w-64 bg-white shadow-industrial rounded-lg py-2 mt-1">
<div className="absolute top-full left-0 w-64 bg-white shadow-lg rounded-lg py-2 mt-1 border border-secondary-100">
{item.children.map((child) => (
<div key={child.href} className="relative group">
<Link
@@ -91,7 +91,7 @@ export default function Header() {
{child.label}
</Link>
{child.children && (
<div className="hidden group-hover:block absolute left-full top-0 w-56 bg-white shadow-industrial rounded-lg py-2">
<div className="hidden group-hover:block absolute left-full top-0 w-56 bg-white shadow-lg rounded-lg py-2 border border-secondary-100">
{child.children.map((subChild) => (
<Link
key={subChild.href}
@@ -116,7 +116,7 @@ export default function Header() {
{/* Mobile Menu Button */}
<button
className="lg:hidden text-white p-2"
className="lg:hidden text-secondary-900 p-2"
onClick={() => setMobileMenuOpen(!mobileMenuOpen)}
>
<svg className="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
@@ -131,12 +131,12 @@ export default function Header() {
{/* Mobile Menu */}
{mobileMenuOpen && (
<div className="lg:hidden py-4 border-t border-secondary-700">
<div className="lg:hidden py-4 border-t border-secondary-200">
{mainNavigation.map((item) => (
<div key={item.href}>
<Link
href={item.href}
className="block px-4 py-2 text-white hover:text-primary-400"
className="block px-4 py-2 text-secondary-700 hover:text-primary-600"
onClick={() => setMobileMenuOpen(false)}
>
{item.label}