first commit

2026-06-03 03:59:46 +03:00
parent 5882fc12c1
commit bba389b513
30 changed files with 3153 additions and 149 deletions
@@ -0,0 +1,94 @@
+"use client";
+
+import { useTranslations } from 'next-intl';
+import { Instagram } from '@/components/InstagramIcon';
+import { Link, usePathname } from '@/i18n/routing';
+
+export default function Footer() {
+  const t = useTranslations('Footer');
+  const tNav = useTranslations('Navbar');
+
+  const pathname = usePathname();
+
+  const navLinks = [
+    { href: pathname === '/' ? '#about' : '/#about', label: tNav('about') },
+    { href: '/accommodation', label: tNav('accommodation') },
+    { href: pathname === '/' ? '#beach' : '/#beach', label: tNav('beach') },
+    { href: pathname === '/' ? '#dining' : '/#dining', label: tNav('dining') },
+    { href: pathname === '/' ? '#events' : '/#events', label: tNav('events') },
+    { href: pathname === '/' ? '#gallery' : '/#gallery', label: tNav('gallery') },
+    { href: pathname === '/' ? '#contact' : '/#contact', label: tNav('contact') },
+  ];
+
+  return (
+    <footer
+      className="text-white py-16 relative overflow-hidden"
+      style={{ background: '#080D18' }}
+    >
+      {/* Rainbow top border */}
+      <div
+        className="absolute top-0 left-0 right-0 h-[1px]"
+        style={{
+          background:
+            'linear-gradient(90deg, transparent 0%, #FF5A36 25%, #FFA827 50%, #00BFA5 75%, transparent 100%)',
+        }}
+      />
+
+      <div className="container mx-auto px-6 lg:px-12">
+        <div className="flex flex-col md:flex-row justify-between items-start gap-12 mb-12">
+
+          {/* Brand */}
+          <div>
+            <Link href="/" className="inline-flex flex-col mb-3">
+              <span className="font-heading text-5xl font-black uppercase tracking-tighter gradient-text-warm">
+                Kozmos
+              </span>
+              <span className="text-[10px] tracking-[0.5em] font-body uppercase text-white/30 mt-0.5">
+                Beach &amp; More
+              </span>
+            </Link>
+            <p className="text-white/35 text-sm mt-1">{t('tagline')}</p>
+          </div>
+
+          {/* Nav links */}
+          <div className="flex flex-wrap gap-x-7 gap-y-3">
+            {navLinks.map((link) => (
+              <Link
+                key={link.href}
+                href={link.href}
+                className="text-sm text-white/40 hover:text-white transition-colors"
+              >
+                {link.label}
+              </Link>
+            ))}
+          </div>
+
+          {/* Social */}
+          <a
+            href="https://www.instagram.com/kozmosbeach/"
+            target="_blank"
+            rel="noreferrer"
+            className="w-12 h-12 rounded-2xl border border-white/10 flex items-center justify-center text-white/40 hover:border-coral hover:text-coral transition-all"
+          >
+            <Instagram size={19} />
+          </a>
+        </div>
+
+        <div className="pt-8 border-t border-white/10 flex flex-col md:flex-row justify-between items-center gap-4 text-xs text-white/25">
+          <div>{t('rights')}</div>
+          <div>
+            Created by{' '}
+            <a 
+              href="https://ayris.tech" 
+              target="_blank" 
+              rel="noopener noreferrer"
+              className="text-white/40 hover:text-coral transition-colors"
+            >
+              ayris.tech
+            </a>
+          </div>
+        </div>
+      </div>
+    </footer>
+  );
+}