Better CreatorHome

frontend/src/views/creators/CreatorHome.vue

@@ -1,7 +1,7 @@
 <template>
 
   <div v-if="creatorProfileStore.creator?.id === brandingStore.value.id"
-       class="flex justify-end space-x-2 mb-5 pa-1">
+       class="flex justify-end space-x-2 mb-5 p-4">
 
     <!-- Bouton principal : Éditer ou Enregistrer -->
     <button
@@ -31,7 +31,7 @@
       <div class="py-4">
 
         <div v-if="!isEditMode">
-          <p v-if="mainImageText ">
+          <p v-if="mainImageText" class="text-lg text-justify">
             {{ mainImageText }}
           </p>
         </div>
@@ -67,7 +67,7 @@
             </h2>
 
             <div v-if="!isEditMode">
-              <p v-if="mainVideoText">
+              <p v-if="mainVideoText" class="text-lg text-justify">
                 {{ mainVideoText }}
               </p>
             </div>
@@ -105,7 +105,7 @@
           </v-textarea>
 
           <div v-if="!isEditMode">
-            <p v-if="imagesText ">
+            <p v-if="imagesText" class="text-lg text-justify">
               {{ imagesText }}
             </p>
           </div>
@@ -262,33 +262,11 @@
       </div>
 
       <!-- Contact Info-->
-      <div v-if="!isEditMode">
+      <div v-if="!isEditMode && phoneNumber || email">
-        <div v-if="phoneNumber || email" class="mb-6">
+
-          <!--      mobile-->
+        <div class="my-10 flex flex-row">
-          <div v-if="smAndDown">
+
-            <div class="flex flex-col space-y-10 mt-12 justify-center items-center">
+          <div v-if="phoneNumber" class="flex items-center space-x-2 w-1/2 justify-center">
-              <!-- Affichage du téléphone -->
-              <div v-if="phoneNumber" class="flex items-center space-x-2">
-                <i class="mdi mdi-phone-outline text-2xl"></i>
-                <span>{{ phoneNumber }}</span>
-              </div>
-              <!-- Affichage de l'email -->
-              <div v-if="email" class="flex items-center space-x-2">
-                <i class="mdi mdi-email-outline text-2xl"></i>
-                <a
-                    :href="`mailto:${email}`"
-                    class="no-underline text-current"
-                >
-                  {{ email }}
-                </a>
-              </div>
-            </div>
-          </div>
-          <!--pc-->
-          <div v-if="!smAndDown">
-            <div class="flex space-x-4 space-y-4 mt-5 justify-center items-center w-full">
-              <!-- Affichage du téléphone -->
-              <div v-if="phoneNumber" class="flex items-center space-x-2 w-1/2 justify-start">
             <i class="mdi mdi-phone-outline text-2xl"></i>
             <span>{{ phoneNumber }}</span>
           </div>
@@ -300,8 +278,7 @@
               {{ email }}
             </a>
           </div>
-            </div>
+
-          </div>
         </div>
       </div>
     </div>