Remove all image assets, HTML files, stylesheets, scripts, and documentation from the project.
This commit is contained in:
becarta
118
src/components/Footer.astro
Normal file
118
src/components/Footer.astro
Normal file
@@ -0,0 +1,118 @@
|
||||
---
|
||||
import { ui, languages, defaultLang } from '../i18n/ui';
|
||||
|
||||
// Get current language from URL
|
||||
const { pathname } = Astro.url;
|
||||
// Extract the first path segment
|
||||
const pathSegments = pathname.split('/').filter(Boolean);
|
||||
const langCode = pathSegments[0];
|
||||
// Check if the first segment is a valid language code
|
||||
const currentLang = langCode && Object.keys(languages).includes(langCode)
|
||||
? langCode
|
||||
: defaultLang;
|
||||
|
||||
const t = ui[currentLang as keyof typeof ui];
|
||||
|
||||
const phone = t['phone'];
|
||||
const currentYear = new Date().getFullYear();
|
||||
---
|
||||
<footer class="relative pt-16 pb-10 bg-gradient-to-b from-black-deep to-black-medium overflow-hidden">
|
||||
<!-- Background elements -->
|
||||
<div class="absolute inset-0 bg-[url('/assets/grid-pattern.svg')] opacity-5 pointer-events-none"></div>
|
||||
<div class="absolute top-0 left-0 w-full h-0.5 bg-gradient-to-r from-transparent via-silver-metallic/20 to-transparent pointer-events-none"></div>
|
||||
|
||||
<div class="max-w-7xl mx-auto px-4">
|
||||
<!-- Top footer content -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-10 mb-12">
|
||||
<!-- Company info -->
|
||||
<div>
|
||||
<div class="flex items-center gap-3 mb-6">
|
||||
<div class="relative w-10 h-10 flex items-center justify-center shadow-lg">
|
||||
<img src="/Logo.png" alt="JPM Logo" class="h-8 w-8 object-contain" />
|
||||
</div>
|
||||
<span class="text-xl font-bold tracking-wide text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light">JPM</span>
|
||||
</div>
|
||||
<p class="text-silver-light/70 text-sm max-w-xs mb-4">
|
||||
{t['footer.description']}
|
||||
</p>
|
||||
<div class="flex items-center gap-2">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-gold" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path d="M2 3a1 1 0 011-1h2.153a1 1 0 01.986.836l.74 4.435a1 1 0 01-.54 1.06l-1.548.773a11.037 11.037 0 006.105 6.105l.774-1.548a1 1 0 011.059-.54l4.435.74a1 1 0 01.836.986V17a1 1 0 01-1 1h-2C7.82 18 2 12.18 2 5V3z" />
|
||||
</svg>
|
||||
<span class="text-silver-light text-sm font-medium">{phone}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Quick links -->
|
||||
<div class="z-10 relative">
|
||||
<h3 class="text-silver-metallic font-medium mb-6">{t['footer.quicklinks']}</h3>
|
||||
<ul class="space-y-3 text-sm">
|
||||
<li><a href={`/${currentLang}/#services`} class="text-silver-light/70 hover:text-silver-metallic transition-colors relative z-10 py-1 inline-block">{t['nav.services']}</a></li>
|
||||
<li><a href={`/${currentLang}/#about`} class="text-silver-light/70 hover:text-silver-metallic transition-colors relative z-10 py-1 inline-block">{t['nav.about']}</a></li>
|
||||
<li><a href={`/${currentLang}/#testimonials`} class="text-silver-light/70 hover:text-silver-metallic transition-colors relative z-10 py-1 inline-block">{t['nav.testimonials']}</a></li>
|
||||
<li><a href={`/${currentLang}/#contact`} class="text-silver-light/70 hover:text-silver-metallic transition-colors relative z-10 py-1 inline-block">{t['nav.contact']}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Connect -->
|
||||
<div>
|
||||
<h3 class="text-silver-metallic font-medium mb-6">{t['footer.connect']}</h3>
|
||||
<div class="flex gap-3 mb-5">
|
||||
<a href="#" class="w-9 h-9 rounded-full bg-black-deep border border-silver-dark/30 flex items-center justify-center text-silver-light/70 hover:text-accent-gold hover:border-accent-gold/50 transition-colors relative z-10">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M22 5.9c-.7.3-1.5.5-2.4.6.9-.5 1.5-1.3 1.8-2.3-.8.5-1.7.8-2.6 1-.8-.8-1.8-1.3-3-1.3-2.3 0-4.1 1.9-4.1 4.1 0 .3 0 .6.1.9-3.4-.2-6.5-1.8-8.5-4.3-.4.6-.6 1.3-.6 2.1 0 1.4.7 2.7 1.8 3.4-.7 0-1.3-.2-1.9-.5v.1c0 2 1.4 3.7 3.3 4.1-.3.1-.7.1-1.1.1-.3 0-.5 0-.8-.1.5 1.6 2 2.8 3.8 2.8-1.4 1.1-3.2 1.8-5.1 1.8-.3 0-.7 0-1-.1 1.8 1.2 4 1.8 6.3 1.8 7.5 0 11.7-6.3 11.7-11.7v-.5c.8-.6 1.5-1.3 2-2.1Z" />
|
||||
</svg>
|
||||
</a>
|
||||
<a href="#" class="w-9 h-9 rounded-full bg-black-deep border border-silver-dark/30 flex items-center justify-center text-silver-light/70 hover:text-accent-gold hover:border-accent-gold/50 transition-colors relative z-10">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M20 2a2 2 0 012 2v16a2 2 0 01-2 2H4a2 2 0 01-2-2V4a2 2 0 012-2h16zm-4 7.25a.75.75 0 00-.75-.75h-2.5v-2.5a.75.75 0 00-.75-.75h-2a.75.75 0 00-.75.75v2.5h-2.5a.75.75 0 00-.75.75v2c0 .414.336.75.75.75h2.5v2.5c0 .414.336.75.75.75h2a.75.75 0 00.75-.75v-2.5h2.5a.75.75 0 00.75-.75v-2z" />
|
||||
</svg>
|
||||
</a>
|
||||
<a href="#" class="w-9 h-9 rounded-full bg-black-deep border border-silver-dark/30 flex items-center justify-center text-silver-light/70 hover:text-accent-gold hover:border-accent-gold/50 transition-colors relative z-10">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M16 8.25a.75.75 0 00-.75-.75h-7a.75.75 0 000 1.5h7a.75.75 0 00.75-.75zM15.25 11.75a.75.75 0 01-.75.75h-7a.75.75 0 010-1.5h7a.75.75 0 01.75.75zM14.5 15.25a.75.75 0 000-1.5h-7a.75.75 0 000 1.5h7z" />
|
||||
<path d="M7.75 21.5C6.785 21.5 6 20.715 6 19.75v-15.5C6 3.283 6.784 2.5 7.75 2.5h8.5c.967 0 1.75.783 1.75 1.75v15.5c0 .965-.785 1.75-1.75 1.75h-8.5zm0-1.5h8.5a.25.25 0 00.25-.25v-15.5a.25.25 0 00-.25-.25h-8.5a.25.25 0 00-.25.25v15.5c0 .138.112.25.25.25z" />
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<p class="text-silver-dark text-xs">
|
||||
{t['footer.social']}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bottom footer content -->
|
||||
<div class="pt-6 border-t border-silver-dark/20 flex flex-col md:flex-row justify-between items-center gap-4">
|
||||
<div class="text-silver-dark text-xs">
|
||||
{t['footer.copyright'].replace('{year}', currentYear.toString())}
|
||||
</div>
|
||||
<div class="flex gap-6">
|
||||
<a href={`/${currentLang}/privacy/`} class="text-silver-dark text-xs hover:text-silver-light transition-colors relative z-10 py-1 inline-block">{t['footer.privacy']}</a>
|
||||
<a href={`/${currentLang}/terms/`} class="text-silver-dark text-xs hover:text-silver-light transition-colors relative z-10 py-1 inline-block">{t['footer.terms']}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
// Fix for footer links
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const footerLinks = document.querySelectorAll('footer a[href*="#"]');
|
||||
|
||||
footerLinks.forEach(link => {
|
||||
link.addEventListener('click', (e) => {
|
||||
const target = e.currentTarget as HTMLAnchorElement;
|
||||
const href = target.getAttribute('href');
|
||||
if (href && href.includes('#')) {
|
||||
const targetId = href.split('#')[1];
|
||||
const targetElement = document.getElementById(targetId);
|
||||
|
||||
if (targetElement) {
|
||||
e.preventDefault();
|
||||
targetElement.scrollIntoView({ behavior: 'smooth' });
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
40
src/components/Header.astro
Normal file
40
src/components/Header.astro
Normal file
@@ -0,0 +1,40 @@
|
||||
---
|
||||
import { ui, languages, defaultLang } from '../i18n/ui';
|
||||
import LanguageSelector from './LanguageSelector.astro';
|
||||
|
||||
// Get current language from URL
|
||||
const { pathname } = Astro.url;
|
||||
// Extract the first path segment
|
||||
const pathSegments = pathname.split('/').filter(Boolean);
|
||||
const langCode = pathSegments[0];
|
||||
// Check if the first segment is a valid language code
|
||||
const currentLang = langCode && Object.keys(languages).includes(langCode)
|
||||
? langCode
|
||||
: defaultLang;
|
||||
|
||||
const t = ui[currentLang as keyof typeof ui];
|
||||
|
||||
const phone = t['phone'];
|
||||
---
|
||||
<header class="sticky top-0 z-50 bg-gradient-to-r from-black-deep to-black-medium backdrop-blur-md border-b border-silver-dark/30">
|
||||
<div class="max-w-7xl mx-auto flex items-center justify-between px-4 py-3">
|
||||
<a href={`/${currentLang}/`} class="flex items-center gap-3 group">
|
||||
<div class="relative w-14 h-14 flex items-center justify-center shadow-lg">
|
||||
<img src="/Logo.png" alt="JPM Security Logo" class="h-12 w-12 object-contain transition-all group-hover:scale-110" />
|
||||
</div>
|
||||
<span class="text-xl font-bold tracking-wide text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light">JPM</span>
|
||||
</a>
|
||||
<div class="flex items-center gap-6">
|
||||
<LanguageSelector />
|
||||
<div class="flex flex-col items-end text-right">
|
||||
<span class="text-xl font-bold tracking-wide text-silver-light">Security & Services</span>
|
||||
<div class="flex items-center gap-2">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-gold" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path d="M2 3a1 1 0 011-1h2.153a1 1 0 01.986.836l.74 4.435a1 1 0 01-.54 1.06l-1.548.773a11.037 11.037 0 006.105 6.105l.774-1.548a1 1 0 011.059-.54l4.435.74a1 1 0 01.836.986V17a1 1 0 01-1 1h-2C7.82 18 2 12.18 2 5V3z" />
|
||||
</svg>
|
||||
<span class="text-silver-light text-sm font-medium">{phone}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
34
src/components/LanguageSelector.astro
Normal file
34
src/components/LanguageSelector.astro
Normal file
@@ -0,0 +1,34 @@
|
||||
---
|
||||
import { languages } from '../i18n/ui';
|
||||
|
||||
// Get the current URL path
|
||||
const { pathname } = Astro.url;
|
||||
|
||||
// Function to get the current language and generate the URL for a different language
|
||||
function getTargetPath(targetLang) {
|
||||
// Check if the current path starts with a language code, if so, replace it
|
||||
const langPathRegex = /^\/(en|nl)\//;
|
||||
const matches = pathname.match(langPathRegex);
|
||||
|
||||
if (matches) {
|
||||
return pathname.replace(langPathRegex, `/${targetLang}/`);
|
||||
}
|
||||
|
||||
// If no language code in the path, assume we're at the root
|
||||
// and add the target language code
|
||||
return `/${targetLang}/`;
|
||||
}
|
||||
---
|
||||
|
||||
<div class="flex items-center space-x-2">
|
||||
{Object.entries(languages).map(([lang, label]) => (
|
||||
<a
|
||||
href={getTargetPath(lang)}
|
||||
class={`text-sm px-2 py-1 rounded ${pathname.includes(`/${lang}/`) || (pathname === '/' && lang === 'en')
|
||||
? 'bg-accent-blue/20 text-silver-metallic font-medium'
|
||||
: 'text-silver-light/70 hover:text-silver-metallic'}`}
|
||||
>
|
||||
{label}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
22
src/components/ServiceCard.astro
Normal file
22
src/components/ServiceCard.astro
Normal file
@@ -0,0 +1,22 @@
|
||||
---
|
||||
const { icon, title, description, link } = Astro.props;
|
||||
---
|
||||
<a href={link} class="block group relative bg-gradient-to-br from-black-deep to-black-medium overflow-hidden rounded-xl border border-silver-dark/20 shadow-xl transition-all duration-300 hover:shadow-2xl hover:border-silver-metallic/50 hover:translate-y-[-5px]">
|
||||
<div class="absolute top-0 left-0 w-full h-1/3 bg-gradient-to-b from-accent-blue/10 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
|
||||
|
||||
<div class="p-8 flex flex-col items-center text-center z-10 relative">
|
||||
<div class="mb-6 text-silver-metallic w-16 h-16 flex items-center justify-center bg-black-deep/50 rounded-full border border-silver-dark/30 shadow-inner p-4 transition-all duration-300 group-hover:scale-110 group-hover:border-accent-gold/50">
|
||||
<Fragment set:html={icon} />
|
||||
</div>
|
||||
<h3 class="text-xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-4">{title}</h3>
|
||||
<p class="text-silver-light/80 text-base mb-6">{description}</p>
|
||||
<div class="mt-auto">
|
||||
<span class="inline-flex items-center text-accent-gold hover:text-accent-blue transition-colors duration-300 text-sm font-medium">
|
||||
Learn More
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 ml-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
189
src/i18n/ui.ts
Normal file
189
src/i18n/ui.ts
Normal file
@@ -0,0 +1,189 @@
|
||||
// Define the languages your site supports
|
||||
export const languages = {
|
||||
en: 'English',
|
||||
nl: 'Nederlands',
|
||||
};
|
||||
|
||||
// Set your default language
|
||||
export const defaultLang = 'en';
|
||||
|
||||
// Whether to show the default language in the URL - set to true to avoid redirect loops
|
||||
export const showDefaultLang = true;
|
||||
|
||||
// Translation dictionaries for UI strings
|
||||
export const ui = {
|
||||
en: {
|
||||
// Header
|
||||
'phone': '+1 (555) 123-4567',
|
||||
// Navigation
|
||||
'nav.services': 'Services',
|
||||
'nav.about': 'About Us',
|
||||
'nav.testimonials': 'Testimonials',
|
||||
'nav.contact': 'Contact',
|
||||
// Hero Section
|
||||
'hero.tagline': 'Professional. Discreet. Dependable.',
|
||||
'hero.subtitle': 'Security, Concierge, and Food Services — Tailored to Your Needs.',
|
||||
'hero.cta': 'Explore Our Services',
|
||||
'hero.scroll': 'Scroll Down',
|
||||
// Services Section
|
||||
'services.title': 'What We Offer',
|
||||
'services.heading': 'Our Services',
|
||||
'services.security.title': 'Security Services',
|
||||
'services.security.description': 'Event Security, Access Control, Surveillance',
|
||||
'services.concierge.title': 'Concierge Services',
|
||||
'services.concierge.description': 'Guest Handling, VIP Assistance, Parking',
|
||||
'services.food.title': 'Food Services',
|
||||
'services.food.description': 'Staff Refreshment, Venue Hospitality',
|
||||
// Service Detail Pages
|
||||
'services.back': 'Back to Services',
|
||||
'services.security.page.title': 'Security Services',
|
||||
'services.security.page.description': 'Professional security solutions tailored to your specific needs.',
|
||||
'services.security.page.content': 'Our highly trained security professionals provide comprehensive security services for events, venues, and private clients. We offer access control, surveillance, threat assessment, and emergency response capabilities. Each security plan is tailored to your specific requirements, ensuring maximum protection while maintaining a discreet and professional presence.',
|
||||
'services.security.page.features': 'Our Security Services Include:',
|
||||
'services.security.page.feature1': 'Event Security',
|
||||
'services.security.page.feature2': 'Access Control',
|
||||
'services.security.page.feature3': '24/7 Surveillance',
|
||||
'services.security.page.feature4': 'VIP Protection',
|
||||
'services.security.page.feature5': 'Risk Assessment',
|
||||
'services.concierge.page.title': 'Concierge Services',
|
||||
'services.concierge.page.description': 'Exceptional hospitality services for events and venues.',
|
||||
'services.concierge.page.content': 'Our concierge team provides premium hospitality services to ensure your guests experience the highest level of comfort and assistance. From guest reception and VIP handling to personal assistance and transportation coordination, our professional staff ensures every detail is managed with discretion and efficiency.',
|
||||
'services.concierge.page.features': 'Our Concierge Services Include:',
|
||||
'services.concierge.page.feature1': 'Guest Reception',
|
||||
'services.concierge.page.feature2': 'VIP Assistance',
|
||||
'services.concierge.page.feature3': 'Transportation Coordination',
|
||||
'services.concierge.page.feature4': 'Personal Assistance',
|
||||
'services.concierge.page.feature5': 'Event Information',
|
||||
'services.food.page.title': 'Food Services',
|
||||
'services.food.page.description': 'High-quality catering and hospitality solutions.',
|
||||
'services.food.page.content': 'Our food services division specializes in providing refreshments and hospitality solutions for staff and guests at events and venues. We focus on quality, presentation, and service, ensuring that all dietary requirements are met with professionalism and attention to detail.',
|
||||
'services.food.page.features': 'Our Food Services Include:',
|
||||
'services.food.page.feature1': 'Staff Refreshments',
|
||||
'services.food.page.feature2': 'Venue Hospitality',
|
||||
'services.food.page.feature3': 'Catering Coordination',
|
||||
'services.food.page.feature4': 'Dietary Accommodation',
|
||||
'services.food.page.feature5': 'Premium Service Options',
|
||||
// About Section
|
||||
'about.label': 'Who We Are',
|
||||
'about.title': 'About Us',
|
||||
'about.content': 'JPM Security & Services is built on the values of discretion, professionalism, and versatility. Our team is dedicated to providing tailored solutions for every client, whether you need vigilant security, attentive concierge, or seamless hospitality support.',
|
||||
'about.values': 'Our Core Values',
|
||||
'about.value1': 'Discretion',
|
||||
'about.value2': 'Professionalism',
|
||||
'about.value3': 'Versatility',
|
||||
// Testimonials Section
|
||||
'testimonials.label': 'Client Feedback',
|
||||
'testimonials.title': 'What Our Clients Say',
|
||||
// Contact Section
|
||||
'contact.label': 'Get in Touch',
|
||||
'contact.title': 'Contact Us',
|
||||
'contact.info.title': 'Contact Information',
|
||||
'contact.message.title': 'Send us a Message',
|
||||
'contact.message.prompt': 'Fill out the form below and we\'ll get back to you as soon as possible.',
|
||||
'contact.button': 'Contact Form Coming Soon',
|
||||
'contact.email': 'info@jpmsecurity.com',
|
||||
'contact.address': '123 Security Ave, Amsterdam',
|
||||
// Footer
|
||||
'footer.description': 'Professional security, concierge, and food services tailored to meet your unique requirements.',
|
||||
'footer.quicklinks': 'Quick Links',
|
||||
'footer.connect': 'Connect With Us',
|
||||
'footer.social': 'Join our social channels for the latest updates and security tips.',
|
||||
'footer.copyright': '© {year} JPM Security & Services. All rights reserved.',
|
||||
'footer.privacy': 'Privacy Policy',
|
||||
'footer.terms': 'Terms of Service',
|
||||
},
|
||||
nl: {
|
||||
// Header
|
||||
'phone': '+1 (555) 123-4567',
|
||||
// Navigation
|
||||
'nav.services': 'Diensten',
|
||||
'nav.about': 'Over Ons',
|
||||
'nav.testimonials': 'Getuigenissen',
|
||||
'nav.contact': 'Contact',
|
||||
// Hero Section
|
||||
'hero.tagline': 'Professioneel. Discreet. Betrouwbaar.',
|
||||
'hero.subtitle': 'Beveiliging, Conciërge en Cateringdiensten — Op Maat van Uw Behoeften.',
|
||||
'hero.cta': 'Ontdek Onze Diensten',
|
||||
'hero.scroll': 'Scroll Omlaag',
|
||||
// Services Section
|
||||
'services.title': 'Wat Wij Bieden',
|
||||
'services.heading': 'Onze Diensten',
|
||||
'services.security.title': 'Beveiligingsdiensten',
|
||||
'services.security.description': 'Evenementbeveiliging, Toegangscontrole, Surveillance',
|
||||
'services.concierge.title': 'Conciërgediensten',
|
||||
'services.concierge.description': 'Gastenontvangst, VIP-Assistentie, Parkeren',
|
||||
'services.food.title': 'Cateringdiensten',
|
||||
'services.food.description': 'Personeelsverversingen, Locatiehoreca',
|
||||
// Service Detail Pages
|
||||
'services.back': 'Terug naar Diensten',
|
||||
'services.security.page.title': 'Beveiligingsdiensten',
|
||||
'services.security.page.description': 'Professionele beveiligingsoplossingen op maat van uw specifieke behoeften.',
|
||||
'services.security.page.content': 'Onze hoogopgeleide beveiligingsprofessionals bieden uitgebreide beveiligingsdiensten voor evenementen, locaties en privéklanten. We bieden toegangscontrole, surveillance, dreigingsbeoordeling en noodrespons. Elk beveiligingsplan is afgestemd op uw specifieke eisen, zodat maximale bescherming wordt gegarandeerd terwijl een discrete en professionele aanwezigheid wordt gehandhaafd.',
|
||||
'services.security.page.features': 'Onze Beveiligingsdiensten Omvatten:',
|
||||
'services.security.page.feature1': 'Evenementbeveiliging',
|
||||
'services.security.page.feature2': 'Toegangscontrole',
|
||||
'services.security.page.feature3': '24/7 Surveillance',
|
||||
'services.security.page.feature4': 'VIP-Bescherming',
|
||||
'services.security.page.feature5': 'Risicobeoordeling',
|
||||
'services.concierge.page.title': 'Conciërgediensten',
|
||||
'services.concierge.page.description': 'Uitzonderlijke hospitalitydiensten voor evenementen en locaties.',
|
||||
'services.concierge.page.content': 'Ons conciërgeteam biedt premium hospitalitydiensten om ervoor te zorgen dat uw gasten het hoogste niveau van comfort en assistentie ervaren. Van gastontvangst en VIP-behandeling tot persoonlijke assistentie en transportcoördinatie, ons professionele personeel zorgt ervoor dat elk detail met discretie en efficiëntie wordt beheerd.',
|
||||
'services.concierge.page.features': 'Onze Conciërgediensten Omvatten:',
|
||||
'services.concierge.page.feature1': 'Gastontvangst',
|
||||
'services.concierge.page.feature2': 'VIP-Assistentie',
|
||||
'services.concierge.page.feature3': 'Transportcoördinatie',
|
||||
'services.concierge.page.feature4': 'Persoonlijke Assistentie',
|
||||
'services.concierge.page.feature5': 'Evenementinformatie',
|
||||
'services.food.page.title': 'Cateringdiensten',
|
||||
'services.food.page.description': 'Hoogwaardige catering- en hospitalityoplossingen.',
|
||||
'services.food.page.content': 'Onze cateringafdeling is gespecialiseerd in het verstrekken van verfrissingen en hospitalityoplossingen voor personeel en gasten bij evenementen en locaties. We richten ons op kwaliteit, presentatie en service, zodat aan alle dieetvereisten wordt voldaan met professionaliteit en aandacht voor detail.',
|
||||
'services.food.page.features': 'Onze Cateringdiensten Omvatten:',
|
||||
'services.food.page.feature1': 'Personeelsverversingen',
|
||||
'services.food.page.feature2': 'Locatiehoreca',
|
||||
'services.food.page.feature3': 'Cateringcoördinatie',
|
||||
'services.food.page.feature4': 'Dieetaccommodatie',
|
||||
'services.food.page.feature5': 'Premium Serviceopties',
|
||||
// About Section
|
||||
'about.label': 'Wie Wij Zijn',
|
||||
'about.title': 'Over Ons',
|
||||
'about.content': 'JPM Security & Services is gebouwd op de waarden van discretie, professionaliteit en veelzijdigheid. Ons team is toegewijd aan het leveren van oplossingen op maat voor elke klant, of u nu behoefte heeft aan waakzame beveiliging, attente conciërge, of naadloze horeca ondersteuning.',
|
||||
'about.values': 'Onze Kernwaarden',
|
||||
'about.value1': 'Discretie',
|
||||
'about.value2': 'Professionaliteit',
|
||||
'about.value3': 'Veelzijdigheid',
|
||||
// Testimonials Section
|
||||
'testimonials.label': 'Klantenfeedback',
|
||||
'testimonials.title': 'Wat Onze Klanten Zeggen',
|
||||
// Contact Section
|
||||
'contact.label': 'Neem Contact Op',
|
||||
'contact.title': 'Contact Ons',
|
||||
'contact.info.title': 'Contactgegevens',
|
||||
'contact.message.title': 'Stuur ons een Bericht',
|
||||
'contact.message.prompt': 'Vul het onderstaande formulier in en we nemen zo snel mogelijk contact met u op.',
|
||||
'contact.button': 'Contactformulier Binnenkort Beschikbaar',
|
||||
'contact.email': 'info@jpmsecurity.com',
|
||||
'contact.address': '123 Security Ave, Amsterdam',
|
||||
// Footer
|
||||
'footer.description': 'Professionele beveiliging, conciërge en catering diensten op maat van uw unieke behoeften.',
|
||||
'footer.quicklinks': 'Snelle Links',
|
||||
'footer.connect': 'Verbind Met Ons',
|
||||
'footer.social': 'Volg onze sociale kanalen voor de nieuwste updates en beveiligingstips.',
|
||||
'footer.copyright': '© {year} JPM Security & Services. Alle rechten voorbehouden.',
|
||||
'footer.privacy': 'Privacybeleid',
|
||||
'footer.terms': 'Servicevoorwaarden',
|
||||
},
|
||||
};
|
||||
|
||||
// Define routes by language, useful for translated paths
|
||||
export const routes = {
|
||||
en: {
|
||||
'services': 'services',
|
||||
'about': 'about',
|
||||
'testimonials': 'testimonials',
|
||||
},
|
||||
nl: {
|
||||
'services': 'diensten',
|
||||
'about': 'over-ons',
|
||||
'testimonials': 'getuigenissen',
|
||||
},
|
||||
};
|
||||
98
src/layouts/BaseLayout.astro
Normal file
98
src/layouts/BaseLayout.astro
Normal file
@@ -0,0 +1,98 @@
|
||||
---
|
||||
import '../styles/global.css';
|
||||
import { defaultLang, languages } from '../i18n/ui';
|
||||
|
||||
// Get current language from URL
|
||||
const { pathname } = Astro.url;
|
||||
// Extract the first path segment
|
||||
const pathSegments = pathname.split('/').filter(Boolean);
|
||||
const langCode = pathSegments[0];
|
||||
// Check if the first segment is a valid language code
|
||||
const currentLang = langCode && Object.keys(languages).includes(langCode)
|
||||
? langCode
|
||||
: defaultLang;
|
||||
|
||||
// Init AOS animation library on client-side
|
||||
---
|
||||
<!DOCTYPE html>
|
||||
<html lang={currentLang} class="dark scroll-smooth">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta name="description" content="JPM Security & Services: Professional, Discreet, Dependable. Security, Concierge, and Food Services tailored to your needs." />
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
|
||||
<!-- Preloads -->
|
||||
<link rel="preload" href="/fonts/Inter.woff2" as="font" type="font/woff2" crossorigin />
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
|
||||
<!-- AOS animations -->
|
||||
<link href="https://unpkg.com/aos@next/dist/aos.css" rel="stylesheet">
|
||||
|
||||
<title>JPM Security & Services | Professional, Discreet, Dependable</title>
|
||||
|
||||
<!-- Prevent infinite redirects -->
|
||||
<script is:inline>
|
||||
// Reset redirect count once the page is fully loaded
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
if (typeof sessionStorage !== 'undefined') {
|
||||
sessionStorage.setItem('redirectCount', '0');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style is:global>
|
||||
/* Ensure section ids have proper spacing for anchor navigation */
|
||||
section[id] {
|
||||
scroll-margin-top: 2rem;
|
||||
}
|
||||
|
||||
/* Ensure proper z-index layering */
|
||||
.relative {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* Fix for AOS animations that might create layers blocking interaction */
|
||||
[data-aos] {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
[data-aos] * {
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* Ensure links are always clickable */
|
||||
a, button {
|
||||
position: relative;
|
||||
z-index: 5;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="min-h-screen bg-black-deep text-silver-light font-sans antialiased selection:bg-accent-blue selection:text-silver-light">
|
||||
<slot />
|
||||
|
||||
<!-- Initialize AOS -->
|
||||
<script is:inline src="https://unpkg.com/aos@next/dist/aos.js"></script>
|
||||
<script is:inline>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
AOS.init({
|
||||
duration: 800,
|
||||
easing: 'ease-out-cubic',
|
||||
once: true,
|
||||
offset: 50,
|
||||
disableMutationObserver: false
|
||||
});
|
||||
|
||||
// Ensure AOS doesn't block interactions
|
||||
document.querySelectorAll('[data-aos]').forEach(el => {
|
||||
el.addEventListener('animationend', () => {
|
||||
el.style.pointerEvents = 'auto';
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
36
src/middleware.js
Normal file
36
src/middleware.js
Normal file
@@ -0,0 +1,36 @@
|
||||
// This is a client-side script to prevent infinite redirect loops
|
||||
// Import this in your BaseLayout component
|
||||
|
||||
export function handleLanguageRedirects() {
|
||||
// Only run in the browser
|
||||
if (typeof window === 'undefined') return;
|
||||
|
||||
// Track redirects to prevent infinite loops
|
||||
const redirectCount = sessionStorage.getItem('redirectCount') || 0;
|
||||
|
||||
// If we've redirected more than 3 times, stop redirecting to prevent infinite loops
|
||||
if (parseInt(redirectCount, 10) > 3) {
|
||||
console.warn('Too many redirects detected, stopping to prevent infinite loop');
|
||||
sessionStorage.setItem('redirectCount', '0');
|
||||
return;
|
||||
}
|
||||
|
||||
// Add logic here if needed to handle redirects
|
||||
// For example, detect language from URL and redirect if needed
|
||||
|
||||
// Increment redirect count when a redirect happens
|
||||
// This should be called right before redirecting
|
||||
function incrementRedirectCount() {
|
||||
const currentCount = parseInt(sessionStorage.getItem('redirectCount') || '0', 10);
|
||||
sessionStorage.setItem('redirectCount', (currentCount + 1).toString());
|
||||
}
|
||||
|
||||
// Reset redirect count when navigation is complete
|
||||
window.addEventListener('load', () => {
|
||||
sessionStorage.setItem('redirectCount', '0');
|
||||
});
|
||||
|
||||
return {
|
||||
incrementRedirectCount
|
||||
};
|
||||
}
|
||||
257
src/pages/[lang]/index.astro
Normal file
257
src/pages/[lang]/index.astro
Normal file
@@ -0,0 +1,257 @@
|
||||
---
|
||||
import BaseLayout from '../../layouts/BaseLayout.astro';
|
||||
import Header from '../../components/Header.astro';
|
||||
import Footer from '../../components/Footer.astro';
|
||||
import ServiceCard from '../../components/ServiceCard.astro';
|
||||
import { ui, languages, defaultLang } from '../../i18n/ui';
|
||||
|
||||
// Get language from the URL
|
||||
export async function getStaticPaths() {
|
||||
return Object.keys(languages).map(lang => {
|
||||
return { params: { lang } };
|
||||
});
|
||||
}
|
||||
|
||||
const { lang = defaultLang } = Astro.params;
|
||||
const t = ui[lang as keyof typeof ui];
|
||||
|
||||
// Get translations needed for multiple sections
|
||||
const phone = t['phone'];
|
||||
|
||||
const services = [
|
||||
{
|
||||
icon: '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-full h-full"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 11c0-1.657-1.343-3-3-3s-3 1.343-3 3 1.343 3 3 3 3-1.343 3-3zm0 0c0-1.657 1.343-3 3-3s3 1.343 3 3-1.343 3-3 3-3-1.343-3-3z" /></svg>',
|
||||
title: t['services.security.title'],
|
||||
description: t['services.security.description'],
|
||||
link: `/${lang}/services/security/`
|
||||
},
|
||||
{
|
||||
icon: '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-full h-full"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" /></svg>',
|
||||
title: t['services.concierge.title'],
|
||||
description: t['services.concierge.description'],
|
||||
link: `/${lang}/services/concierge/`
|
||||
},
|
||||
{
|
||||
icon: '<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-full h-full"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4 6h16M4 10h16M4 14h16M4 18h16" /></svg>',
|
||||
title: t['services.food.title'],
|
||||
description: t['services.food.description'],
|
||||
link: `/${lang}/services/food/`
|
||||
},
|
||||
];
|
||||
|
||||
const testimonials = [
|
||||
{ quote: 'JPM provided exceptional service and peace of mind at our event.', author: 'A.B., Event Manager' },
|
||||
{ quote: 'Professional, discreet, and always dependable.', author: 'C.D., Private Client' },
|
||||
{ quote: 'Their concierge team made our guests feel truly welcome.', author: 'E.F., Venue Director' },
|
||||
];
|
||||
---
|
||||
<BaseLayout>
|
||||
<Header />
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative min-h-[80vh] flex flex-col items-center justify-center py-20 overflow-hidden">
|
||||
<!-- Background elements -->
|
||||
<div class="absolute inset-0 -z-20">
|
||||
<div class="absolute inset-0 bg-gradient-to-b from-black-deep via-black-medium to-black-deep"></div>
|
||||
<div class="absolute inset-0 opacity-10 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-silver-metallic/20 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
<!-- Logo watermark -->
|
||||
<div class="absolute inset-0 -z-10 flex items-center justify-center opacity-10 pointer-events-none select-none">
|
||||
<img src="/Logo.png" alt="JPM Logo" class="w-[40rem] h-[40rem] object-contain mx-auto" loading="eager" />
|
||||
</div>
|
||||
|
||||
<!-- Blur overlay for text readability -->
|
||||
<div class="absolute inset-0 -z-5 backdrop-blur-[2px] bg-black-deep/30 pointer-events-none"></div>
|
||||
|
||||
<!-- Animated lines -->
|
||||
<div class="absolute inset-0 -z-10 overflow-hidden">
|
||||
<div class="absolute top-0 left-0 w-full h-0.5 bg-gradient-to-r from-transparent via-silver-metallic/30 to-transparent"></div>
|
||||
<div class="absolute bottom-0 left-0 w-full h-0.5 bg-gradient-to-r from-transparent via-silver-metallic/30 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="container mx-auto px-4 text-center relative z-10">
|
||||
<h1 class="text-5xl md:text-7xl font-extrabold mb-6">
|
||||
<span class="block text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light drop-shadow-xl">
|
||||
{t['hero.tagline']}
|
||||
</span>
|
||||
</h1>
|
||||
|
||||
<p class="text-xl md:text-2xl text-silver-light/90 mb-10 max-w-3xl mx-auto leading-relaxed">
|
||||
{t['hero.subtitle']}
|
||||
</p>
|
||||
|
||||
<a href="#services" class="inline-block bg-gradient-to-r from-accent-blue to-accent-blue/80 text-silver-light font-semibold px-8 py-3 rounded-full shadow-2xl hover:shadow-accent-blue/20 transition-all duration-300 hover:translate-y-[-2px]">
|
||||
{t['hero.cta']}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Scroll indicator -->
|
||||
<div class="absolute bottom-8 left-1/2 transform -translate-x-1/2 flex flex-col items-center">
|
||||
<span class="text-silver-light/50 text-sm mb-2">{t['hero.scroll']}</span>
|
||||
<div class="w-0.5 h-10 bg-gradient-to-b from-silver-metallic/50 to-transparent animate-pulse"></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Services Section -->
|
||||
<section id="services" class="relative py-24 px-4 bg-gradient-to-b from-black-deep to-black-medium">
|
||||
<div class="absolute inset-0 bg-[url('/assets/grid-pattern.svg')] opacity-5"></div>
|
||||
|
||||
<div class="max-w-7xl mx-auto">
|
||||
<div class="text-center mb-16">
|
||||
<span class="inline-block text-accent-gold text-sm font-medium tracking-wider uppercase mb-3">{t['services.title']}</span>
|
||||
<h2 class="text-3xl md:text-5xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">{t['services.heading']}</h2>
|
||||
<div class="w-24 h-1 bg-gradient-to-r from-silver-dark to-transparent rounded mx-auto"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-10">
|
||||
{services.map(service => (
|
||||
<ServiceCard
|
||||
icon={service.icon}
|
||||
title={service.title}
|
||||
description={service.description}
|
||||
link={service.link}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- About Us Section -->
|
||||
<section id="about" class="relative py-24 px-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium"></div>
|
||||
<div class="absolute inset-y-0 right-0 w-1/2 bg-gradient-to-l from-accent-blue/5 to-transparent"></div>
|
||||
|
||||
<div class="max-w-4xl mx-auto relative z-10">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-2xl border border-silver-dark/20 shadow-xl overflow-hidden">
|
||||
<div class="absolute top-0 right-0 w-full h-1 bg-gradient-to-r from-transparent via-accent-gold/30 to-transparent"></div>
|
||||
|
||||
<div class="p-10 md:p-12">
|
||||
<span class="inline-block text-accent-gold text-sm font-medium tracking-wider uppercase mb-3">{t['about.label']}</span>
|
||||
<h2 class="text-2xl md:text-3xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">{t['about.title']}</h2>
|
||||
|
||||
<p class="text-lg text-silver-light/80 mb-6 leading-relaxed">
|
||||
{t['about.content']}
|
||||
</p>
|
||||
|
||||
<div class="mt-8">
|
||||
<h3 class="text-silver-light text-lg font-medium mb-4">{t['about.values']}</h3>
|
||||
<ul class="flex flex-wrap gap-4">
|
||||
<li class="bg-gradient-to-r from-black-deep to-black-medium border border-silver-dark/30 rounded-full px-6 py-2 text-silver-metallic text-sm font-medium flex items-center gap-2">
|
||||
<span class="w-2 h-2 bg-accent-gold rounded-full"></span>
|
||||
{t['about.value1']}
|
||||
</li>
|
||||
<li class="bg-gradient-to-r from-black-deep to-black-medium border border-silver-dark/30 rounded-full px-6 py-2 text-silver-metallic text-sm font-medium flex items-center gap-2">
|
||||
<span class="w-2 h-2 bg-accent-gold rounded-full"></span>
|
||||
{t['about.value2']}
|
||||
</li>
|
||||
<li class="bg-gradient-to-r from-black-deep to-black-medium border border-silver-dark/30 rounded-full px-6 py-2 text-silver-metallic text-sm font-medium flex items-center gap-2">
|
||||
<span class="w-2 h-2 bg-accent-gold rounded-full"></span>
|
||||
{t['about.value3']}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Testimonials Section -->
|
||||
<section id="testimonials" class="relative py-24 px-4 bg-gradient-to-b from-black-medium to-black-deep">
|
||||
<div class="absolute inset-0 bg-[radial-gradient(circle_at_top_right,_var(--tw-gradient-stops))] from-accent-blue/5 to-transparent"></div>
|
||||
|
||||
<div class="max-w-7xl mx-auto relative z-10">
|
||||
<div class="text-center mb-16">
|
||||
<span class="inline-block text-accent-gold text-sm font-medium tracking-wider uppercase mb-3">{t['testimonials.label']}</span>
|
||||
<h2 class="text-3xl md:text-4xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">{t['testimonials.title']}</h2>
|
||||
<div class="w-24 h-1 bg-gradient-to-r from-silver-dark to-transparent rounded mx-auto"></div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||
{testimonials.map((t, i) => (
|
||||
<div class="backdrop-blur-sm bg-gradient-to-br from-black-deep/80 to-black-medium/80 border-l-2 border-accent-gold/50 rounded-lg p-8 shadow-xl">
|
||||
<svg class="w-8 h-8 text-accent-gold/30 mb-4" fill="currentColor" viewBox="0 0 24 24">
|
||||
<path d="M4.583 17.321C3.553 16.227 3 15 3 13.011c0-3.5 2.457-6.637 6.03-8.188l.893 1.378c-3.335 1.804-3.987 4.145-4.247 5.621.537-.278 1.24-.375 1.929-.311 1.804.167 3.226 1.648 3.226 3.489a3.5 3.5 0 01-3.5 3.5c-1.073 0-2.099-.49-2.748-1.179zm10 0C13.553 16.227 13 15 13 13.011c0-3.5 2.457-6.637 6.03-8.188l.893 1.378c-3.335 1.804-3.987 4.145-4.247 5.621.537-.278 1.24-.375 1.929-.311 1.804 .167 3.226 1.648 3.226 3.489a3.5 3.5 0 01-3.5 3.5c-1.073 0-2.099-.49-2.748-1.179z"></path>
|
||||
</svg>
|
||||
<p class="text-silver-light/90 text-lg italic mb-6 leading-relaxed">"{t.quote}"</p>
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="text-silver-dark text-sm font-medium">— {t.author}</div>
|
||||
<div class="flex">
|
||||
{Array(5).fill(0).map((_, idx) => (
|
||||
<svg class={`w-4 h-4 ${idx < 5 ? 'text-accent-gold' : 'text-silver-dark/30'}`} fill="currentColor" viewBox="0 0 20 20">
|
||||
<path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
|
||||
</svg>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Contact Section -->
|
||||
<section id="contact" class="relative py-24 px-4 bg-gradient-to-b from-black-deep to-black-medium">
|
||||
<div class="absolute inset-0 opacity-10 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-silver-metallic/20 to-transparent"></div>
|
||||
|
||||
<div class="max-w-4xl mx-auto relative z-10">
|
||||
<div class="text-center mb-12">
|
||||
<span class="inline-block text-accent-gold text-sm font-medium tracking-wider uppercase mb-3">{t['contact.label']}</span>
|
||||
<h2 class="text-3xl md:text-4xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">{t['contact.title']}</h2>
|
||||
<div class="w-24 h-1 bg-gradient-to-r from-silver-dark to-transparent rounded mx-auto"></div>
|
||||
</div>
|
||||
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-2xl border border-silver-dark/20 shadow-xl overflow-hidden">
|
||||
<div class="absolute top-0 right-0 w-full h-1 bg-gradient-to-r from-transparent via-accent-gold/30 to-transparent"></div>
|
||||
|
||||
<div class="p-10 md:p-12">
|
||||
<div class="flex flex-col md:flex-row gap-10 items-start justify-between">
|
||||
<div class="md:w-1/2">
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-4">{t['contact.info.title']}</h3>
|
||||
<div class="space-y-4">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-8 h-8 rounded-full bg-black-deep border border-silver-dark/30 flex items-center justify-center text-accent-gold">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
|
||||
</svg>
|
||||
</div>
|
||||
<span class="text-silver-light/80">{phone}</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-8 h-8 rounded-full bg-black-deep border border-silver-dark/30 flex items-center justify-center text-accent-gold">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
|
||||
</svg>
|
||||
</div>
|
||||
<span class="text-silver-light/80">{t['contact.email']}</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-8 h-8 rounded-full bg-black-deep border border-silver-dark/30 flex items-center justify-center text-accent-gold">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
|
||||
</svg>
|
||||
</div>
|
||||
<span class="text-silver-light/80">{t['contact.address']}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="md:w-1/2">
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-4">{t['contact.message.title']}</h3>
|
||||
<p class="text-silver-light/80 mb-6">{t['contact.message.prompt']}</p>
|
||||
<div class="space-y-4">
|
||||
<button class="w-full bg-gradient-to-r from-accent-blue to-accent-blue/80 text-silver-light font-semibold px-6 py-3 rounded-lg shadow-xl hover:shadow-accent-blue/20 transition-all duration-300 hover:translate-y-[-2px]">
|
||||
{t['contact.button']}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<Footer />
|
||||
</BaseLayout>
|
||||
133
src/pages/[lang]/privacy.astro
Normal file
133
src/pages/[lang]/privacy.astro
Normal file
@@ -0,0 +1,133 @@
|
||||
---
|
||||
import BaseLayout from '../../layouts/BaseLayout.astro';
|
||||
import Header from '../../components/Header.astro';
|
||||
import Footer from '../../components/Footer.astro';
|
||||
import { ui, languages, defaultLang } from '../../i18n/ui';
|
||||
|
||||
// Get language from the URL
|
||||
export async function getStaticPaths() {
|
||||
return Object.keys(languages).map(lang => {
|
||||
return { params: { lang } };
|
||||
});
|
||||
}
|
||||
|
||||
const { lang = defaultLang } = Astro.params;
|
||||
const t = ui[lang as keyof typeof ui];
|
||||
---
|
||||
|
||||
<BaseLayout>
|
||||
<Header />
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative pt-32 pb-12 overflow-hidden">
|
||||
<!-- Background elements -->
|
||||
<div class="absolute inset-0 -z-10">
|
||||
<div class="absolute inset-0 bg-gradient-to-b from-black-deep via-black-medium to-black-deep"></div>
|
||||
<div class="absolute inset-0 opacity-10 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-silver-metallic/20 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="container mx-auto px-4 relative z-10">
|
||||
<h1 class="text-4xl md:text-6xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">
|
||||
Privacy Policy
|
||||
</h1>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Main Content Section -->
|
||||
<section class="relative py-12 px-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium"></div>
|
||||
|
||||
<div class="max-w-4xl mx-auto relative z-10">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-2xl border border-silver-dark/20 shadow-xl overflow-hidden">
|
||||
<div class="p-8 md:p-10">
|
||||
<div class="prose prose-invert max-w-none text-silver-light/90">
|
||||
<p class="mb-6">Last updated: {new Date().toISOString().split('T')[0]}</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">1. Introduction</h2>
|
||||
<p class="mb-4">This Privacy Policy explains how JPM Security & Services ("we," "our," or "us") collects, uses, shares, and protects your personal information when you visit our website, use our services, or interact with us in any way.</p>
|
||||
<p class="mb-6">We are committed to protecting your privacy and complying with applicable data protection laws, including the General Data Protection Regulation (GDPR).</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">2. Information We Collect</h2>
|
||||
<p class="mb-4">We may collect the following types of information:</p>
|
||||
<ul class="list-disc pl-6 mb-6 space-y-2">
|
||||
<li><strong>Personal Information:</strong> Name, email address, phone number, and other contact details when you contact us through our website or sign up for our services.</li>
|
||||
<li><strong>Usage Data:</strong> Information about how you interact with our website, including IP address, browser type, pages visited, time spent on pages, and other browsing data.</li>
|
||||
<li><strong>Communication Data:</strong> Any information you provide when communicating with us via email, phone, or through our contact forms.</li>
|
||||
</ul>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">3. How We Use Your Information</h2>
|
||||
<p class="mb-4">We use your information for the following purposes:</p>
|
||||
<ul class="list-disc pl-6 mb-6 space-y-2">
|
||||
<li>To provide and improve our services</li>
|
||||
<li>To respond to your inquiries and communications</li>
|
||||
<li>To send you information about our services (with your consent)</li>
|
||||
<li>To ensure the security and functionality of our website</li>
|
||||
<li>To comply with legal obligations</li>
|
||||
</ul>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">4. Legal Basis for Processing</h2>
|
||||
<p class="mb-4">We process your personal data on the following legal grounds:</p>
|
||||
<ul class="list-disc pl-6 mb-6 space-y-2">
|
||||
<li><strong>Consent:</strong> Where you have given clear consent for us to process your personal data for a specific purpose.</li>
|
||||
<li><strong>Contract:</strong> Where processing is necessary for the performance of a contract with you or to take steps at your request before entering into a contract.</li>
|
||||
<li><strong>Legitimate Interests:</strong> Where processing is necessary for our legitimate interests or those of a third party, except where such interests are overridden by your interests or fundamental rights.</li>
|
||||
<li><strong>Legal Obligation:</strong> Where processing is necessary for compliance with a legal obligation to which we are subject.</li>
|
||||
</ul>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">5. Data Sharing and Disclosure</h2>
|
||||
<p class="mb-4">We may share your personal information with:</p>
|
||||
<ul class="list-disc pl-6 mb-6 space-y-2">
|
||||
<li>Service providers who help us operate our business and website</li>
|
||||
<li>Legal authorities when required by law or to protect our rights</li>
|
||||
<li>Business partners with your consent or when necessary to provide services</li>
|
||||
</ul>
|
||||
<p class="mb-6">We do not sell your personal information to third parties.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">6. Data Retention</h2>
|
||||
<p class="mb-6">We retain your personal information only for as long as necessary to fulfill the purposes for which we collected it, including for the purposes of satisfying any legal, accounting, or reporting requirements. To determine the appropriate retention period, we consider the amount, nature, and sensitivity of the data, the potential risk of harm from unauthorized use or disclosure, and applicable legal requirements.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">7. Your Data Protection Rights</h2>
|
||||
<p class="mb-4">Under the GDPR and other applicable data protection laws, you have the following rights:</p>
|
||||
<ul class="list-disc pl-6 mb-6 space-y-2">
|
||||
<li><strong>Right to Access:</strong> You can request a copy of the personal information we hold about you.</li>
|
||||
<li><strong>Right to Rectification:</strong> You can request that we correct any inaccurate or incomplete information.</li>
|
||||
<li><strong>Right to Erasure:</strong> You can request that we delete your personal information in certain circumstances.</li>
|
||||
<li><strong>Right to Restrict Processing:</strong> You can request that we restrict the processing of your information in certain circumstances.</li>
|
||||
<li><strong>Right to Data Portability:</strong> You can request to receive your personal information in a structured, machine-readable format.</li>
|
||||
<li><strong>Right to Object:</strong> You can object to our processing of your personal information in certain circumstances.</li>
|
||||
<li><strong>Right to Withdraw Consent:</strong> Where we rely on your consent to process your personal information, you have the right to withdraw that consent at any time.</li>
|
||||
</ul>
|
||||
<p class="mb-6">To exercise any of these rights, please contact us using the information provided in the "Contact Us" section below.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">8. Cookies and Similar Technologies</h2>
|
||||
<p class="mb-6">Our website uses cookies and similar technologies to enhance your browsing experience, analyze site traffic, and understand where our visitors are coming from. You can control cookies through your browser settings and other tools. For more information about our use of cookies, please see our Cookie Policy.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">9. Data Security</h2>
|
||||
<p class="mb-6">We implement appropriate technical and organizational measures to protect your personal information from unauthorized access, disclosure, alteration, or destruction. However, no method of transmission over the Internet or electronic storage is 100% secure, so we cannot guarantee absolute security.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">10. International Data Transfers</h2>
|
||||
<p class="mb-6">Your personal information may be transferred to, and processed in, countries other than the country in which you reside. These countries may have data protection laws that are different from the laws of your country. We ensure that appropriate safeguards are in place to protect your personal information when it is transferred internationally.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">11. Children's Privacy</h2>
|
||||
<p class="mb-6">Our services are not directed to individuals under the age of 16. We do not knowingly collect personal information from children. If we become aware that we have collected personal information from a child without parental consent, we will take steps to delete that information.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">12. Changes to This Privacy Policy</h2>
|
||||
<p class="mb-6">We may update this Privacy Policy from time to time to reflect changes in our practices or for other operational, legal, or regulatory reasons. We will notify you of any material changes by posting the updated policy on our website or by other means as required by law.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">13. Contact Us</h2>
|
||||
<p class="mb-6">If you have any questions, concerns, or requests regarding this Privacy Policy or our data practices, please contact us at:</p>
|
||||
<p class="mb-2">JPM Security & Services</p>
|
||||
<p class="mb-2">Email: privacy@jpmsecurityservices.com</p>
|
||||
<p class="mb-6">Phone: [Your phone number]</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">14. Data Protection Authority</h2>
|
||||
<p class="mb-6">If you are located in the European Economic Area (EEA) and believe we are unlawfully processing your personal information, you also have the right to complain to your local data protection supervisory authority.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<Footer />
|
||||
</BaseLayout>
|
||||
150
src/pages/[lang]/services/concierge/index.astro
Normal file
150
src/pages/[lang]/services/concierge/index.astro
Normal file
@@ -0,0 +1,150 @@
|
||||
---
|
||||
import BaseLayout from '../../../../layouts/BaseLayout.astro';
|
||||
import Header from '../../../../components/Header.astro';
|
||||
import Footer from '../../../../components/Footer.astro';
|
||||
import { ui, languages, defaultLang } from '../../../../i18n/ui';
|
||||
|
||||
// Get language from the URL
|
||||
export async function getStaticPaths() {
|
||||
return Object.keys(languages).map(lang => {
|
||||
return { params: { lang } };
|
||||
});
|
||||
}
|
||||
|
||||
const { lang = defaultLang } = Astro.params;
|
||||
const t = ui[lang as keyof typeof ui];
|
||||
---
|
||||
|
||||
<BaseLayout>
|
||||
<Header />
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative pt-32 pb-20 overflow-hidden">
|
||||
<!-- Background elements -->
|
||||
<div class="absolute inset-0 -z-10">
|
||||
<div class="absolute inset-0 bg-gradient-to-b from-black-deep via-black-medium to-black-deep"></div>
|
||||
<div class="absolute inset-0 opacity-10 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-silver-metallic/20 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="container mx-auto px-4 relative z-10">
|
||||
<div class="mb-8">
|
||||
<a href={`/${lang}/#services`} class="inline-flex items-center text-silver-light/70 hover:text-accent-gold transition-colors">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
{t['services.back']}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<h1 class="text-4xl md:text-6xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">
|
||||
{t['services.concierge.page.title']}
|
||||
</h1>
|
||||
|
||||
<p class="text-xl text-silver-light/90 mb-12 max-w-3xl leading-relaxed">
|
||||
{t['services.concierge.page.description']}
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Main Content Section -->
|
||||
<section class="relative py-16 px-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium"></div>
|
||||
|
||||
<div class="max-w-6xl mx-auto relative z-10">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-16">
|
||||
<!-- Left Column: Image -->
|
||||
<div class="relative rounded-2xl overflow-hidden h-full min-h-[400px] order-2 md:order-1">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium opacity-40"></div>
|
||||
<img src="/assets/concierge-service.jpg" alt="Concierge Services" class="absolute inset-0 w-full h-full object-cover" onerror="this.src='/Logo.png';this.classList.add('p-12', 'object-contain', 'opacity-10');" />
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black-deep to-transparent"></div>
|
||||
|
||||
<!-- Contact box -->
|
||||
<div class="absolute bottom-0 left-0 right-0 p-8">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/80 backdrop-blur-sm rounded-xl border border-silver-dark/30 p-6">
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-4">Elevate Your Guest Experience</h3>
|
||||
<p class="text-silver-light/70 text-sm mb-6">Contact us today to learn how our concierge services can enhance your event or venue.</p>
|
||||
<a href={`/${lang}/#contact`} class="inline-block bg-gradient-to-r from-accent-blue to-accent-blue/80 text-silver-light font-medium px-6 py-3 rounded-lg shadow-xl hover:shadow-accent-blue/20 transition-all duration-300 hover:translate-y-[-2px] w-full text-center">
|
||||
Contact Us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column: Content -->
|
||||
<div class="order-1 md:order-2">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-2xl border border-silver-dark/20 shadow-xl overflow-hidden h-full">
|
||||
<div class="absolute top-0 right-0 w-full h-1 bg-gradient-to-r from-transparent via-accent-gold/30 to-transparent"></div>
|
||||
|
||||
<div class="p-8 md:p-10">
|
||||
<p class="text-lg text-silver-light/80 mb-8 leading-relaxed">
|
||||
{t['services.concierge.page.content']}
|
||||
</p>
|
||||
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-6">{t['services.concierge.page.features']}</h3>
|
||||
<ul class="space-y-4">
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.concierge.page.feature1']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Professional welcoming and assistance for all guests.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.concierge.page.feature2']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Personalized service for high-profile and important guests.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.concierge.page.feature3']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Arranging transportation and managing arrival/departure logistics.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.concierge.page.feature4']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Dedicated support for special requests and individual needs.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.concierge.page.feature5']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Providing guidance on event schedules, venue facilities, and local amenities.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<Footer />
|
||||
</BaseLayout>
|
||||
151
src/pages/[lang]/services/food/index.astro
Normal file
151
src/pages/[lang]/services/food/index.astro
Normal file
@@ -0,0 +1,151 @@
|
||||
---
|
||||
import BaseLayout from '../../../../layouts/BaseLayout.astro';
|
||||
import Header from '../../../../components/Header.astro';
|
||||
import Footer from '../../../../components/Footer.astro';
|
||||
import { ui, languages, defaultLang } from '../../../../i18n/ui';
|
||||
|
||||
// Get language from the URL
|
||||
export async function getStaticPaths() {
|
||||
return Object.keys(languages).map(lang => {
|
||||
return { params: { lang } };
|
||||
});
|
||||
}
|
||||
|
||||
const { lang = defaultLang } = Astro.params;
|
||||
const t = ui[lang as keyof typeof ui];
|
||||
---
|
||||
|
||||
<BaseLayout>
|
||||
<Header />
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative pt-32 pb-20 overflow-hidden">
|
||||
<!-- Background elements -->
|
||||
<div class="absolute inset-0 -z-10">
|
||||
<div class="absolute inset-0 bg-gradient-to-b from-black-deep via-black-medium to-black-deep"></div>
|
||||
<div class="absolute inset-0 opacity-10 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-silver-metallic/20 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="container mx-auto px-4 relative z-10">
|
||||
<div class="mb-8">
|
||||
<a href={`/${lang}/#services`} class="inline-flex items-center text-silver-light/70 hover:text-accent-gold transition-colors">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
{t['services.back']}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<h1 class="text-4xl md:text-6xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">
|
||||
{t['services.food.page.title']}
|
||||
</h1>
|
||||
|
||||
<p class="text-xl text-silver-light/90 mb-12 max-w-3xl leading-relaxed">
|
||||
{t['services.food.page.description']}
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Main Content Section -->
|
||||
<section class="relative py-16 px-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium"></div>
|
||||
|
||||
<div class="max-w-6xl mx-auto relative z-10">
|
||||
<!-- Features Grid -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-xl border border-silver-dark/20 shadow-xl overflow-hidden p-6">
|
||||
<div class="w-12 h-12 flex items-center justify-center bg-accent-blue/10 rounded-full mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-accent-blue" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg font-semibold text-silver-metallic mb-2">{t['services.food.page.feature1']}</h3>
|
||||
<p class="text-silver-light/70 text-sm">Quality refreshments for staff at events and venues, ensuring they remain energized and focused.</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-xl border border-silver-dark/20 shadow-xl overflow-hidden p-6">
|
||||
<div class="w-12 h-12 flex items-center justify-center bg-accent-blue/10 rounded-full mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-accent-blue" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 15.546c-.523 0-1.046.151-1.5.454a2.704 2.704 0 01-3 0 2.704 2.704 0 00-3 0 2.704 2.704 0 01-3 0 2.704 2.704 0 00-3 0 2.701 2.701 0 00-1.5-.454M9 6v2m3-2v2m3-2v2M9 3h.01M12 3h.01M15 3h.01M21 21v-7a2 2 0 00-2-2H5a2 2 0 00-2 2v7h18zm-3-9v-2a2 2 0 00-2-2H8a2 2 0 00-2 2v2h12z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg font-semibold text-silver-metallic mb-2">{t['services.food.page.feature2']}</h3>
|
||||
<p class="text-silver-light/70 text-sm">Premium hospitality services for venues, creating a welcoming atmosphere for all guests.</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-xl border border-silver-dark/20 shadow-xl overflow-hidden p-6">
|
||||
<div class="w-12 h-12 flex items-center justify-center bg-accent-blue/10 rounded-full mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-accent-blue" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg font-semibold text-silver-metallic mb-2">{t['services.food.page.feature3']}</h3>
|
||||
<p class="text-silver-light/70 text-sm">Seamless coordination with caterers and food service providers for your event needs.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Main Content -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-16">
|
||||
<!-- Left Column: Content -->
|
||||
<div>
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-2xl border border-silver-dark/20 shadow-xl overflow-hidden h-full">
|
||||
<div class="absolute top-0 right-0 w-full h-1 bg-gradient-to-r from-transparent via-accent-gold/30 to-transparent"></div>
|
||||
|
||||
<div class="p-8 md:p-10">
|
||||
<p class="text-lg text-silver-light/80 mb-8 leading-relaxed">
|
||||
{t['services.food.page.content']}
|
||||
</p>
|
||||
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-6">Additional Services</h3>
|
||||
<ul class="space-y-4">
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.food.page.feature4']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Catering for special dietary requirements and restrictions.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.food.page.feature5']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Enhanced service offerings for executive and VIP hospitality needs.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column: Image -->
|
||||
<div class="relative rounded-2xl overflow-hidden h-full min-h-[400px]">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium opacity-40"></div>
|
||||
<img src="/assets/food-service.jpg" alt="Food Services" class="absolute inset-0 w-full h-full object-cover" onerror="this.src='/Logo.png';this.classList.add('p-12', 'object-contain', 'opacity-10');" />
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black-deep to-transparent"></div>
|
||||
|
||||
<!-- Contact box -->
|
||||
<div class="absolute bottom-0 left-0 right-0 p-8">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/80 backdrop-blur-sm rounded-xl border border-silver-dark/30 p-6">
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-4">Quality Hospitality Solutions</h3>
|
||||
<p class="text-silver-light/70 text-sm mb-6">Contact us to discuss how our food services can enhance your event or venue experience.</p>
|
||||
<a href={`/${lang}/#contact`} class="inline-block bg-gradient-to-r from-accent-blue to-accent-blue/80 text-silver-light font-medium px-6 py-3 rounded-lg shadow-xl hover:shadow-accent-blue/20 transition-all duration-300 hover:translate-y-[-2px] w-full text-center">
|
||||
Contact Us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<Footer />
|
||||
</BaseLayout>
|
||||
150
src/pages/[lang]/services/security/index.astro
Normal file
150
src/pages/[lang]/services/security/index.astro
Normal file
@@ -0,0 +1,150 @@
|
||||
---
|
||||
import BaseLayout from '../../../../layouts/BaseLayout.astro';
|
||||
import Header from '../../../../components/Header.astro';
|
||||
import Footer from '../../../../components/Footer.astro';
|
||||
import { ui, languages, defaultLang } from '../../../../i18n/ui';
|
||||
|
||||
// Get language from the URL
|
||||
export async function getStaticPaths() {
|
||||
return Object.keys(languages).map(lang => {
|
||||
return { params: { lang } };
|
||||
});
|
||||
}
|
||||
|
||||
const { lang = defaultLang } = Astro.params;
|
||||
const t = ui[lang as keyof typeof ui];
|
||||
---
|
||||
|
||||
<BaseLayout>
|
||||
<Header />
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative pt-32 pb-20 overflow-hidden">
|
||||
<!-- Background elements -->
|
||||
<div class="absolute inset-0 -z-10">
|
||||
<div class="absolute inset-0 bg-gradient-to-b from-black-deep via-black-medium to-black-deep"></div>
|
||||
<div class="absolute inset-0 opacity-10 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-silver-metallic/20 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="container mx-auto px-4 relative z-10">
|
||||
<div class="mb-8">
|
||||
<a href={`/${lang}/#services`} class="inline-flex items-center text-silver-light/70 hover:text-accent-gold transition-colors">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
{t['services.back']}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<h1 class="text-4xl md:text-6xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">
|
||||
{t['services.security.page.title']}
|
||||
</h1>
|
||||
|
||||
<p class="text-xl text-silver-light/90 mb-12 max-w-3xl leading-relaxed">
|
||||
{t['services.security.page.description']}
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Main Content Section -->
|
||||
<section class="relative py-16 px-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium"></div>
|
||||
|
||||
<div class="max-w-6xl mx-auto relative z-10">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-16">
|
||||
<!-- Left Column: Content -->
|
||||
<div>
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-2xl border border-silver-dark/20 shadow-xl overflow-hidden h-full">
|
||||
<div class="absolute top-0 right-0 w-full h-1 bg-gradient-to-r from-transparent via-accent-gold/30 to-transparent"></div>
|
||||
|
||||
<div class="p-8 md:p-10">
|
||||
<p class="text-lg text-silver-light/80 mb-8 leading-relaxed">
|
||||
{t['services.security.page.content']}
|
||||
</p>
|
||||
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-6">{t['services.security.page.features']}</h3>
|
||||
<ul class="space-y-4">
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.security.page.feature1']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Professional security presence for public and private events.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.security.page.feature2']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Controlled entry systems and identity verification procedures.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.security.page.feature3']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Continuous monitoring and vigilant security oversight.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.security.page.feature4']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Specialist protection for high-profile individuals and assets.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.security.page.feature5']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Comprehensive evaluation of security vulnerabilities and threats.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column: Image -->
|
||||
<div class="relative rounded-2xl overflow-hidden h-full min-h-[400px]">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium opacity-40"></div>
|
||||
<img src="/assets/security-service.jpg" alt="Security Services" class="absolute inset-0 w-full h-full object-cover" onerror="this.src='/Logo.png';this.classList.add('p-12', 'object-contain', 'opacity-10');" />
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black-deep to-transparent"></div>
|
||||
|
||||
<!-- Contact box -->
|
||||
<div class="absolute bottom-0 left-0 right-0 p-8">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/80 backdrop-blur-sm rounded-xl border border-silver-dark/30 p-6">
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-4">Need Security Services?</h3>
|
||||
<p class="text-silver-light/70 text-sm mb-6">Contact us today to discuss your security requirements and receive a tailored solution.</p>
|
||||
<a href={`/${lang}/#contact`} class="inline-block bg-gradient-to-r from-accent-blue to-accent-blue/80 text-silver-light font-medium px-6 py-3 rounded-lg shadow-xl hover:shadow-accent-blue/20 transition-all duration-300 hover:translate-y-[-2px] w-full text-center">
|
||||
Contact Us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<Footer />
|
||||
</BaseLayout>
|
||||
121
src/pages/[lang]/terms.astro
Normal file
121
src/pages/[lang]/terms.astro
Normal file
@@ -0,0 +1,121 @@
|
||||
---
|
||||
import BaseLayout from '../../layouts/BaseLayout.astro';
|
||||
import Header from '../../components/Header.astro';
|
||||
import Footer from '../../components/Footer.astro';
|
||||
import { ui, languages, defaultLang } from '../../i18n/ui';
|
||||
|
||||
// Get language from the URL
|
||||
export async function getStaticPaths() {
|
||||
return Object.keys(languages).map(lang => {
|
||||
return { params: { lang } };
|
||||
});
|
||||
}
|
||||
|
||||
const { lang = defaultLang } = Astro.params;
|
||||
const t = ui[lang as keyof typeof ui];
|
||||
---
|
||||
|
||||
<BaseLayout>
|
||||
<Header />
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative pt-32 pb-12 overflow-hidden">
|
||||
<!-- Background elements -->
|
||||
<div class="absolute inset-0 -z-10">
|
||||
<div class="absolute inset-0 bg-gradient-to-b from-black-deep via-black-medium to-black-deep"></div>
|
||||
<div class="absolute inset-0 opacity-10 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-silver-metallic/20 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="container mx-auto px-4 relative z-10">
|
||||
<h1 class="text-4xl md:text-6xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">
|
||||
Terms of Service
|
||||
</h1>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Main Content Section -->
|
||||
<section class="relative py-12 px-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium"></div>
|
||||
|
||||
<div class="max-w-4xl mx-auto relative z-10">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-2xl border border-silver-dark/20 shadow-xl overflow-hidden">
|
||||
<div class="p-8 md:p-10">
|
||||
<div class="prose prose-invert max-w-none text-silver-light/90">
|
||||
<p class="mb-6">Last updated: {new Date().toISOString().split('T')[0]}</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">1. Introduction</h2>
|
||||
<p class="mb-4">These Terms of Service ("Terms") govern your access to and use of the website and services provided by JPM Security & Services ("we," "our," or "us").</p>
|
||||
<p class="mb-6">By accessing or using our services, you agree to be bound by these Terms. If you do not agree to these Terms, you should not access or use our services.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">2. Service Description</h2>
|
||||
<p class="mb-6">JPM Security & Services provides security, concierge, and food services as described on our website. Our services may include, but are not limited to, security personnel, event management, hospitality services, and related consultancy.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">3. Eligibility</h2>
|
||||
<p class="mb-6">To use our services, you must be at least 18 years old and have the legal capacity to enter into binding contracts. If you are accessing or using our services on behalf of a company or other legal entity, you represent that you have the authority to bind such entity to these Terms.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">4. User Accounts</h2>
|
||||
<p class="mb-4">When you create an account with us, you must provide accurate, complete, and current information at all times. Failure to do so constitutes a breach of the Terms, which may result in immediate termination of your account.</p>
|
||||
<p class="mb-6">You are responsible for safeguarding the password that you use to access our services and for any activities or actions under your account. We encourage you to use "strong" passwords (passwords that use a combination of upper and lower case letters, numbers, and symbols) with your account.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">5. User Conduct</h2>
|
||||
<p class="mb-4">You agree not to engage in any of the following prohibited activities:</p>
|
||||
<ul class="list-disc pl-6 mb-6 space-y-2">
|
||||
<li>Using our services for any illegal purpose or in violation of any local, state, national, or international law</li>
|
||||
<li>Harassing, threatening, or intimidating any person or entity</li>
|
||||
<li>Impersonating any person or entity, or falsely stating or otherwise misrepresenting your affiliation with a person or entity</li>
|
||||
<li>Interfering with or disrupting the services or servers or networks connected to the services</li>
|
||||
<li>Attempting to gain unauthorized access to any portion of the services or any other systems or networks connected to the services</li>
|
||||
</ul>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">6. Intellectual Property Rights</h2>
|
||||
<p class="mb-4">The content on our website, including text, graphics, logos, images, and software, is the property of JPM Security & Services or its licensors and is protected by copyright, trademark, and other intellectual property laws.</p>
|
||||
<p class="mb-6">You may not reproduce, distribute, modify, create derivative works of, publicly display, publicly perform, republish, download, store, or transmit any of the material on our website, except as permitted by law or with our prior written consent.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">7. Content Standards</h2>
|
||||
<p class="mb-6">Any content you submit to our website or services must comply with all applicable laws and regulations and must not infringe on any third party's rights. We reserve the right to remove or refuse to display any content that we believe violates the Terms or that may expose us or other users to any harm or liability.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">8. Service Modifications</h2>
|
||||
<p class="mb-6">We reserve the right to modify, suspend, or discontinue any part of our services at any time, with or without notice. We shall not be liable to you or any third party for any modification, suspension, or discontinuance of our services.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">9. Fees and Payment</h2>
|
||||
<p class="mb-4">If you engage our services, you agree to pay all fees associated with such services. All fees are non-refundable unless otherwise specified in writing.</p>
|
||||
<p class="mb-6">We reserve the right to change our fees at any time, and such changes will be posted on our website and will apply to any services provided after the date of the change.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">10. Termination</h2>
|
||||
<p class="mb-6">We may terminate or suspend your access to our services immediately, without prior notice or liability, for any reason whatsoever, including, without limitation, if you breach the Terms. Upon termination, your right to use our services will immediately cease.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">11. Disclaimer of Warranties</h2>
|
||||
<p class="mb-6">Our services are provided on an "as is" and "as available" basis. We make no warranties, expressed or implied, regarding the operation of our services or the information, content, or materials included therein. To the fullest extent permitted by law, we disclaim all warranties, including but not limited to, implied warranties of merchantability and fitness for a particular purpose.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">12. Limitation of Liability</h2>
|
||||
<p class="mb-6">To the maximum extent permitted by law, in no event shall we be liable for any damages whatsoever, including but not limited to, direct, indirect, special, incidental, or consequential damages, arising out of or in connection with the use or inability to use our services or any content provided on or through our services, even if we have been advised of the possibility of such damages.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">13. Indemnification</h2>
|
||||
<p class="mb-6">You agree to indemnify, defend, and hold harmless JPM Security & Services, its officers, directors, employees, agents, licensors, and suppliers from and against all losses, expenses, damages, and costs, including reasonable attorneys' fees, resulting from any violation of these Terms or any activity related to your account (including negligent or wrongful conduct) by you or any other person accessing our services using your account.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">14. Governing Law</h2>
|
||||
<p class="mb-6">These Terms shall be governed by and construed in accordance with the laws of [Your Country], without regard to its conflict of law provisions. Our failure to enforce any right or provision of these Terms will not be considered a waiver of those rights.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">15. Dispute Resolution</h2>
|
||||
<p class="mb-6">Any dispute arising out of or relating to these Terms, or the breach thereof, shall be settled by arbitration administered by [Arbitration Body] in accordance with its rules, and judgment on the award rendered by the arbitrator(s) may be entered in any court having jurisdiction thereof.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">16. Severability</h2>
|
||||
<p class="mb-6">If any provision of these Terms is held to be invalid or unenforceable by a court, the remaining provisions of these Terms will remain in effect.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">17. Changes to Terms</h2>
|
||||
<p class="mb-6">We reserve the right, at our sole discretion, to modify or replace these Terms at any time. We will provide notice of any changes by posting the new Terms on our website. Your continued use of our services after any such changes constitutes your acceptance of the new Terms.</p>
|
||||
|
||||
<h2 class="text-2xl text-silver-metallic font-semibold mb-4">18. Contact Information</h2>
|
||||
<p class="mb-6">If you have any questions about these Terms, please contact us at:</p>
|
||||
<p class="mb-2">JPM Security & Services</p>
|
||||
<p class="mb-2">Email: legal@jpmsecurityservices.com</p>
|
||||
<p class="mb-6">Phone: [Your phone number]</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<Footer />
|
||||
</BaseLayout>
|
||||
143
src/pages/en/services/concierge/index.astro
Normal file
143
src/pages/en/services/concierge/index.astro
Normal file
@@ -0,0 +1,143 @@
|
||||
---
|
||||
import BaseLayout from '../../../../layouts/BaseLayout.astro';
|
||||
import Header from '../../../../components/Header.astro';
|
||||
import Footer from '../../../../components/Footer.astro';
|
||||
import { ui, languages, defaultLang } from '../../../../i18n/ui';
|
||||
|
||||
const lang = 'en';
|
||||
const t = ui[lang];
|
||||
---
|
||||
|
||||
<BaseLayout>
|
||||
<Header />
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative pt-32 pb-20 overflow-hidden">
|
||||
<!-- Background elements -->
|
||||
<div class="absolute inset-0 -z-10">
|
||||
<div class="absolute inset-0 bg-gradient-to-b from-black-deep via-black-medium to-black-deep"></div>
|
||||
<div class="absolute inset-0 opacity-10 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-silver-metallic/20 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="container mx-auto px-4 relative z-10">
|
||||
<div class="mb-8">
|
||||
<a href={`/${lang}/#services`} class="inline-flex items-center text-silver-light/70 hover:text-accent-gold transition-colors">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
{t['services.back']}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<h1 class="text-4xl md:text-6xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">
|
||||
{t['services.concierge.page.title']}
|
||||
</h1>
|
||||
|
||||
<p class="text-xl text-silver-light/90 mb-12 max-w-3xl leading-relaxed">
|
||||
{t['services.concierge.page.description']}
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Main Content Section -->
|
||||
<section class="relative py-16 px-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium"></div>
|
||||
|
||||
<div class="max-w-6xl mx-auto relative z-10">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-16">
|
||||
<!-- Left Column: Image -->
|
||||
<div class="relative rounded-2xl overflow-hidden h-full min-h-[400px] order-2 md:order-1">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium opacity-40"></div>
|
||||
<img src="/assets/concierge-service.jpg" alt="Concierge Services" class="absolute inset-0 w-full h-full object-cover" onerror="this.src='/Logo.png';this.classList.add('p-12', 'object-contain', 'opacity-10');" />
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black-deep to-transparent"></div>
|
||||
|
||||
<!-- Contact box -->
|
||||
<div class="absolute bottom-0 left-0 right-0 p-8">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/80 backdrop-blur-sm rounded-xl border border-silver-dark/30 p-6">
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-4">Elevate Your Guest Experience</h3>
|
||||
<p class="text-silver-light/70 text-sm mb-6">Contact us today to learn how our concierge services can enhance your event or venue.</p>
|
||||
<a href={`/${lang}/#contact`} class="inline-block bg-gradient-to-r from-accent-blue to-accent-blue/80 text-silver-light font-medium px-6 py-3 rounded-lg shadow-xl hover:shadow-accent-blue/20 transition-all duration-300 hover:translate-y-[-2px] w-full text-center">
|
||||
Contact Us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column: Content -->
|
||||
<div class="order-1 md:order-2">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-2xl border border-silver-dark/20 shadow-xl overflow-hidden h-full">
|
||||
<div class="absolute top-0 right-0 w-full h-1 bg-gradient-to-r from-transparent via-accent-gold/30 to-transparent"></div>
|
||||
|
||||
<div class="p-8 md:p-10">
|
||||
<p class="text-lg text-silver-light/80 mb-8 leading-relaxed">
|
||||
{t['services.concierge.page.content']}
|
||||
</p>
|
||||
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-6">{t['services.concierge.page.features']}</h3>
|
||||
<ul class="space-y-4">
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.concierge.page.feature1']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Professional welcoming and assistance for all guests.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.concierge.page.feature2']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Personalized service for high-profile and important guests.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.concierge.page.feature3']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Arranging transportation and managing arrival/departure logistics.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.concierge.page.feature4']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Dedicated support for special requests and individual needs.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.concierge.page.feature5']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Providing guidance on event schedules, venue facilities, and local amenities.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<Footer />
|
||||
</BaseLayout>
|
||||
144
src/pages/en/services/food/index.astro
Normal file
144
src/pages/en/services/food/index.astro
Normal file
@@ -0,0 +1,144 @@
|
||||
---
|
||||
import BaseLayout from '../../../../layouts/BaseLayout.astro';
|
||||
import Header from '../../../../components/Header.astro';
|
||||
import Footer from '../../../../components/Footer.astro';
|
||||
import { ui, languages, defaultLang } from '../../../../i18n/ui';
|
||||
|
||||
const lang = 'en';
|
||||
const t = ui[lang];
|
||||
---
|
||||
|
||||
<BaseLayout>
|
||||
<Header />
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative pt-32 pb-20 overflow-hidden">
|
||||
<!-- Background elements -->
|
||||
<div class="absolute inset-0 -z-10">
|
||||
<div class="absolute inset-0 bg-gradient-to-b from-black-deep via-black-medium to-black-deep"></div>
|
||||
<div class="absolute inset-0 opacity-10 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-silver-metallic/20 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="container mx-auto px-4 relative z-10">
|
||||
<div class="mb-8">
|
||||
<a href={`/${lang}/#services`} class="inline-flex items-center text-silver-light/70 hover:text-accent-gold transition-colors">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
{t['services.back']}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<h1 class="text-4xl md:text-6xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">
|
||||
{t['services.food.page.title']}
|
||||
</h1>
|
||||
|
||||
<p class="text-xl text-silver-light/90 mb-12 max-w-3xl leading-relaxed">
|
||||
{t['services.food.page.description']}
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Main Content Section -->
|
||||
<section class="relative py-16 px-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium"></div>
|
||||
|
||||
<div class="max-w-6xl mx-auto relative z-10">
|
||||
<!-- Features Grid -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-xl border border-silver-dark/20 shadow-xl overflow-hidden p-6">
|
||||
<div class="w-12 h-12 flex items-center justify-center bg-accent-blue/10 rounded-full mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-accent-blue" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg font-semibold text-silver-metallic mb-2">{t['services.food.page.feature1']}</h3>
|
||||
<p class="text-silver-light/70 text-sm">Quality refreshments for staff at events and venues, ensuring they remain energized and focused.</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-xl border border-silver-dark/20 shadow-xl overflow-hidden p-6">
|
||||
<div class="w-12 h-12 flex items-center justify-center bg-accent-blue/10 rounded-full mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-accent-blue" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 15.546c-.523 0-1.046.151-1.5.454a2.704 2.704 0 01-3 0 2.704 2.704 0 00-3 0 2.704 2.704 0 01-3 0 2.704 2.704 0 00-3 0 2.701 2.701 0 00-1.5-.454M9 6v2m3-2v2m3-2v2M9 3h.01M12 3h.01M15 3h.01M21 21v-7a2 2 0 00-2-2H5a2 2 0 00-2 2v7h18zm-3-9v-2a2 2 0 00-2-2H8a2 2 0 00-2 2v2h12z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg font-semibold text-silver-metallic mb-2">{t['services.food.page.feature2']}</h3>
|
||||
<p class="text-silver-light/70 text-sm">Premium hospitality services for venues, creating a welcoming atmosphere for all guests.</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-xl border border-silver-dark/20 shadow-xl overflow-hidden p-6">
|
||||
<div class="w-12 h-12 flex items-center justify-center bg-accent-blue/10 rounded-full mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-accent-blue" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg font-semibold text-silver-metallic mb-2">{t['services.food.page.feature3']}</h3>
|
||||
<p class="text-silver-light/70 text-sm">Seamless coordination with caterers and food service providers for your event needs.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Main Content -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-16">
|
||||
<!-- Left Column: Content -->
|
||||
<div>
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-2xl border border-silver-dark/20 shadow-xl overflow-hidden h-full">
|
||||
<div class="absolute top-0 right-0 w-full h-1 bg-gradient-to-r from-transparent via-accent-gold/30 to-transparent"></div>
|
||||
|
||||
<div class="p-8 md:p-10">
|
||||
<p class="text-lg text-silver-light/80 mb-8 leading-relaxed">
|
||||
{t['services.food.page.content']}
|
||||
</p>
|
||||
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-6">Additional Services</h3>
|
||||
<ul class="space-y-4">
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.food.page.feature4']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Catering for special dietary requirements and restrictions.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.food.page.feature5']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Enhanced service offerings for executive and VIP hospitality needs.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column: Image -->
|
||||
<div class="relative rounded-2xl overflow-hidden h-full min-h-[400px]">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium opacity-40"></div>
|
||||
<img src="/assets/food-service.jpg" alt="Food Services" class="absolute inset-0 w-full h-full object-cover" onerror="this.src='/Logo.png';this.classList.add('p-12', 'object-contain', 'opacity-10');" />
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black-deep to-transparent"></div>
|
||||
|
||||
<!-- Contact box -->
|
||||
<div class="absolute bottom-0 left-0 right-0 p-8">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/80 backdrop-blur-sm rounded-xl border border-silver-dark/30 p-6">
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-4">Quality Hospitality Solutions</h3>
|
||||
<p class="text-silver-light/70 text-sm mb-6">Contact us to discuss how our food services can enhance your event or venue experience.</p>
|
||||
<a href={`/${lang}/#contact`} class="inline-block bg-gradient-to-r from-accent-blue to-accent-blue/80 text-silver-light font-medium px-6 py-3 rounded-lg shadow-xl hover:shadow-accent-blue/20 transition-all duration-300 hover:translate-y-[-2px] w-full text-center">
|
||||
Contact Us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<Footer />
|
||||
</BaseLayout>
|
||||
143
src/pages/en/services/security/index.astro
Normal file
143
src/pages/en/services/security/index.astro
Normal file
@@ -0,0 +1,143 @@
|
||||
---
|
||||
import BaseLayout from '../../../../layouts/BaseLayout.astro';
|
||||
import Header from '../../../../components/Header.astro';
|
||||
import Footer from '../../../../components/Footer.astro';
|
||||
import { ui, languages, defaultLang } from '../../../../i18n/ui';
|
||||
|
||||
const lang = 'en';
|
||||
const t = ui[lang];
|
||||
---
|
||||
|
||||
<BaseLayout>
|
||||
<Header />
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative pt-32 pb-20 overflow-hidden">
|
||||
<!-- Background elements -->
|
||||
<div class="absolute inset-0 -z-10">
|
||||
<div class="absolute inset-0 bg-gradient-to-b from-black-deep via-black-medium to-black-deep"></div>
|
||||
<div class="absolute inset-0 opacity-10 bg-[radial-gradient(circle_at_center,_var(--tw-gradient-stops))] from-silver-metallic/20 to-transparent"></div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="container mx-auto px-4 relative z-10">
|
||||
<div class="mb-8">
|
||||
<a href={`/${lang}/#services`} class="inline-flex items-center text-silver-light/70 hover:text-accent-gold transition-colors">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
{t['services.back']}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<h1 class="text-4xl md:text-6xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-silver-metallic to-silver-light mb-6">
|
||||
{t['services.security.page.title']}
|
||||
</h1>
|
||||
|
||||
<p class="text-xl text-silver-light/90 mb-12 max-w-3xl leading-relaxed">
|
||||
{t['services.security.page.description']}
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Main Content Section -->
|
||||
<section class="relative py-16 px-4">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium"></div>
|
||||
|
||||
<div class="max-w-6xl mx-auto relative z-10">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-16">
|
||||
<!-- Left Column: Content -->
|
||||
<div>
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/90 backdrop-blur-sm rounded-2xl border border-silver-dark/20 shadow-xl overflow-hidden h-full">
|
||||
<div class="absolute top-0 right-0 w-full h-1 bg-gradient-to-r from-transparent via-accent-gold/30 to-transparent"></div>
|
||||
|
||||
<div class="p-8 md:p-10">
|
||||
<p class="text-lg text-silver-light/80 mb-8 leading-relaxed">
|
||||
{t['services.security.page.content']}
|
||||
</p>
|
||||
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-6">{t['services.security.page.features']}</h3>
|
||||
<ul class="space-y-4">
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.security.page.feature1']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Professional security presence for public and private events.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.security.page.feature2']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Controlled entry systems and identity verification procedures.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.security.page.feature3']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Continuous monitoring and vigilant security oversight.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.security.page.feature4']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Specialist protection for high-profile individuals and assets.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex items-start gap-4">
|
||||
<div class="flex-shrink-0 w-6 h-6 rounded-full bg-accent-blue/20 flex items-center justify-center mt-1">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-accent-blue" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="text-silver-metallic font-medium">{t['services.security.page.feature5']}</h4>
|
||||
<p class="text-silver-light/70 text-sm mt-1">Comprehensive evaluation of security vulnerabilities and threats.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column: Image -->
|
||||
<div class="relative rounded-2xl overflow-hidden h-full min-h-[400px]">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-black-deep to-black-medium opacity-40"></div>
|
||||
<img src="/assets/security-service.jpg" alt="Security Services" class="absolute inset-0 w-full h-full object-cover" onerror="this.src='/Logo.png';this.classList.add('p-12', 'object-contain', 'opacity-10');" />
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-black-deep to-transparent"></div>
|
||||
|
||||
<!-- Contact box -->
|
||||
<div class="absolute bottom-0 left-0 right-0 p-8">
|
||||
<div class="bg-gradient-to-br from-black-deep/90 to-black-medium/80 backdrop-blur-sm rounded-xl border border-silver-dark/30 p-6">
|
||||
<h3 class="text-xl text-silver-light font-semibold mb-4">Need Security Services?</h3>
|
||||
<p class="text-silver-light/70 text-sm mb-6">Contact us today to discuss your security requirements and receive a tailored solution.</p>
|
||||
<a href={`/${lang}/#contact`} class="inline-block bg-gradient-to-r from-accent-blue to-accent-blue/80 text-silver-light font-medium px-6 py-3 rounded-lg shadow-xl hover:shadow-accent-blue/20 transition-all duration-300 hover:translate-y-[-2px] w-full text-center">
|
||||
Contact Us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<Footer />
|
||||
</BaseLayout>
|
||||
41
src/pages/index.astro
Normal file
41
src/pages/index.astro
Normal file
@@ -0,0 +1,41 @@
|
||||
---
|
||||
import { defaultLang, showDefaultLang } from '../i18n/ui';
|
||||
|
||||
// Always redirect to a specific language route, not a dynamic path
|
||||
// This ensures we don't get into redirect loops
|
||||
const redirectPath = `/${defaultLang}/`;
|
||||
|
||||
// Add a timestamp parameter to prevent caching of redirects which can cause loops
|
||||
const timestamp = Date.now();
|
||||
const redirectUrl = `${redirectPath}?t=${timestamp}`;
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta http-equiv="refresh" content={`0;url=${redirectUrl}`} />
|
||||
<script>
|
||||
// Prevent infinite redirects on the client side
|
||||
if (typeof window !== 'undefined') {
|
||||
const redirectCount = parseInt(sessionStorage.getItem('redirectCount') || '0', 10);
|
||||
if (redirectCount > 3) {
|
||||
console.warn('Too many redirects detected, stopping to prevent infinite loop');
|
||||
sessionStorage.setItem('redirectCount', '0');
|
||||
// Cancel the meta refresh redirect
|
||||
const metaRefresh = document.querySelector('meta[http-equiv="refresh"]');
|
||||
if (metaRefresh) {
|
||||
metaRefresh.remove();
|
||||
}
|
||||
} else {
|
||||
sessionStorage.setItem('redirectCount', (redirectCount + 1).toString());
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<title>Redirecting...</title>
|
||||
</head>
|
||||
<body>
|
||||
<p>Redirecting to <a href={redirectUrl}>the homepage</a>...</p>
|
||||
</body>
|
||||
</html>
|
||||
18
src/styles/global.css
Normal file
18
src/styles/global.css
Normal file
@@ -0,0 +1,18 @@
|
||||
@import 'tailwindcss/base';
|
||||
@import 'tailwindcss/components';
|
||||
@import 'tailwindcss/utilities';
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
src: url('/fonts/Inter.woff2') format('woff2');
|
||||
font-weight: 100 900;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: 'Inter', 'Lato', ui-sans-serif, system-ui, sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
@apply bg-black-deep text-silver-metallic;
|
||||
}
|
||||
Reference in New Issue
Block a user