Admin portal, public pages, footer, site config

2026-06-27 18:10:49 -05:00
parent 4bb3596412
commit 75da132327
9 changed files with 1011 additions and 227 deletions
@@ -0,0 +1,121 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import { FacebookIcon, InstagramIcon, WhatsAppIcon } from './icons';
+
+interface Config {
+  facebook_url?: string;
+  instagram_url?: string;
+  whatsapp_url?: string;
+  address?: string;
+  phone?: string;
+  email?: string;
+}
+
+const gold = '#E8A849';
+const navy = '#010D1E';
+const cream = '#f5f0e8';
+
+export default function Footer() {
+  const [config, setConfig] = useState<Config>({});
+
+  useEffect(() => {
+    fetch('/api/site-assets')
+      .then((res) => res.json())
+      .then((json) => setConfig(json.data || {}))
+      .catch(() => {});
+  }, []);
+
+  return (
+    <footer
+      style={{
+        background: navy,
+        color: cream,
+        padding: '3rem 2rem 2rem',
+        borderTop: '1px solid rgba(232,168,73,0.25)',
+      }}
+    >
+      <div
+        style={{
+          maxWidth: '72rem',
+          margin: '0 auto',
+          display: 'grid',
+          gridTemplateColumns: 'repeat(auto-fit, minmax(240px, 1fr))',
+          gap: '2rem',
+        }}
+      >
+        <div>
+          <h3 style={{ color: gold, fontSize: '18px', margin: '0 0 1rem', fontStyle: 'italic' }}>La Huasca</h3>
+          <p style={{ color: 'rgba(245,240,232,0.75)', lineHeight: 1.55, margin: 0 }}>
+            Hotel · Restaurant · Vineyard
+            <br />
+            A quiet corner of the Honduran highlands.
+          </p>
+        </div>
+
+        <div>
+          <h4 style={{ color: gold, fontSize: '14px', letterSpacing: '0.08em', textTransform: 'uppercase', margin: '0 0 1rem' }}>Contact</h4>
+          {config.address && <p style={{ margin: '0 0 0.5rem', color: 'rgba(245,240,232,0.8)' }}>{config.address}</p>}
+          {config.phone && <p style={{ margin: '0 0 0.5rem' }}><a href={`tel:${config.phone}`} style={{ color: cream, textDecoration: 'none' }}>{config.phone}</a></p>}
+          {config.email && <p style={{ margin: 0 }}><a href={`mailto:${config.email}`} style={{ color: cream, textDecoration: 'none' }}>{config.email}</a></p>}
+        </div>
+
+        <div>
+          <h4 style={{ color: gold, fontSize: '14px', letterSpacing: '0.08em', textTransform: 'uppercase', margin: '0 0 1rem' }}>Follow us</h4>
+          <div style={{ display: 'flex', gap: '1rem' }}>
+            {config.facebook_url && (
+              <a
+                href={config.facebook_url}
+                target="_blank"
+                rel="noreferrer"
+                style={{ color: cream, transition: 'color 0.2s, transform 0.2s' }}
+                onMouseEnter={(e) => { e.currentTarget.style.color = gold; e.currentTarget.style.transform = 'scale(1.12)'; }}
+                onMouseLeave={(e) => { e.currentTarget.style.color = cream; e.currentTarget.style.transform = 'scale(1)'; }}
+              >
+                <FacebookIcon size={22} />
+              </a>
+            )}
+            {config.instagram_url && (
+              <a
+                href={config.instagram_url}
+                target="_blank"
+                rel="noreferrer"
+                style={{ color: cream, transition: 'color 0.2s, transform 0.2s' }}
+                onMouseEnter={(e) => { e.currentTarget.style.color = gold; e.currentTarget.style.transform = 'scale(1.12)'; }}
+                onMouseLeave={(e) => { e.currentTarget.style.color = cream; e.currentTarget.style.transform = 'scale(1)'; }}
+              >
+                <InstagramIcon size={22} />
+              </a>
+            )}
+            {config.whatsapp_url && (
+              <a
+                href={config.whatsapp_url}
+                target="_blank"
+                rel="noreferrer"
+                style={{ color: cream, transition: 'color 0.2s, transform 0.2s' }}
+                onMouseEnter={(e) => { e.currentTarget.style.color = gold; e.currentTarget.style.transform = 'scale(1.12)'; }}
+                onMouseLeave={(e) => { e.currentTarget.style.color = cream; e.currentTarget.style.transform = 'scale(1)'; }}
+              >
+                <WhatsAppIcon size={22} />
+              </a>
+            )}
+          </div>
+        </div>
+      </div>
+
+      <div
+        style={{
+          maxWidth: '72rem',
+          margin: '2rem auto 0',
+          paddingTop: '1.5rem',
+          borderTop: '1px solid rgba(245,240,232,0.12)',
+          textAlign: 'center',
+          fontSize: '13px',
+          color: 'rgba(245,240,232,0.55)',
+        }}
+      >
+        © {new Date().getFullYear()} La Huasca. All rights reserved.
+      </div>
+    </footer>
+  );
+}