fix(front): more layout consistency fixes

front/src/components/library/Home.vue

@@ -69,6 +69,7 @@ fetchData()
     v-title="labels.title"
     main
     stack
+    gap-84
   >
     <Header
       page-heading
@@ -79,33 +80,28 @@ fetchData()
       :limit="4"
       :title="t('components.library.Home.header.recentlyAdded')"
     />
-    <Spacer />
     <track-widget
       :title="t('components.library.Home.header.recentlyListened')"
       :url="'history/listenings/'"
       :filters="{ scope, ordering: '-creation_date', ...qualityFilters }"
       :websocket-handlers="['Listen']"
     />
-    <Spacer />
     <playlist-widget
       :url="'playlists/'"
       :filters="{scope: scope, playable: true, ordering: '-modification_date', limit: 4}"
       :title="t('components.library.Home.header.playlists')"
     />
-    <Spacer />
     <track-widget
       :title="t('components.library.Home.header.recentlyFavorited')"
       :url="'favorites/tracks/'"
       :filters="{scope: scope, ordering: '-creation_date'}"
     />
-    <Spacer />
     <channels-widget
       :limit="4"
       :filters="{ordering: '-creation_date', external: 'false'}"
       :title="t('components.library.Home.header.newChannels')"
       :show-modification-date="true"
     />
-    <Spacer />
     <artist-widget
       :limit="4"
       :filters="{playable: true, ordering: '-creation_date', include_channels: true, content_category: 'podcast'}"

front/src/components/library/Podcasts.vue

@@ -146,8 +146,6 @@ const { to: upload } = useModal('upload')
     stack
     main
   >
-    <!-- TODO: Find out why lint:tsc doesn't like `onClick` while language server does -->
-    <!-- @vue-ignore -->
     <Header
       page-heading
       :h1="t('components.library.Podcasts.header.browse')"

front/src/components/library/Radios.vue

@@ -115,6 +115,7 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
 
 <template>
   <Layout
+    v-title="labels.title"
     main
     stack
     gap-84
@@ -158,9 +159,8 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
     <Section
       :h2="t('components.library.Radios.header.user')"
       align-left
-      :columns-per-item="3"
       :action="{
-        to: {name: 'library.radios.build'},
+        to: { name: 'library.radios.build' },
         text: t('components.library.Radios.button.create'),
         icon: 'bi-plus',
         solid: true,
@@ -168,7 +168,6 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
         disabled: !store.state.auth.authenticated || undefined
       }"
     >
-      <Spacer no-size />
       <Layout
         flex
         form

front/src/components/manage/moderation/ReportCard.vue

@@ -259,9 +259,7 @@ const handleRemovedNote = (uuid: string) => {
         </tr>
       </tbody>
     </table>
-    <template
+    <template v-if="!isCollapsed">
-      v-if="!isCollapsed"
-    >
       <Layout flex>
         <div class="column">
           <h3>

front/src/views/channels/List.vue

@@ -171,18 +171,13 @@ const showCreateModal = ref(false)
     gap-84
   >
     <Spacer no-size />
-    <!-- TODO: `yarn lint:tsc` doesn't understand the `Prop` type for `Header` while the language server does. It may be a question of typescript version... Investigate and fix! https://dev.funkwhale.audio/funkwhale/funkwhale/-/issues/2437 -->
-    <!-- @vue-ignore -->
     <Section
       v-if="store.state.auth.authenticated"
       :h1="t('views.channels.SubscriptionsList.title')"
       :action="{
         text: t('views.channels.SubscriptionsList.link.addNew'),
-        // @ts-ignore
         onClick: () => { showSubscribeModal = true },
-        // @ts-ignore
         primary: true,
-        // @ts-ignore
         icon: 'bi-plus'
       }"
       large-section-heading