chore: format project automatically before starting dev server
This commit is contained in:
+81
-65
@@ -4,77 +4,93 @@
|
||||
|
||||
import {commerceCopy} from '@/data/commerce';
|
||||
import Link from 'next/link';
|
||||
import { PhoneOutlined, EnvironmentOutlined } from '@ant-design/icons';
|
||||
import { useLanguage } from '@/app/context/LanguageContext';
|
||||
import {PhoneOutlined, EnvironmentOutlined} from '@ant-design/icons';
|
||||
import {useLanguage} from '@/app/context/LanguageContext';
|
||||
|
||||
export default function Footer() {
|
||||
const { t, locale } = useLanguage();
|
||||
const c = t.contactInfo;
|
||||
const {t, locale} = useLanguage();
|
||||
const c = t.contactInfo;
|
||||
|
||||
return (
|
||||
<footer id="contact" className="relative border-t border-subtle bg-elevated">
|
||||
<div className="max-w-6xl mx-auto px-6 md:px-16 py-14 grid md:grid-cols-3 gap-10 text-center md:text-start">
|
||||
<div>
|
||||
<h3 className="text-primary font-bold text-lg mb-3">{t.footer.aboutLabel}</h3>
|
||||
<p className="text-secondary text-sm leading-7">{t.footer.aboutText}</p>
|
||||
<div className="flex flex-col gap-2 mt-4">
|
||||
{c.socialLinks.map((link) => (
|
||||
<a
|
||||
key={link.id}
|
||||
href={link.href}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-brand-400 hover:text-brand-300 text-sm transition-colors"
|
||||
>
|
||||
{link.label}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
return (
|
||||
<footer id="contact" className="relative border-t border-subtle bg-elevated">
|
||||
<div className="max-w-6xl mx-auto px-6 md:px-16 py-14 grid md:grid-cols-3 gap-10 text-center md:text-start">
|
||||
<div>
|
||||
<h3 className="text-primary font-bold text-lg mb-3">{t.footer.aboutLabel}</h3>
|
||||
<p className="text-secondary text-sm leading-7">{t.footer.aboutText}</p>
|
||||
<div className="flex flex-col gap-2 mt-4">
|
||||
{c.socialLinks.map(link => (
|
||||
<a
|
||||
key={link.id}
|
||||
href={link.href}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-brand-400 hover:text-brand-300 text-sm transition-colors"
|
||||
>
|
||||
{link.label}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 className="text-primary font-bold text-lg mb-3">{t.footer.quickLinks}</h3>
|
||||
<ul className="flex flex-col gap-2 text-sm text-secondary">
|
||||
<li><Link href="/#hero" className="hover:text-brand-400">{t.nav.home}</Link></li>
|
||||
<li><Link href="/products" className="hover:text-brand-400">{commerceCopy[locale].allProducts}</Link></li>
|
||||
<li><Link href="/#about" className="hover:text-brand-400">{t.nav.about}</Link></li>
|
||||
<li><Link href="/#locations" className="hover:text-brand-400">{t.nav.locations}</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-primary font-bold text-lg mb-3">{t.footer.quickLinks}</h3>
|
||||
<ul className="flex flex-col gap-2 text-sm text-secondary">
|
||||
<li>
|
||||
<Link href="/#hero" className="hover:text-brand-400">
|
||||
{t.nav.home}
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/products" className="hover:text-brand-400">
|
||||
{commerceCopy[locale].allProducts}
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/#about" className="hover:text-brand-400">
|
||||
{t.nav.about}
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/#locations" className="hover:text-brand-400">
|
||||
{t.nav.locations}
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 className="text-primary font-bold text-lg mb-3">{t.footer.contactTitle}</h3>
|
||||
<div className="flex flex-col gap-4 text-sm text-secondary">
|
||||
<a
|
||||
href={`tel:${c.orderPhoneHref}`}
|
||||
className="flex items-center justify-center md:justify-start gap-2 hover:text-brand-400 transition-colors"
|
||||
dir="ltr"
|
||||
>
|
||||
<PhoneOutlined />
|
||||
<span>{c.orderPhone}</span>
|
||||
</a>
|
||||
<div>
|
||||
<h3 className="text-primary font-bold text-lg mb-3">{t.footer.contactTitle}</h3>
|
||||
<div className="flex flex-col gap-4 text-sm text-secondary">
|
||||
<a
|
||||
href={`tel:${c.orderPhoneHref}`}
|
||||
className="flex items-center justify-center md:justify-start gap-2 hover:text-brand-400 transition-colors"
|
||||
dir="ltr"
|
||||
>
|
||||
<PhoneOutlined />
|
||||
<span>{c.orderPhone}</span>
|
||||
</a>
|
||||
|
||||
<div className="flex items-start justify-center md:justify-start gap-2">
|
||||
<EnvironmentOutlined className="mt-0.5 shrink-0" />
|
||||
<div className="text-start">
|
||||
<p className="text-primary-90 font-semibold mb-1">{t.footer.salesLabel}</p>
|
||||
<p className="leading-7">{c.salesOfficeAddress}</p>
|
||||
</div>
|
||||
<div className="flex items-start justify-center md:justify-start gap-2">
|
||||
<EnvironmentOutlined className="mt-0.5 shrink-0" />
|
||||
<div className="text-start">
|
||||
<p className="text-primary-90 font-semibold mb-1">{t.footer.salesLabel}</p>
|
||||
<p className="leading-7">{c.salesOfficeAddress}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-start justify-center md:justify-start gap-2">
|
||||
<EnvironmentOutlined className="mt-0.5 shrink-0" />
|
||||
<div className="text-start">
|
||||
<p className="text-primary-90 font-semibold mb-1">{t.footer.factoryLabel}</p>
|
||||
<p className="leading-7">{c.factoryAddress}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-start justify-center md:justify-start gap-2">
|
||||
<EnvironmentOutlined className="mt-0.5 shrink-0" />
|
||||
<div className="text-start">
|
||||
<p className="text-primary-90 font-semibold mb-1">{t.footer.factoryLabel}</p>
|
||||
<p className="leading-7">{c.factoryAddress}</p>
|
||||
</div>
|
||||
<div className="border-t border-subtle py-5 text-center text-xs text-secondary">
|
||||
© {new Date().getFullYear()} {t.footer.aboutLabel}. {t.footer.rights}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="border-t border-subtle py-5 text-center text-xs text-secondary">
|
||||
© {new Date().getFullYear()} {t.footer.aboutLabel}. {t.footer.rights}
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
</footer>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user