Fixes

frontend/app/components/Container.vue

@@ -25,11 +25,6 @@
   box-shadow: 4px -4px 0px 0px var(--color-container-shadow);
 }
 
-.tui-frame:first-child {
-  margin-top: 0;
-  margin-right: 0;
-}
-
 .tui-inner {
   padding: 8px 24px;
   color: white;

frontend/app/pages/art/index.vue

@@ -72,9 +72,7 @@ const ART_LIMIT = 6;
 const showAll = ref(false);
 
 const displayedArt = computed(() => {
-  const allPosts = posts.value || [];
+  return posts.value || [];
-  if (showAll.value || allPosts.length <= ART_LIMIT) return allPosts;
-  return allPosts.slice(0, ART_LIMIT);
 });
 </script>
 
@@ -83,7 +81,7 @@ const displayedArt = computed(() => {
       <TableHeader></TableHeader>
     </div>
     <FixedLayout>
-        <Container>
+        <Container class="top-margin">
             <h1 class="section-title">{{ t('pages.art_heading') }}</h1>
             <div class="grid">
                 <NuxtLink v-for="art in displayedArt"
@@ -103,9 +101,6 @@ const displayedArt = computed(() => {
                     <div class="overlay-label">{{ art.title }}</div>
                 </NuxtLink>
             </div>
-            <p v-if="posts && posts.length > ART_LIMIT" class="show-more-toggle">
-              <button type="button" class="tui-link" @click="showAll = !showAll">{{ showAll ? t('pages.show_less') : t('pages.show_more') }}</button>
-            </p>
         </Container>
     </FixedLayout>
     <Footer></Footer>

frontend/app/pages/index.vue

@@ -277,6 +277,11 @@ const sectionTargets = {
 </template>
 
 <style lang="scss" scoped>
+.tui-frame:first-child {
+  margin-top: 0;
+  margin-right: 0;
+}
+
 .intro-section {
 
   .intro-layout {