204 lines
8.0 KiB
Vue
204 lines
8.0 KiB
Vue
<template>
|
|
<!--PC -->
|
|
|
|
|
|
<div class="md:flex hidden items-center justify-between flex-col" style="margin-top: 3%;">
|
|
<v-container class="d-flex justify-center align-center" sty>
|
|
<div style="margin-left: 20%; margin-bottom: 3%;">
|
|
<v-row>
|
|
|
|
<img style=" max-width: 60%;" src="../../../images/hutopy.png">
|
|
|
|
<RouterLink :to="{ name: 'home' }">
|
|
<v-btn size="large"
|
|
style="margin-left: 50%; margin-top: 48%; min-width: 150px; max-width: 200px; border-radius: 40px;"
|
|
color="rgb(107, 0, 101)" outlined elevation="0">
|
|
Accueil
|
|
</v-btn>
|
|
</RouterLink>
|
|
|
|
</v-row>
|
|
</div>
|
|
</v-container>
|
|
|
|
</div>
|
|
|
|
|
|
<v-container>
|
|
<v-row justify="center" align="center">
|
|
<v-col cols="auto">
|
|
<img src="../../../images/contactpage/contactpicture.png" alt="Bannière" class="contactpicture"
|
|
style="max-width: 400px; margin-top: 14%; height: auto; float: right;">
|
|
</v-col>
|
|
<v-col style="max-width: 700px;">
|
|
<h1 style=" font-size: 3rem; margin-bottom: 5%;" class="h1-inscription-beta">Participez au
|
|
développement</h1>
|
|
|
|
|
|
<v-text-field label="Nom ($)" style=" color: rgb(107, 0, 101); background-color: #F4F4F4;"></v-text-field>
|
|
|
|
<v-text-field label="Courriel ($)" style="color: rgb(107, 0, 101); background-color: #F4F4F4"></v-text-field>
|
|
|
|
<v-textarea style="color: rgb(107, 0, 101)" label="Pourquoi voulez-vous participer au développement"
|
|
placeholder="Écrivez votre message ici" rows="3" auto-grow></v-textarea>
|
|
|
|
<v-textarea style="color: rgb(107, 0, 101)" label="Avez-vous déjà des comptes sur les réseaux sociaux ?"
|
|
placeholder="Écrivez votre message ici" rows="3" auto-grow></v-textarea>
|
|
|
|
|
|
<RouterLink :to="{ name: 'home' }">
|
|
<v-btn style=" margin-bottom: 45px; background-color: rgb(163, 14, 121); color: white; font-weight: bold;"
|
|
class="mt-4" block>Envoyez</v-btn>
|
|
</RouterLink>
|
|
</v-col>
|
|
</v-row>
|
|
</v-container>
|
|
|
|
|
|
<v-container style="max-width: 1200px;">
|
|
<p class="para-inscription" style="margin-top: -4%; font-size: 1.3rem;">Rejoignez l'aventure
|
|
Hutopy : une
|
|
invitation à façonner l'avenir de la création.
|
|
Vous avez un talent, une passion, une vision ? Hutopy vous ouvre ses portes, non seulement comme
|
|
plateforme, mais comme une communauté vibrante où chaque créateur devient un architecte de l'utopie
|
|
collective. Ici, votre art, vos idées, et vos rêves trouvent un espace pour s'épanouir, se partager et
|
|
inspirer.
|
|
Devenez créateur sur Hutopy et plongez dans une expérience sans pareille où vos œuvres rejoindront un
|
|
écosystème florissant, prêtes à être découvertes, appréciées et soutenues. C'est l'occasion de laisser
|
|
votre empreinte, d'enseigner, d'apprendre et de grandir aux côtés d'âmes créatives partageant les mêmes
|
|
idées.
|
|
Faire partie de Hutopy, c'est embrasser une opportunité unique de monétiser votre créativité, d'élargir
|
|
votre réseau et de participer à un projet grandiose. C'est le moment de transformer votre passion en
|
|
profession, d'atteindre un public mondial et de contribuer à un mouvement qui valorise la créativité et
|
|
l'innovation.
|
|
Pour embarquer dans ce voyage vers la réalisation de vos rêves et rejoindre notre communauté de créateurs
|
|
visionnaires, nous vous invitons à inscrire vos informations. Partagez avec nous votre courriel et votre
|
|
numéro de téléphone, et nous vous guiderons à travers chaque étape pour établir votre présence sur Hutopy.
|
|
Laissez-nous votre marque, et ensemble, construisons un monde où la créativité connaît aucune limite.
|
|
Votre aventure commence maintenant. Bienvenue dans l'univers Hutopy, où chaque créateur est une étoile
|
|
dans le ciel de notre utopie partagée.
|
|
</p>
|
|
|
|
</v-container>
|
|
|
|
<!-- Mobile -->
|
|
|
|
<v-container style="margin-top: -100px;">
|
|
|
|
<div class="md:hidden flex flex-col items-center justify-center">
|
|
<DefaultLayout></DefaultLayout>
|
|
<h1 class="h1-inscription-betacolor" style=" margin-bottom: 35px;">Hutopy</h1>
|
|
|
|
|
|
|
|
<div class="w-screen flex justify-center" style="margin-left: -5px; margin-right: -5px;">
|
|
<img src="../../../images/contactpicturemobile.png" alt="Bannière">
|
|
</div>
|
|
<p class="text-justify pa-4" style="font-size: 1em;">
|
|
Rejoignez l'aventure Hutopy : une invitation à façonner l'avenir de la création.
|
|
Vous avez un talent, une passion, une vision ? Hutopy vous ouvre ses portes, non seulement comme plateforme,
|
|
mais comme une communauté vibrante où chaque créateur devient un architecte de l'utopie collective. Ici, votre
|
|
art, vos idées, et vos rêves trouvent un espace pour s'épanouir, se partager et inspirer.
|
|
Devenez créateur sur Hutopy et plongez dans une expérience sans pareille où vos œuvres rejoindront un écosystème
|
|
florissant, prêtes à être découvertes, appréciées et soutenues. C'est l'occasion de laisser votre empreinte,
|
|
d'enseigner, d'apprendre et de grandir aux côtés d'âmes créatives partageant les mêmes idées.
|
|
Faire partie de Hutopy, c'est embrasser une opportunité unique de monétiser votre créativité, d'élargir votre
|
|
réseau et de participer à un projet grandiose. C'est le moment de transformer votre passion en profession,
|
|
d'atteindre un public mondial et de contribuer à un mouvement qui valorise la créativité et l'innovation.
|
|
Pour embarquer dans ce voyage vers la réalisation de vos rêves et rejoindre notre communauté de créateurs
|
|
visionnaires, nous vous invitons à inscrire vos informations. Partagez avec nous votre courriel et votre numéro
|
|
de téléphone, et nous vous guiderons à travers chaque étape pour établir votre présence sur Hutopy.
|
|
Laissez-nous votre marque, et ensemble, construisons un monde où la créativité connaît aucune limite. Votre
|
|
aventure commence maintenant. Bienvenue dans l'univers Hutopy, où chaque créateur est une étoile dans le ciel de
|
|
notre utopie partagée.
|
|
|
|
</p>
|
|
|
|
<div style="background-color: rgba(163, 14, 121, 1); height: 2px; width: 100%; margin-bottom: 20px;">
|
|
</div>
|
|
|
|
<FormInscriptionBeta></FormInscriptionBeta>
|
|
|
|
<v-btn style=" background-color: rgb(163, 14, 121); color: white; font-weight: bold;" class="mt-4"
|
|
block>Envoyez</v-btn>
|
|
|
|
|
|
|
|
</div>
|
|
</v-container>
|
|
|
|
<FooterLayout></FooterLayout>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
import DefaultLayout from '@/layouts/DefaultLayout.vue';
|
|
import FooterLayout from '@/layouts/FooterLayout.vue';
|
|
import FormInscriptionBeta from '@/layouts/FormInscriptionBeta.vue';
|
|
</script>
|
|
|
|
<style scoped>
|
|
.contactpicture {
|
|
height: 800px;
|
|
width: auto;
|
|
|
|
/* ajustez cette valeur selon votre besoin */
|
|
margin-bottom: 45px;
|
|
border-radius: 12px;
|
|
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.6);
|
|
/* ombre avec 2px de décalage vertical, 4px de flou et couleur noire transparente */
|
|
z-index: 2;
|
|
/* Met l'image derrière */
|
|
}
|
|
|
|
.mallowbanner {
|
|
|
|
top: 0;
|
|
left: 0;
|
|
z-index: -2;
|
|
/* Met l'image derrière */
|
|
margin-top: 5.5vw;
|
|
/* ajustez cette valeur selon votre besoin */
|
|
margin-bottom: 4.5vw;
|
|
margin-left: -1.0vw;
|
|
}
|
|
|
|
.center-column {
|
|
width: 70vw;
|
|
/* ajustez cette valeur selon votre besoin */
|
|
margin: auto;
|
|
/* centre le contenu horizontalement */
|
|
}
|
|
|
|
.h1-inscription-beta {
|
|
font-size: 25px;
|
|
/* Taille de la police de 20 pixels */
|
|
font-weight: bold;
|
|
/* Texte en gras */
|
|
text-align: center;
|
|
/* Centrer le texte */
|
|
margin-top: 20px;
|
|
margin-bottom: 5px;
|
|
color: #24393c;
|
|
|
|
}
|
|
|
|
.h1-inscription-betacolor {
|
|
font-size: 65px;
|
|
/* Taille de la police de 20 pixels */
|
|
font-weight: bold;
|
|
/* Texte en gras */
|
|
text-align: center;
|
|
/* Centrer le texte */
|
|
|
|
margin-bottom: 25px;
|
|
color: rgba(163, 14, 121, 0.85);
|
|
/* Couleur du texte (utilisez la couleur souhaitée) */
|
|
}
|
|
|
|
.para-inscription {
|
|
margin-bottom: 20px;
|
|
text-align: justify;
|
|
}
|
|
</style>
|