55 lines
2.0 KiB
Vue
55 lines
2.0 KiB
Vue
<template>
|
|
<footer class="bg-gray-900 text-white">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
|
<div>
|
|
<div class="flex items-center space-x-2 mb-4">
|
|
<img src="/logo.svg" alt="ClueFlare" class="h-8 w-8">
|
|
<span class="text-xl font-bold">ClueFlare</span>
|
|
</div>
|
|
<p class="text-gray-400">{{ t('footer.description') }}</p>
|
|
</div>
|
|
|
|
<div>
|
|
<h4 class="font-semibold mb-4">Services</h4>
|
|
<ul class="space-y-2 text-gray-400">
|
|
<li>AWS Proxy</li>
|
|
<li>Alibaba Cloud</li>
|
|
<li>Tencent Cloud</li>
|
|
<li>DigitalOcean</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div>
|
|
<h4 class="font-semibold mb-4">Company</h4>
|
|
<ul class="space-y-2 text-gray-400">
|
|
<li><NuxtLink :to="localePath('/about')" class="hover:text-white transition-colors">About Us</NuxtLink></li>
|
|
<li><NuxtLink :to="localePath('/blog')" class="hover:text-white transition-colors">Blog</NuxtLink></li>
|
|
<li><NuxtLink :to="localePath('/contact')" class="hover:text-white transition-colors">Contact</NuxtLink></li>
|
|
<li><a href="/sitemap_index.xml" class="hover:text-white transition-colors" target="_blank">Sitemap</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div>
|
|
<h4 class="font-semibold mb-4">{{ t('contact.title') }}</h4>
|
|
<div class="space-y-2 text-gray-400">
|
|
<p>{{ t('contact.telegram') }}: {{ t('contact.username') }}</p>
|
|
<p>{{ t('contact.whatsapp') }}: {{ t('contact.phone') }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="border-t border-gray-800 mt-12 pt-8 text-center text-gray-400">
|
|
<p>© 2024 ClueFlare. {{ t('footer.rights') }}</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</template>
|
|
|
|
<script setup>
|
|
const { t } = useI18n()
|
|
const localePath = useLocalePath()
|
|
</script>
|
|
|
|
|