From 1fe1efc6940e15549f2e249406f5e7c7a824a157 Mon Sep 17 00:00:00 2001
From: PascalMarchesseault
 <97350299+PascalMarchesseault@users.noreply.github.com>
Date: Sat, 20 Apr 2024 11:36:26 -0400
Subject: [PATCH] Contact View cleaning

---
 src/views/main/ContactView.vue | 30 ++++++++++++++++++------------
 1 file changed, 18 insertions(+), 12 deletions(-)

diff --git a/src/views/main/ContactView.vue b/src/views/main/ContactView.vue
index 96b662e..9ab8188 100644
--- a/src/views/main/ContactView.vue
+++ b/src/views/main/ContactView.vue
@@ -4,14 +4,13 @@
   <div class="hutopy-backgroud-color">
     <div class="hidden-xs flex-col items-center page-margin">
       <v-container>
+
+        <!-- Banner -->
         <v-row class="text-center align-center row-between-logo-text home-row">
           <v-col xl="7" lg="9" md="11" sm="12" xs="12"> </v-col>
-
-
           <img class="hutopy-header-image" src="../../../images/hutopy.png">
-
-
           <v-col class="ml-0 text-left ">
+            <!-- Home btn -->
             <RouterLink :to="{ name: 'home' }">
               <v-btn class="home-btn" size="large" color="rgb(107, 0, 101)" outlined elevation="0"> Accueil</v-btn>
             </RouterLink>
@@ -19,20 +18,19 @@
         </v-row>
       </v-container>
 
+      <!-- Home btn -->
       <v-container class="row-between-logo-text">
         <v-row>
           <v-spacer></v-spacer>
-
           <v-col xl="8" lg="11" md="12" sm="12" xs="12">
             <v-row>
-
+              <!-- Contact image -->
               <v-col>
                 <img class="contact-image" src="../../../images/contactpage/contactpicture.png">
               </v-col>
+              <!-- Form Information  -->
               <v-col class="row-joinus">
-
                 <h1 class="h2-Participez-au-développement">PARTICIPEZ AU DÉVELOPPEMENT</h1>
-
                 <v-text-field label="Nom" style="color: rgb(107, 0, 101);"></v-text-field>
                 <v-text-field label="Courriel" style="color: rgb(107, 0, 101);"></v-text-field>
                 <v-textarea style="color: rgb(107, 0, 101)" label="Pourquoi voulez-vous participer au développement?"
@@ -43,10 +41,10 @@
                   <v-btn style="background-color: rgb(163, 14, 121); color: white; font-weight: bold;"
                     class="mt-4 send-btn" block>Envoyez </v-btn>
                 </RouterLink>
-
               </v-col>
             </v-row>
 
+            <!-- Text about joining us -->
             <v-row>
               <v-container>
                 <p class="h3-text paragraph">Rejoignez l'aventure
@@ -80,23 +78,31 @@
               </v-container>
             </v-row>
           </v-col>
-
+          <!-- Offset -->
           <v-spacer></v-spacer>
         </v-row>
       </v-container>
     </div>
 
+
+    <!-- Mobile low dimensions -->
     <div class="hidden-sm-and-up flex-col items-center justify-center">
+
+      <!-- Offset -->
       <v-spacer style="margin-bottom: 25px;"></v-spacer>
+
+      <!-- Contact image -->
       <v-img src="../../../images/contactpage/contactpicture.png" contain aspect-ratio="16/9"
         style="clip-path: polygon(0 50%, 100% 0, 100% 80%, 0 100%);" class="Scale-80"></v-img>
 
+      <!-- Title -->
       <v-row class="labelgroup">
         <v-col cols="12">
           <h1 class="h2-Participez-au-développement">PARTICIPEZ AU DÉVELOPPEMENT</h1>
         </v-col>
       </v-row>
 
+      <!-- Form Information  -->
       <v-text-field class="labelsize" label="Nom" style="margin-top: 5%; color: rgb(107, 0, 101);"></v-text-field>
       <v-text-field class="labelsize" label="Courriel" style="color: rgb(107, 0, 101);"></v-text-field>
       <v-textarea class="labelsize" style="color: rgb(107, 0, 101)"
@@ -112,6 +118,8 @@
         </v-btn>
       </RouterLink>
 
+
+      <!-- Text about joining us -->
       <p class="h3-text paragraph">Rejoignez l'aventure
         Hutopy : une
         invitation à façonner l'avenir de la création.
@@ -142,9 +150,7 @@
         dans le ciel de notre utopie partagée.
       </p>
     </div>
-
     <FooterLayout></FooterLayout>
-
   </div>
 </template>