少し、ブログ記事ページのスタイルを調整

tasuren · Dec 27, 2023 · 31e1077 · 31e1077
1 parent 1e9aa3d
commit 31e1077
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 12 deletions.
diff --git a/src/pages/blog/[id].astro b/src/pages/blog/[id].astro
@@ -78,12 +78,13 @@ for (let tag of article.tags)
 
   @media (width <= 480px) {
     .metadata .content {
-      padding-bottom: 15px;
+      padding-bottom: 5px;
     }
   }
 
   .metadata .content .left {
     padding-right: 1em;
+    max-width: 60%;
   }
   .metadata .content .left #published-at {
     padding-right: 0.5em;
@@ -96,9 +97,10 @@ for (let tag of article.tags)
 </style>
 
 <Layout
-    title={article.title} description={description}
-    keywords={article.tags} type="article"
-    properties={properties}>
+  title={article.title} description={description}
+  keywords={article.tags} type="article"
+  properties={properties}
+>
   {usedHljs ? <Hljs slot="head" /> : null}
 
   <div class="metadata">

diff --git a/src/pages/blog/tags/[tag]/[page].astro b/src/pages/blog/tags/[tag]/[page].astro
@@ -66,19 +66,25 @@ const lastPage = prop.currentPage == prop.lastPage
     } /> : "まだありません。"}
   </details>
 
-  <p />
-
   <!-- 列挙 -->
   <h2>
     一覧{prop.currentPage == 1 ? "" : `（${prop.currentPage}ページ目）`}
   </h2>
+
   <ul class="padding-left-override-for-sp">
-    {prop.data.map(article => <li>
-      <a href={`/blog/${article.id}`}>{article.title}</a>
-      <time datetime={article.publishedAt} class="neutral publication-date">
-        ...
-      </time>
-    </li>)}
+    {
+      prop.data.map(article =>
+        <li>
+          <a href={`/blog/${article.id}`}>{article.title}</a>
+          <time
+            datetime={article.publishedAt}
+            class="neutral publication-date"
+          >
+            ...
+          </time>
+        </li>
+      )
+    }
   </ul>
 
   <!-- ページ切り替え  -->