fix: Layout isses with articles

macx · Apr 15, 2024 · 25cbb1d · 25cbb1d
1 parent a1808a7
commit 25cbb1d
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 9 deletions.
diff --git a/src/components/RelatedArticles.astro b/src/components/RelatedArticles.astro
@@ -46,7 +46,7 @@ const output = [...all, ...some, ...one, ...none]
 <section class='related-articles'>
   <h2 class='title-centered'>Lese als Nächstes</h2>
 
-  <div class='articles'>
+  <div class='l-articles'>
     <ArticleCard article={output[0]} />
     <ArticleCard article={output[1]} />
     <ArticleCard article={output[2]} />
@@ -57,10 +57,4 @@ const output = [...all, ...some, ...one, ...none]
   .related-articles {
     margin-block-start: var(--sp-l);
   }
-
-  .articles {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
-    gap: var(--sp-content);
-  }
 </style>
diff --git a/src/pages/tutorials/[...page].astro b/src/pages/tutorials/[...page].astro
@@ -38,7 +38,7 @@ export async function getStaticPaths({ paginate }: any) {
     >
       <h1>{title}</h1>
       <Lead text={description} />
-      <section class='articles'>
+      <section class='l-articles'>
         {articles.map((article: CollectionEntry<'tutorials'>) => (
           <ArticleCard article={article} />
         ))}

diff --git a/src/pages/tutorials/tags/[tag].astro b/src/pages/tutorials/tags/[tag].astro
@@ -47,7 +47,7 @@ const layout = 'wide'
 
   {
     posts.length > 0 ? (
-      <section class='articles'>
+      <section class='l-articles'>
         {posts.map((post) => (
           <ArticleCard article={post} />
         ))}

diff --git a/src/styles/base/_layout.scss b/src/styles/base/_layout.scss
@@ -128,3 +128,9 @@ main {
     }
   }
 }
+
+.l-articles {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+  gap: var(--sp-content);
+}