fix: Phase 1 - Remove social icons, fix footer, add brand blue color

Changes:
- Remove social media icons from top bar (keep only email & phone)
- Remove duplicate legal links from footer
- Add Royal Blue (#1e40af) as secondary brand color
- Fix gradient-primary to use dark text (not white)
- Add gradient-brand and btn-brand components
- Improve button color contrast

Color scheme:
- Primary: Yellow (#fed400)
- Secondary Brand: Royal Blue (#1e40af) ← NEW
- Accent: Blue-Purple gradient
This commit is contained in:
Kunthawat Greethong
2026-03-11 20:19:53 +07:00
parent 0cbca59d85
commit e79fb16aee
2 changed files with 25 additions and 23 deletions

View File

@@ -56,7 +56,7 @@ const { title = 'MoreminiMore - ที่ปรึกษาองค์กร AI
<header class="bg-primary sticky top-0 z-50 shadow-lg"> <header class="bg-primary sticky top-0 z-50 shadow-lg">
<!-- Top Bar --> <!-- Top Bar -->
<div class="bg-black text-white py-2"> <div class="bg-black text-white py-2">
<div class="container mx-auto px-4 flex flex-wrap justify-between items-center text-sm"> <div class="container mx-auto px-4 flex flex-wrap justify-center items-center text-sm">
<div class="flex gap-4"> <div class="flex gap-4">
<a href="mailto:contact@moreminimore.com" class="hover:text-primary transition"> <a href="mailto:contact@moreminimore.com" class="hover:text-primary transition">
📧 contact@moreminimore.com 📧 contact@moreminimore.com
@@ -65,24 +65,6 @@ const { title = 'MoreminiMore - ที่ปรึกษาองค์กร AI
📞 080-995-5945 📞 080-995-5945
</a> </a>
</div> </div>
<div class="flex gap-3">
<!-- Facebook -->
<a href="https://www.facebook.com/moreminimore" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition" aria-label="Facebook">
<img src="/icons/social/facebook.svg" alt="Facebook" class="w-6 h-6" />
</a>
<!-- Twitter / X -->
<a href="https://twitter.com/moreminimore" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition" aria-label="Twitter">
<img src="/icons/social/x.svg" alt="X (Twitter)" class="w-6 h-6" />
</a>
<!-- LinkedIn -->
<a href="https://www.linkedin.com/company/moreminimore" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition" aria-label="LinkedIn">
<img src="/icons/social/linkedin.svg" alt="LinkedIn" class="w-6 h-6" />
</a>
<!-- LINE -->
<a href="#" target="_blank" rel="noopener noreferrer" class="hover:text-primary transition" aria-label="LINE">
<img src="/icons/social/line.svg" alt="LINE" class="w-6 h-6" />
</a>
</div>
</div> </div>
</div> </div>
@@ -218,10 +200,6 @@ const { title = 'MoreminiMore - ที่ปรึกษาองค์กร AI
</div> </div>
<div class="border-t border-gray-200 mt-8 pt-8 text-center text-sm text-gray-600"> <div class="border-t border-gray-200 mt-8 pt-8 text-center text-sm text-gray-600">
<div class="flex justify-center gap-6 mb-4">
<a href="/terms-and-conditions" class="hover:text-accent-blue transition">ข้อกำหนดและเงื่อนไข</a>
<a href="/privacy-policy" class="hover:text-accent-blue transition">นโยบายความเป็นส่วนตัว</a>
</div>
<p>&copy; {new Date().getFullYear()} MoreminiMore Co.,Ltd. สงวนลิขสิทธิ์</p> <p>&copy; {new Date().getFullYear()} MoreminiMore Co.,Ltd. สงวนลิขสิทธิ์</p>
</div> </div>
</div> </div>

View File

@@ -10,6 +10,10 @@
--color-secondary: #000000; --color-secondary: #000000;
--color-secondary-light: #1a1a1a; --color-secondary-light: #1a1a1a;
/* Brand Accent - Royal Blue */
--color-brand-blue: #1e40af;
--color-brand-blue-hover: #1e3a8a;
/* AI/Tech Accent Colors */ /* AI/Tech Accent Colors */
--color-accent-blue: #2563eb; --color-accent-blue: #2563eb;
--color-accent-blue-hover: #1d4ed8; --color-accent-blue-hover: #1d4ed8;
@@ -82,6 +86,11 @@
/* Gradient Backgrounds */ /* Gradient Backgrounds */
.gradient-primary { .gradient-primary {
background: linear-gradient(135deg, var(--color-primary) 0%, #ffd700 100%); background: linear-gradient(135deg, var(--color-primary) 0%, #ffd700 100%);
color: var(--color-secondary);
}
.gradient-brand {
background: linear-gradient(135deg, var(--color-brand-blue) 0%, var(--color-accent-blue) 100%);
} }
.gradient-ai { .gradient-ai {
@@ -108,6 +117,21 @@
box-shadow: 0 10px 20px rgba(254, 212, 0, 0.3); box-shadow: 0 10px 20px rgba(254, 212, 0, 0.3);
} }
.btn-brand {
background-color: var(--color-brand-blue);
color: var(--color-white);
padding: 0.75rem 2rem;
border-radius: 9999px;
font-weight: 700;
transition: all 0.3s ease;
}
.btn-brand:hover {
background-color: var(--color-brand-blue-hover);
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(30, 64, 175, 0.4);
}
.btn-secondary { .btn-secondary {
background-color: var(--color-secondary); background-color: var(--color-secondary);
color: var(--color-white); color: var(--color-white);