Add a border and resize the middle column.

src/views/creators/CreatorBanner.vue

@@ -46,7 +46,7 @@
 
   <!-- Actions Button & image profile -->
   <div class="relative bottom-4 w-full">
-    <div class="bg-gray-800 py-4 relative shadow-lg" :style="{ backgroundColor: creator.profileColors.bannerBottom || '#A30E79' }">
+    <div class="bg-gray-800 py-4 relative shadow-lg min-h-24" :style="{ backgroundColor: creator.profileColors.bannerBottom || '#A30E79' }">
       <div class="flex flex-col sm:flex-row items-center sm:justify-between">
         <img
             class="left-5 rounded-full border-solid border-2 sm:absolute sm:top-1/2 sm:transform sm:-translate-y-1/2 md:left-20 z-20"

src/views/creators/CreatorPage.vue

@@ -4,6 +4,8 @@
     <creator-banner :creator="creator"></creator-banner>
 
     <DonationPopup :creator-id="creator.id"></DonationPopup>
+
+    <div class="max-w-[1000px] mx-auto flex flex-row justify-center border-l-2 border-r-2 -mt-6 ">
     
     <div class="w-full mt-20">
 
@@ -33,7 +35,7 @@
                 </PostMessage>
               </div>
 
-              <div class="border-b-2 p-6">
+              <div class="border-b p-6">
                 <h2 class="font-sans font-semibold">Commentaires</h2>
                 <MessageList v-if="creator.id"
                              :content-id="creator.id">
@@ -45,7 +47,7 @@
         </v-tabs-window>
       </v-card-text>
     </div>
-    
+    </div>
   </div>
 
   <!-- Fallback when user try to access a non-existing creator -->