67 lines
2.9 KiB
Vue
67 lines
2.9 KiB
Vue
<template>
|
|
<div>
|
|
<section class="bg-gradient-to-br from-blue-50 to-indigo-100 py-20">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
|
<h1 class="text-4xl md:text-6xl font-bold text-gray-900 mb-6">
|
|
{{ t('hero.title') }}
|
|
</h1>
|
|
<p class="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
|
|
{{ t('hero.subtitle') }}
|
|
</p>
|
|
<NuxtLink
|
|
:to="localePath('/about')"
|
|
class="inline-block bg-blue-600 text-white px-8 py-3 rounded-lg text-lg font-semibold hover:bg-blue-700 transition-colors"
|
|
>
|
|
{{ t('hero.cta') }}
|
|
</NuxtLink>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="py-20">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<h2 class="text-3xl font-bold text-center text-gray-900 mb-12">
|
|
{{ t('services.title') }}
|
|
</h2>
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
<div class="bg-white p-8 rounded-lg shadow-md border hover:shadow-lg transition-shadow">
|
|
<div class="w-12 h-12 bg-orange-500 rounded-lg mb-4 flex items-center justify-center">
|
|
<svg class="w-6 h-6 text-white" fill="currentColor" viewBox="0 0 24 24">
|
|
<path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold mb-3">{{ t('services.aws.title') }}</h3>
|
|
<p class="text-gray-600">{{ t('services.aws.description') }}</p>
|
|
</div>
|
|
|
|
<div class="bg-white p-8 rounded-lg shadow-md border hover:shadow-lg transition-shadow">
|
|
<div class="w-12 h-12 bg-blue-500 rounded-lg mb-4 flex items-center justify-center">
|
|
<svg class="w-6 h-6 text-white" fill="currentColor" viewBox="0 0 24 24">
|
|
<path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold mb-3">{{ t('services.alibaba.title') }}</h3>
|
|
<p class="text-gray-600">{{ t('services.alibaba.description') }}</p>
|
|
</div>
|
|
|
|
<div class="bg-white p-8 rounded-lg shadow-md border hover:shadow-lg transition-shadow">
|
|
<div class="w-12 h-12 bg-green-500 rounded-lg mb-4 flex items-center justify-center">
|
|
<svg class="w-6 h-6 text-white" fill="currentColor" viewBox="0 0 24 24">
|
|
<path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold mb-3">{{ t('services.tencent.title') }}</h3>
|
|
<p class="text-gray-600">{{ t('services.tencent.description') }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
const { t } = useI18n()
|
|
const localePath = useLocalePath()
|
|
</script>
|
|
|
|
|