update: friends page

.gitignore

@@ -30,3 +30,6 @@ resources
 
 assets/jsconfig.json
 .DS_Store
+
+# hugo build logs
+*.log

content/page/friend.md

@@ -1,5 +1,6 @@
 ---
 title: "友情链接"
+linksTitle: "朋友们"
 slug: "friend"
 layout: links
 menu: 
@@ -12,7 +13,7 @@ edit: false
 comment: true
 ---
 
-### 申请要求
+## 申请要求
 
 感谢添加我为友链，作为互联网的一个独立的小角落，也希望您的网站能够满足以下几点简单的要求
 
@@ -25,7 +26,7 @@ comment: true
 
 我将每个季度审查一次所有已添加友链的网站，若发现网站无法访问或不符合上述要求，将移除该友链
 
-### 友链申请格式
+## 友链申请格式
 
 请按以下格式在评论区留言~
 

layouts/page/links.html

@@ -1,35 +1,42 @@
-{{ define "body-class" }}article-page keep-sidebar{{ end }}
+{{ define "body-class" }}article-page keep-sidebar links-page{{ end }}
 {{ define "main" }}
-    <div class="article-list--compact links">
+    {{ $linksTitle := default .Title .Params.linksTitle }}
+    <section class="links-section" aria-labelledby="links-title">
+        <header class="links-section__header">
+            <h1 id="links-title">{{ $linksTitle }}</h1>
+        </header>
+
+        <div class="links-grid">
         {{ $siteResources := resources }}
-        {{ range $i, $link :=  hugo.Data.links }}
-            <article>
+        {{ range $link := hugo.Data.links }}
+            <article class="link-card">
                 <a href="{{ $link.website }}" target="_blank" rel="noopener">
-                    <div class="article-details">
-                        <h2 class="article-title">
+                    <div class="link-card__details">
+                        <h2 class="link-card__title">
                             {{- $link.title -}}
                         </h2>
-                        <footer class="article-time">
+                        <p class="link-card__description">
                             {{ with $link.description }}
                                 {{ . }}
                             {{ else }}
                                 {{ $link.website }}
                             {{ end }}
-                        </footer>
+                        </p>
                     </div>
 
                     {{ if $link.image }}
                         {{ $image := $siteResources.Get (delimit (slice "link-img/" $link.image) "") | resources.Fingerprint "md5" }}
                         {{ $imageResized := $image.Resize "120x120" }}
-                        <div class="article-image">
+                        <div class="link-card__image">
                             <img src="{{ $imageResized.RelPermalink }}" width="{{ $imageResized.Width }}" height="{{ $imageResized.Height }}"
-                                loading="lazy" data-key="links-{{ $link.website }}" data-hash="{{ $image.Data.Integrity }}">
+                                loading="lazy" alt="{{ $link.title }}" data-key="links-{{ $link.website }}" data-hash="{{ $image.Data.Integrity }}">
                         </div>
                     {{ end }}
                 </a>
             </article>
         {{ end }}
         </div>
+    </section>
 
     {{ partial "article/article.html" . }}