feat: new friends page

lh1me · Jan 16, 2022 · f76711d · f76711d
1 parent 6a0f8d4
commit f76711d
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 35 deletions.
diff --git a/_config.yml b/_config.yml
@@ -1,4 +1,4 @@
-version: 1641793753600
+version: 1642325296972
 language: cn
 aomori_widgets:
   - toc

diff --git a/layout/_partial/page/friends.ejs b/layout/_partial/page/friends.ejs
@@ -1,10 +1,15 @@
-<div class="friends-cover"></div>
-
-<div class="friends-links clearfix">
-    <% for (var link in site.data.friends) { %>
-    <a href="<%= site.data.friends[link].url %>" rel="nofollow" target="_blank"> <%= site.data.friends[link].name %> </a>
-    <% } %>
-</div>
+<% site.data.friends.forEach((items) => { %>
+    <div class="friends-category">
+        <div class="friends-category-title">
+            <%= items.category %>
+        </div>
+        <div class="friends-category-inner clearfix">
+            <% items.data.forEach((item) => { %>
+                <a href="<%= item.url %>" rel="nofollow" target="_blank"> <%= item.name %> </a>
+            <% }) %>
+        </div>
+    </div>
+<% }) %>
 
 <% if (post.content){ %>
 <article

diff --git a/source/dist/custom.css b/source/dist/custom.css
diff --git a/source/stylesheets/page.scss b/source/stylesheets/page.scss
@@ -12,24 +12,38 @@
         // .article-entry {}
     }
 
-    &-cover {
-        width: 100%;
-        height: 260px;
-        margin-bottom: 50px;
-        background: url('/images/friends.svg') no-repeat center center;
-        background-size: contain;
-    }
-
-    &-links {
-        a {
-            background: var(--color-white-light);
-            border-radius: 8px;
-            display: block;
-            float: left;
-            margin-bottom: 20px;
-            margin-right: 20px;
-            padding: 15px 20px;
+    &-category {
+        &-title {
             position: relative;
+            line-height: 1;
+            padding: 0 0 20px 12px;
+            font-size: 18px;
+            font-weight: bold;
+
+            &::before {
+                background: var(--color-main);
+                content: '';
+                height: 18px;
+                left: 0;
+                position: absolute;
+                top: 0;
+                width: 3px;
+            }
+        }
+
+        &-inner {
+            padding: 0 0 10px;
+
+            a {
+                float: left;
+                background: var(--color-white-light);
+                border-radius: 8px;
+                display: block;
+                margin-bottom: 20px;
+                margin-right: 20px;
+                padding: 15px 20px;
+                position: relative;
+            }
         }
     }
 }

diff --git a/source/stylesheets/style.scss b/source/stylesheets/style.scss
@@ -938,15 +938,6 @@ img:not([src]):not([srcset]) {
     }
 }
 
-.archives-cover {
-    width: 100%;
-    height: 260px;
-    margin-bottom: 50px;
-    background: url('/images/archives.svg') no-repeat center center;
-    background-size: contain;
-}
-
-
 .archives-wrap {
     background: var(--color-white-light);
     border-radius: 8px;