9779e4e133
Complete visual overhaul of all pages and components with generous spacing, bold typography, hover effects, gradient accents, and section differentiation. Hero features animated terminal mockup and gradient text. Cards use hover transforms with brand-colored shadows. CTAs use gradient backgrounds. All i18n keys, data structures, SEO meta, and composable logic preserved. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
80 lines
1.9 KiB
Vue
80 lines
1.9 KiB
Vue
<script setup lang="ts">
|
|
import { homeFAQs } from '~/data/faq'
|
|
|
|
const { t } = useI18n()
|
|
|
|
useSeoMeta({
|
|
title: () => t('seo.home.title'),
|
|
description: () => t('seo.home.description'),
|
|
ogTitle: () => t('seo.home.title'),
|
|
ogDescription: () => t('seo.home.description'),
|
|
ogImage: 'https://killiandalcin.fr/og-image.png',
|
|
ogImageWidth: 1200,
|
|
ogImageHeight: 630,
|
|
ogType: 'website',
|
|
})
|
|
|
|
useHead({
|
|
script: [
|
|
{
|
|
type: 'application/ld+json',
|
|
innerHTML: JSON.stringify({
|
|
'@context': 'https://schema.org',
|
|
'@graph': [
|
|
{
|
|
'@type': 'Person',
|
|
name: 'Killian Dalcin',
|
|
url: 'https://killiandalcin.fr',
|
|
jobTitle: 'Developpeur Full Stack Freelance',
|
|
email: 'contact@killiandalcin.fr',
|
|
sameAs: [
|
|
'https://linkedin.com/in/killian-dal-cin',
|
|
'https://www.fiverr.com/users/mr_kayjaydee',
|
|
'https://gitea.kamisama.ovh/kayjaydee',
|
|
],
|
|
},
|
|
{
|
|
'@type': 'ProfessionalService',
|
|
name: 'Killian Dalcin - Developpeur Full Stack',
|
|
url: 'https://killiandalcin.fr',
|
|
logo: 'https://killiandalcin.fr/images/logo.webp',
|
|
priceRange: '$$$',
|
|
areaServed: 'Worldwide',
|
|
},
|
|
],
|
|
}),
|
|
},
|
|
],
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<!-- Hero Section -->
|
|
<HeroSection />
|
|
|
|
<!-- Featured Projects Section -->
|
|
<div class="bg-gray-50 dark:bg-gray-900/30">
|
|
<FeaturedProjectsSection />
|
|
</div>
|
|
|
|
<!-- Services Section -->
|
|
<ServicesSection />
|
|
|
|
<!-- Testimonials Section -->
|
|
<div class="bg-gray-50 dark:bg-gray-900/30">
|
|
<TestimonialsSection />
|
|
</div>
|
|
|
|
<!-- FAQ Section -->
|
|
<FAQSection
|
|
:faqs="homeFAQs"
|
|
:title="t('faq.title')"
|
|
:subtitle="t('faq.subtitle')"
|
|
/>
|
|
|
|
<!-- CTA Section -->
|
|
<CTASection />
|
|
</div>
|
|
</template>
|