From ace8dfbfcd9cb804cd425c38b60542d19433c257 Mon Sep 17 00:00:00 2001
From: xaoxuu <git@xaoxuu.com>
Date: Thu, 11 Jan 2024 22:03:17 +0800
Subject: [PATCH] [opt] style

---
 _config.yml                                |  2 ++
 source/css/_layout/list.styl               | 14 ++++----------
 source/css/_layout/pages/archives.styl     | 10 +++-------
 source/css/_layout/partial/cover.styl      |  1 +
 source/css/_layout/tag-plugins/banner.styl |  4 ++--
 5 files changed, 12 insertions(+), 19 deletions(-)

diff --git a/_config.yml b/_config.yml
index d51f934..8704a6d 100755
--- a/_config.yml
+++ b/_config.yml
@@ -59,6 +59,8 @@ breadcrumb:
 article:
   # 如果没有指定封面，是否根据 tags 作为关键词搜索封面图片？
   auto_cover: false # search from https://source.unsplash.com/
+  # 封面图宽高比
+  cover_ratio: 2.4
   # 如果没有指定横幅，是否根据 tags 作为关键词搜索横幅图片？
   auto_banner: false # search from https://source.unsplash.com/
   # 如果没有指定 excerpt 和 description，将自动取多长的内容作为文章摘要？
diff --git a/source/css/_layout/list.styl b/source/css/_layout/list.styl
index 5528cb8..30a1b73 100644
--- a/source/css/_layout/list.styl
+++ b/source/css/_layout/list.styl
@@ -84,22 +84,16 @@
     object-fit: cover
     width: 100%
     border-radius: 0
-    height: 280px
-    @media screen and (max-width: 900px)
-      height: 240px
-    @media screen and (max-width: $device-tablet)
-      height: 220px
-    @media screen and (max-width: $device-mobile-425)
-      height: 200px
-    @media screen and (max-width: $device-mobile-375)
-      height: 180px
-
+    aspect-ratio: hexo-config('article.cover_ratio')
+    
 .post-list .post-card.post.photo
   .cover
     position: relative
     line-height: 0
     img
       width: 100%
+      object-fit: cover
+      aspect-ratio: hexo-config('article.cover_ratio')
     .cover-info
       padding: 1.5rem 1rem
       position: absolute
diff --git a/source/css/_layout/pages/archives.styl b/source/css/_layout/pages/archives.styl
index f5378d1..667f5e8 100644
--- a/source/css/_layout/pages/archives.styl
+++ b/source/css/_layout/pages/archives.styl
@@ -8,7 +8,7 @@
     margin-bottom: .5em
     position: relative
     padding: 4px 0
-    color: var(--text-p3)
+    color: var(--text-p1)
     &:after
       content: ""
       position: absolute
@@ -18,7 +18,7 @@
       right: 0
       z-index: -1
       border-radius: 4px
-      background: var(--block-border)
+      background: $color-theme
   a.post
     display: inline-flex
     align-items: baseline
@@ -34,13 +34,9 @@
       color: var(--text-p4)
     &:hover
       border-bottom: 1px solid $color-theme
+      color: var(--text-p0)
       time
         color: $color-theme
-  &:hover
-    .archive-header
-      color: var(--text-p1)
-      &:after
-        background: $color-theme
 
 
 
diff --git a/source/css/_layout/partial/cover.styl b/source/css/_layout/partial/cover.styl
index 2b0a8ce..8ea685b 100644
--- a/source/css/_layout/partial/cover.styl
+++ b/source/css/_layout/partial/cover.styl
@@ -21,6 +21,7 @@
     font-size: 1.5rem
     margin: 1rem 0
     line-height: 1.2
+    color: var(--text-p0)
   .description
     margin: 1rem 0
   .start-wrap
diff --git a/source/css/_layout/tag-plugins/banner.styl b/source/css/_layout/tag-plugins/banner.styl
index 2714b45..6999609 100644
--- a/source/css/_layout/tag-plugins/banner.styl
+++ b/source/css/_layout/tag-plugins/banner.styl
@@ -6,9 +6,9 @@
   flex-direction: column
   justify-content: flex-end
   align-items: flex-start
-  height: 240px
+  height: 220px
   @media screen and (max-width: $device-mobile-max)
-    height: 200px
+    height: 180px
   .bg
     z-index: 0
   .content