I changed the visuals of the documentation files, improved the appearance of the post page, modified the header of the profile view, and added a Feed view.

src/router/index.js

@@ -19,7 +19,8 @@ import Profile from '../views/main/Profile.vue'
 import ChloeBeaugrand from '../views/manualusers/ChloeProfile.vue'
 import Leffet from '../views/manualusers/LeffetProfile.vue'
 import MathieuCaron from '../views/manualusers/MathieuCaron.vue'
-import Creator from "@/views/main/Creator.vue";
+import Creator from "@/views/main/Creator.vue"
+import Feed from '../views/main/Feed.vue';
 
 const routes = [
     {
@@ -131,6 +132,12 @@ const routes = [
         name: 'wallet',
         component: Wallet
     },
+    {
+        path: '/feed',
+        name: 'feed',
+        component: Feed
+    },
+
 
 
 ]

src/views/main/Creator.vue

@@ -1,28 +1,37 @@
 <template>
   <div>
-
-    <v-img cover
-           max-height="375"
-           :src="imageSrc">
-    </v-img>
-
-    <div class="w-full border-b-2 p-6">
-      <PostMessage content-id="00000001-0000-0000-0000-000000000001"></PostMessage>
-    </div>
     
-    <div class="w-full border-b-2 p-6">
-      <h2 class="font-sans font-semibold">Commentaires</h2>
-      <MessageList content-id="00000001-0000-0000-0000-000000000001"></MessageList>
-    </div>
+  <div class="flex flex-column w-max-[100] ">
+    
+  </div>
+
+
+<!--    <div class="w-full border-b-2 p-6">-->
+<!--      <PostMessage content-id="00000001-0000-0000-0000-000000000001"></PostMessage>-->
+<!--    </div>-->
+<!--    -->
+<!--    <div class="w-full border-b-2 p-6">-->
+<!--      <h2 class="font-sans font-semibold">Commentaires</h2>-->
+<!--      <MessageList content-id="00000001-0000-0000-0000-000000000001"></MessageList>-->
+<!--    </div>-->
 
     <PostContentMenu></PostContentMenu>
 
-    <div class="flex">
-      <PostCard v-for="post in posts"
-                :post="post"
-                class="m-2 bg-red w-full">
-      </PostCard>
+
+    <div class="flex flex-col items-center">
+      <div class="max-w-[800px] border-l-2 border-r-2 border-gray-200 px-4 ">
+        <PostCard v-for="post in posts"
+                  :key="post.id"
+                  :post="post"
+                  class=" bg-white w-full content-center rounded-3xl mt-2">
+        </PostCard>
+      </div>
     </div>
+
+    
+    
+    
+   
   </div>
 </template>
 

src/views/main/Feed.vue

@@ -0,0 +1,41 @@
+<template>
+  <div>
+
+    <div class="flex flex-column w-max-[100] ">
+
+    </div>
+
+
+
+    <div class="flex flex-col items-center">
+      <div class="max-w-[800px] border-l-2 border-r-2 border-gray-200 px-4 ">
+        <PostCard v-for="post in posts"
+                  :key="post.id"
+                  :post="post"
+                  class=" bg-white w-full content-center rounded-3xl mt-2">
+        </PostCard>
+      </div>
+    </div>
+
+
+
+
+
+  </div>
+</template>
+
+<script setup>
+
+import PostContentMenu from '@/views/main/PostContentMenu.vue'
+import PostCard from "@/views/main/PostCard.vue"
+import posts from "@/views/main/posts.json"
+import PostMessage from "@/views/messages/PostMessage.vue";
+import MessageList from "@/views/messages/MessageList.vue";
+
+let imageSrc = '/images/usersmedia/guillaumeMousseau/banners/bannerGuillaumeMousseau01.png';
+
+</script>
+
+<style scoped>
+
+</style>

src/views/main/PostCard.vue

@@ -1,28 +1,28 @@
 <template>
 
 
-  <div class=" shadow-lg rounded-lg max-w-sm">
+  <div class="border-2 shadow-2xl mb-4 ">
+    <div class="mt-1">
 
-    <div class="h-48 object-cover bg-purple">
-
-      <v-img :src="props.post.banner"
+      <v-img class="mt-1 rounded-t-2xl " :src="props.post.banner"
              v-if="!isHttpUrl">
       </v-img>
 
-      <iframe v-if="isHttpUrl"
+
+      <iframe  style="min-height: 400px" class="w-full rounded-t-2xl"
+           v-if="isHttpUrl"
               :src="props.post.banner"
               title="YouTube video player"
               allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
               referrerpolicy="strict-origin-when-cross-origin"
               allowfullscreen>
       </iframe>
+  
 
     </div>
-
-    <div class="text-lg font-bold">{{ props.post.title }}</div>
-    <div class="text-sm text-gray-500">{{ props.post.title }}</div>
-    <div class="text-base text-gray-700">{{ props.post.content }}</div>
-
+    <div class="text-lg font-bold m-4">{{ props.post.title }}</div>
+    <div class="text-sm text-gray-500 m-4">{{ props.post.title }}</div>
+    <div class="text-base text-gray-700 m-4 text-justify">{{ props.post.content }}</div>
   </div>
 
 </template>

src/views/main/PostContentMenu.vue

@@ -95,6 +95,7 @@
             </v-card>
         </v-container>
     </v-col>
+
 </template>
 
 <script setup>
@@ -112,13 +113,7 @@ const removeContent = (index) => {
     contents.value.splice(index, 1);
 };
 
-const postContent = () => {
-    // Implémenter la logique pour poster le contenu
-};
 
-const previewContent = () => {
-    // Implémenter la logique pour prévisualiser le contenu
-};
 
 const cancelPost = () => {
     if (contents.value.length > 0) {

src/views/main/Profile.vue

@@ -2,7 +2,7 @@
   <div class="px-2">
     <div class="flex flex-col max-w-2xl mx-auto rounded-3xl shadow-2xl mt-2 mb-16">
 
-      <H1 class="text-center text-4xl bg-fuchsia-900 p-3  rounded-t-3xl border-b-4 border-b-gray-200 font-sans text-white">
+      <H1 class="text-center text-4xl bg-fuchsia-900 p-3 w-full rounded-t-3xl border-b-4 border-b-gray-200 font-sans text-white">
         Personnaliser votre profil
       </H1>
       

src/views/manualusers/ARPS.vue

@@ -88,7 +88,7 @@
     </div>
   </div>
 
-  <CreatorFeed ></CreatorFeed>
+ 
 
   <!--Post-modale-->
   <v-dialog v-model="isDialogActive" max-width="500">