134 lines
3.4 KiB
Vue
134 lines
3.4 KiB
Vue
<script setup>
|
|
import Instagram from "@/views/svg/Instagram.vue";
|
|
import Facebook from "@/views/svg/Facebook.vue";
|
|
import X from "@/views/svg/X.vue";
|
|
import { useI18n } from 'vue-i18n';
|
|
|
|
const { t } = useI18n();
|
|
</script>
|
|
|
|
<template>
|
|
|
|
<footer class="flex flex-col gap-10 pt-7 pb-10">
|
|
|
|
<div class="footer-socials">
|
|
<a href="https://www.facebook.com/profile.php?id=61556819217561" target="_blank">
|
|
<facebook class="social-icon"></facebook>
|
|
</a>
|
|
<a href="https://www.instagram.com/hutopy.inc/" target="_blank">
|
|
<instagram class="social-icon"></instagram>
|
|
</a>
|
|
<a href="https://x.com/Hutopyinc/" target="_blank">
|
|
<x class="social-icon"></x>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="footer-links">
|
|
<router-link to="/documents/helpandcontact"
|
|
class="link">
|
|
{{ t('footer.helpandcontact') }}
|
|
</router-link>
|
|
<router-link to="/documents/faq"
|
|
class="link">
|
|
{{ t('footer.faq') }}
|
|
</router-link>
|
|
<router-link to="/documents/guideforcreators"
|
|
class="link">
|
|
{{ t('footer.creatorguide') }}
|
|
</router-link>
|
|
<router-link to="/documents/termsandconditions"
|
|
class="link">
|
|
{{ t('footer.termsandconditions') }}
|
|
</router-link>
|
|
<router-link to="/documents/contentpolicy"
|
|
class="link">
|
|
{{ t('footer.contentpolicy') }}
|
|
</router-link>
|
|
<router-link to="/documents/about"
|
|
class="link">
|
|
{{ t('footer.about') }}
|
|
</router-link>
|
|
<router-link to="/documents/pricing"
|
|
class="link">
|
|
{{ t('footer.pricing') }}
|
|
</router-link>
|
|
</div>
|
|
|
|
<div class="footer-copyright">
|
|
Hutopy ©{{ new Date().getFullYear() }} - {{ t('footer.allRightsReserved') }}
|
|
</div>
|
|
|
|
</footer>
|
|
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
.footer-socials {
|
|
@apply flex flex-row justify-center;
|
|
@apply gap-10;
|
|
}
|
|
|
|
.footer-links {
|
|
@apply flex flex-row flex-wrap justify-center;
|
|
@apply gap-4 px-4;
|
|
}
|
|
|
|
.footer-copyright {
|
|
@apply flex justify-center;
|
|
@apply text-hOnBackground tracking-widest font-sans text-sm;
|
|
}
|
|
|
|
.social-icon {
|
|
@apply fill-current w-6 h-6;
|
|
@apply text-hOnBackground;
|
|
}
|
|
|
|
.link {
|
|
@apply text-hOnBackground;
|
|
@apply tracking-widest font-sans text-sm;
|
|
@apply hover:text-gray-400;
|
|
}
|
|
|
|
</style>
|
|
|
|
<i18n>
|
|
{
|
|
"en": {
|
|
"footer": {
|
|
"helpandcontact": "Help & Contact",
|
|
"faq": "FAQ",
|
|
"creatorguide": "Creator Guide",
|
|
"termsandconditions": "Terms & Conditions",
|
|
"contentpolicy": "Content Policy",
|
|
"about": "About",
|
|
"pricing": "Pricing",
|
|
"allRightsReserved": "All Rights Reserved"
|
|
}
|
|
},
|
|
"fr": {
|
|
"footer": {
|
|
"helpandcontact": "Aide & Contact",
|
|
"faq": "FAQ",
|
|
"creatorguide": "Guide du Créateur",
|
|
"termsandconditions": "Conditions Générales",
|
|
"contentpolicy": "Politique de Contenu",
|
|
"about": "À Propos",
|
|
"pricing": "Tarifs",
|
|
"allRightsReserved": "Tous Droits Réservés"
|
|
}
|
|
},
|
|
"es": {
|
|
"footer": {
|
|
"helpandcontact": "Ayuda y Contacto",
|
|
"faq": "Preguntas Frecuentes",
|
|
"creatorguide": "Guía del Creador",
|
|
"termsandconditions": "Términos y Condiciones",
|
|
"contentpolicy": "Política de Contenido",
|
|
"about": "Acerca de",
|
|
"pricing": "Precios",
|
|
"allRightsReserved": "Todos los Derechos Reservados"
|
|
}
|
|
}
|
|
}
|
|
</i18n> |