fix(spa): redesign remaining pages to light theme

This commit is contained in:
Your Name committed 2026-06-06 19:24:25 +07:00
1 parent d8bff72e4e
commit 15cb147c81
8 files changed
+89 -53

No files matched your search

+8 -8
View File
@@ -60,8 +60,8 @@ export default function FaqPage() {
<Navbar categories={categories} />
{/* Header */}
<div className="pt-32 pb-16 px-6 text-center space-y-4 border-b border-white/5 bg-night-800/20">
<p className="text-cyan-glow uppercase tracking-[0.4em] text-xs font-semibold opacity-70">Support</p>
<div className="pt-32 pb-16 px-6 text-center space-y-4 border-b border-spa-stone/10 bg-white border-b border-spa-stone/10">
<p className="text-spa-forest uppercase tracking-[0.4em] text-xs font-semibold opacity-70">Support</p>
<h1 className="text-5xl font-bold">Frequently Asked Questions</h1>
<p className="text-slate-400 max-w-lg mx-auto">
Everything you need to know about HomAroma products, shipping, and care.
@@ -77,8 +77,8 @@ export default function FaqPage() {
onClick={() => setActiveCategory(category)}
className={`px-5 py-2 rounded-full text-xs font-bold uppercase tracking-widest transition-all duration-300 flex items-center gap-2 ${
activeCategory === category
? 'bg-cyan-glow text-night-900 shadow-[0_0_15px_rgba(102,252,241,0.3)]'
: 'glass hover:bg-white/10'
? 'bg-spa-forest text-white text-spa-forest shadow-[0_0_15px_rgba(102,252,241,0.3)]'
: 'bg-white shadow-sm border border-spa-stone/10 hover:bg-white/10'
}`}
>
<span>{icon}</span> {category}
@@ -94,7 +94,7 @@ export default function FaqPage() {
return (
<div
key={key}
className={`glass rounded-xl overflow-hidden border transition-all duration-300 ${isOpen ? 'border-cyan-glow/20' : 'border-white/5'}`}
className={`bg-white shadow-sm border border-spa-stone/10 rounded-xl overflow-hidden border transition-all duration-300 ${isOpen ? 'border-spa-forest' : 'border-spa-stone/10'}`}
>
<button
onClick={() => toggle(key)}
@@ -102,7 +102,7 @@ export default function FaqPage() {
>
<span className="font-semibold text-sm md:text-base leading-snug">{item.q}</span>
<svg
className={`w-5 h-5 text-cyan-glow shrink-0 transition-transform duration-300 ${isOpen ? 'rotate-45' : ''}`}
className={`w-5 h-5 text-spa-forest shrink-0 transition-transform duration-300 ${isOpen ? 'rotate-45' : ''}`}
fill="none" viewBox="0 0 24 24" stroke="currentColor"
>
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 4v16m8-8H4" />
@@ -120,13 +120,13 @@ export default function FaqPage() {
</div>
{/* Still have questions? */}
<div className="glass rounded-2xl p-8 text-center space-y-4 border border-white/5 mt-12">
<div className="bg-white shadow-sm border border-spa-stone/10 rounded-2xl p-8 text-center space-y-4 border border-spa-stone/10 mt-12">
<div className="text-3xl">💬</div>
<h3 className="font-bold text-xl">Still have questions?</h3>
<p className="text-slate-400 text-sm">Our team is here to help — usually responds within 2 hours.</p>
<a
href="/contact"
className="inline-block px-8 py-3 bg-white text-night-900 font-bold rounded-lg uppercase tracking-widest text-xs hover:bg-cyan-glow transition-colors duration-300"
className="inline-block px-8 py-3 bg-white text-spa-forest font-bold rounded-lg uppercase tracking-widest text-xs hover:bg-spa-forest text-white transition-colors duration-300"
>
Contact Us
</a>