Updated UI

src/views/main/ContactView.vue

@@ -1,18 +1,50 @@
 <template>
-  <DefaultLayout></DefaultLayout>
+
 
   <!--PC -->
   <div class="md:flex hidden items-center justify-between flex-col">
+    <v-container style="margin-bottom: -.1%; margin-top: 2%;">
+      <v-row justify="center">
+        <v-col style="margin-left: 4%;" cols="6">
+          <img src="../../../images/hutopyblack.png" height="100px">
+        </v-col>
+      </v-row>
+
+      <v-row style="margin-bottom: -4%;" justify="end">
+        <v-col cols="auto">
+          <router-link :to="{ name: 'home' }">
+            <v-btn size="x-large" style="min-width: 200px; max-width: 200px;" elevation="0">
+              Accueil
+            </v-btn>
+          </router-link>
+        </v-col>
+      </v-row>
+
+
+
+
+
+
+
+    </v-container>
+
+    <img src="../../../images/homepage/bannierenousjoindre.png" class="banner-image" alt="Bannière"
+      style="min-height: 500px; margin-top: 3%;">
+
+
+
+
     <main class="top-aligned-column grid grid-cols-3 gap-4">
 
       <div class="column"></div>
-      <div class="center-column" style="width: 70vw; margin: auto;">
-        <h1 class="h1-inscription-beta">Participez au développement de </h1>
-        <h1 class="h1-inscription-betacolor">Hutopy</h1>
-        <div class="grid grid-cols-2 gap-4">
+      <div class="center-column" style="width: 100vw; margin: auto;">
+        <h1 style="font-size: 3rem; margin-top: 7%; margin-bottom: 7%;" class="h1-inscription-beta">Participez au
+          développement de </h1>
+
+        <div class="grid grid-cols-2 gap-4" style="margin-bottom: 10%;">
           <div class="rectangular-image h-full flex justify-center items-center">
 
-            <img src="../../../images/contactpicture.png" alt="Bannière" class="contactpicture" style="float: right;">
+            <img src="../../../images/homepage/love.png" alt="Bannière" class="contactpicture" style="float: right;">
 
           </div>
 
@@ -20,14 +52,26 @@
 
 
 
-            <p class="para-inscription" style="font-size: 1.4rem;">
+            <p class="para-inscription" style="margin-top: 4%; font-size: 1.4rem;">
               Étant au début de notre projet, vous pouvez nous contacter pour être ajouté à la liste des ambassadeurs et
               nous aider à créer la plateforme de vos rêves pour partager votre contenu. Nous recherchons des personnes
               passionnées et qui ont une vision d'un monde meilleur. Aidez-nous à grandir en nous donnant vos
               rétroactions afin que l'on puisse développer des outils qui seront uniques pour les créateurs et les
               utilisateurs de la plateforme. Nous voulons créer un réseau social qui fera une différence dans ce monde.
             </p>
-            <FormInscriptionBeta></FormInscriptionBeta>
+
+            <v-text-field label="Nom ($)"
+              style="color: rgb(107, 0, 101); background-color: rgb(255, 255, 255);"></v-text-field>
+
+            <v-text-field label="Courriel ($)"
+              style="color: rgb(107, 0, 101); background-color: rgb(255, 255, 255);"></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>
+
             <v-btn style=" margin-bottom: 45px; background-color: rgb(163, 14, 121); color: white; font-weight: bold;"
               class="mt-4" block>Envoyez</v-btn>
           </div>
@@ -44,6 +88,7 @@
   <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>