ayrisdev/salmakisyatch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit: Salmakis Yachting Portal with Cloudinary & i18n

Browse Source
This commit is contained in:
ayrisdev
2026-04-14 12:34:19 +03:00
parent e6784f8056
commit 8b1bdfd3c6
99 changed files with 4118 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

101
app/[locale]/contact/page.tsx Normal file
View File

@@ -0,0 +1,101 @@
import { useTranslations } from 'next-intl';
export default function ContactPage() {
const t = useTranslations('Contact');
return (
<div className="pt-40 pb-24 px-6 md:px-24 min-h-screen bg-surface">
<div className="max-w-7xl mx-auto">
<div className="grid grid-cols-1 md:grid-cols-12 gap-24">
{/* Editorial Column */}
<div className="md:col-span-12 lg:col-span-5">
<span className="font-label text-xs tracking-[0.4em] text-secondary uppercase mb-4 block">{t('reservation_concierge')}</span>
<h1 className="text-primary font-headline text-6xl md:text-8xl mb-8 leading-tight">
{t('title1')} <br />
<span className="text-secondary italic">{t('title2')}</span>
</h1>
<div className="h-px w-24 bg-secondary mb-12"></div>
<div className="space-y-16 mt-24">
<div>
<h3 className="font-label text-xs tracking-[0.2em] text-secondary mb-4 uppercase">{t('headquarters')}</h3>
<p className="font-body text-xl text-primary font-light leading-relaxed">
{t('hq_address1')} <br />
{t('hq_address2')}
</p>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-12">
<div>
<h3 className="font-label text-xs tracking-[0.2em] text-secondary mb-4 uppercase">{t('direct_line')}</h3>
<p className="font-body text-xl text-primary font-light">+90 (252) 316 12 34</p>
</div>
<div>
<h3 className="font-label text-xs tracking-[0.2em] text-secondary mb-4 uppercase">{t('digital_mail')}</h3>
<p className="font-body text-xl text-primary font-light">atelier@salmakis.com</p>
</div>
</div>
<div className="pt-8">
<button className="flex items-center gap-4 bg-[#0a0a0a] text-white px-12 py-5 hover:bg-secondary transition-all">
<span className="font-headline text-xs tracking-[0.3em] uppercase">{t('whatsapp_btn')}</span>
</button>
</div>
</div>
</div>
{/* Minimalist Form Column */}
<div className="md:col-span-12 lg:col-span-7 bg-white p-12 md:p-20">
<h2 className="font-headline text-3xl mb-12 text-primary uppercase tracking-widest border-b border-outline-variant/10 pb-6">{t('form_title')}</h2>
<form className="space-y-12">
<div className="grid grid-cols-1 md:grid-cols-2 gap-12">
<div className="flex flex-col group">
<label className="font-label text-[10px] tracking-[0.2em] text-secondary uppercase mb-2 group-focus-within:text-primary transition-colors">{t('first_name_label')}</label>
<input type="text" className="border-b border-outline-variant py-3 focus:border-secondary transition-all outline-none bg-transparent font-body text-lg font-light" placeholder={t('first_name_placeholder')} />
</div>
<div className="flex flex-col group">
<label className="font-label text-[10px] tracking-[0.2em] text-secondary uppercase mb-2 group-focus-within:text-primary transition-colors">{t('last_name_label')}</label>
<input type="text" className="border-b border-outline-variant py-3 focus:border-secondary transition-all outline-none bg-transparent font-body text-lg font-light" placeholder={t('last_name_placeholder')} />
</div>
</div>
<div className="flex flex-col group">
<label className="font-label text-[10px] tracking-[0.2em] text-secondary uppercase mb-2 group-focus-within:text-primary transition-colors">{t('email_label')}</label>
<input type="email" className="border-b border-outline-variant py-3 focus:border-secondary transition-all outline-none bg-transparent font-body text-lg font-light" placeholder={t('email_placeholder')} />
</div>
<div className="flex flex-col group">
<label className="font-label text-[10px] tracking-[0.2em] text-secondary uppercase mb-2 group-focus-within:text-primary transition-colors">{t('yacht_label')}</label>
<select className="border-b border-outline-variant py-3 focus:border-secondary transition-all outline-none bg-transparent font-body text-lg font-light appearance-none">
<option>M/S MEIRA</option>
<option>M/Y PRINCESS MELDA</option>
<option>QUEEN OF SALMAKIS</option>
<option>DOLCE MARE</option>
<option>SUNWORLD-8</option>
</select>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-12">
<div className="flex flex-col group">
<label className="font-label text-[10px] tracking-[0.2em] text-secondary uppercase mb-2 group-focus-within:text-primary transition-colors">{t('charter_start')}</label>
<input type="date" className="border-b border-outline-variant py-3 focus:border-secondary transition-all outline-none bg-transparent font-body text-lg font-light" />
</div>
<div className="flex flex-col group">
<label className="font-label text-[10px] tracking-[0.2em] text-secondary uppercase mb-2 group-focus-within:text-primary transition-colors">{t('charter_end')}</label>
<input type="date" className="border-b border-outline-variant py-3 focus:border-secondary transition-all outline-none bg-transparent font-body text-lg font-light" />
</div>
</div>
<div className="flex flex-col pt-4 group">
<label className="font-label text-[10px] tracking-[0.2em] text-secondary uppercase mb-2 group-focus-within:text-primary transition-colors">{t('requirements_label')}</label>
<textarea rows={4} className="border-b border-outline-variant py-3 focus:border-secondary transition-all outline-none bg-transparent font-body text-lg font-light resize-none" placeholder={t('requirements_placeholder')}></textarea>
</div>
<button className="w-full bg-secondary text-white py-6 font-headline tracking-[0.4em] uppercase hover:bg-primary transition-all">{t('submit_btn')}</button>
</form>
</div>
</div>
</div>
</div>
);
}