From af6cc6bfb2aa6167ad7820ea766a9fca9d32f7f5 Mon Sep 17 00:00:00 2001 From: xaoxuu Date: Mon, 24 Oct 2022 23:30:34 +0800 Subject: [PATCH] css --- _config.yml | 6 +- layout/_partial/main/article/read_next.ejs | 27 ++++--- source/css/_common/loading.styl | 2 +- source/css/_layout/partial/related.styl | 82 +++++++++++--------- source/css/_layout/sidebar/footer.styl | 2 +- source/css/_layout/sidebar/sidebar.styl | 3 + source/css/_layout/tag-plugins/timeline.styl | 2 +- 7 files changed, 68 insertions(+), 56 deletions(-) diff --git a/_config.yml b/_config.yml index 8001945..3b57132 100755 --- a/_config.yml +++ b/_config.yml @@ -219,10 +219,10 @@ tag_plugins: # {% quot %} quot: default: # 可以自行配置多种图标方案 - prefix: https://s2.loli.net/2022/01/04/vsTB5pGrIHfPxSj.png - suffix: https://s2.loli.net/2022/01/04/NORdtjlAhifZSns.png + prefix: https://bu.dusays.com/2022/10/24/63567d3e092ff.png + suffix: https://bu.dusays.com/2022/10/24/63567d3e0ab55.png hashtag: - prefix: https://s2.loli.net/2022/01/04/UvHcsa73jQPnobq.png + prefix: https://bu.dusays.com/2022/10/24/63567d3e07da3.png # {% emoji %} emoji: default: https://fastly.jsdelivr.net/gh/cdn-x/emoji/qq/%s.gif diff --git a/layout/_partial/main/article/read_next.ejs b/layout/_partial/main/article/read_next.ejs index a7cea44..f781669 100644 --- a/layout/_partial/main/article/read_next.ejs +++ b/layout/_partial/main/article/read_next.ejs @@ -30,22 +30,25 @@ function layoutDiv() { if (prev || next) { el += ''; } diff --git a/source/css/_common/loading.styl b/source/css/_common/loading.styl index f16b050..1848746 100644 --- a/source/css/_common/loading.styl +++ b/source/css/_common/loading.styl @@ -15,7 +15,7 @@ svg.loading transform:rotate(360deg) .loading-wrap - margin: 0.5rem 0 + margin: 0 text-align: center background: var(--block) border-radius: $border-card diff --git a/source/css/_layout/partial/related.styl b/source/css/_layout/partial/related.styl index ed96de8..287e23d 100644 --- a/source/css/_layout/partial/related.styl +++ b/source/css/_layout/partial/related.styl @@ -1,5 +1,6 @@ .related-wrap - padding: 2rem 1rem + padding: 1rem + margin: 2rem 0 &:empty display: none section.header @@ -22,22 +23,31 @@ .related-posts width: 100% margin: 1rem 0 - border-radius: $border-block - background: var(--block) - overflow: hidden - border: 1px solid var(--block-border) .item line-height: 1.2 display: block - padding: 1rem + border-left: 0 + &+.item + margin-top: 1rem + &:first-child + margin-top: 0 .title color: var(--text-p1) font-weight: 500 font-size: 1rem - display: -webkit-box - -webkit-box-orient: vertical - overflow: hidden - -webkit-line-clamp: 2 + trans1 color + position: relative + padding-bottom: 4px + &:after + content: '' + position: absolute + left: 0 + width: 0 + height: 2px + bottom: 0 + border-radius: 2px + background: $color-hover + trans1 width .excerpt color: var(--text-p3) font-size: $fs-12 @@ -45,47 +55,43 @@ display: -webkit-box -webkit-box-orient: vertical overflow: hidden - -webkit-line-clamp: 3 + -webkit-line-clamp: 2 &:hover - background: var(--block-hover) - .item+.item - border-top: 1px dashed var(--block-border) + .title + color: $color-hover + &:after + width: 100% .related-wrap#read-next .body - margin-top: 1rem display: grid grid-gap: 16px grid-template-columns: repeat(auto-fill, "calc((100% - 1 * %s) / 2)" % 16px) - >a - display: flex - flex-direction: column + .item + border-top: 1px dashed var(--block-border) + border-bottom: 1px dashed var(--block-border) + padding: 1rem 0 + .note + margin-bottom: 0.75rem + font-size: $fs-12 + color: var(--text-p4) + font-weight: 500 + a margin: 0 line-height: 1.2 - padding: 0.75rem 0.5rem color: var(--text-p1) - font-size: 1rem - background: var(--card) - border-radius: $border-block - box-shadow: $boxshadow-card - trans2: box-shadow transform - &:last-child - text-align: right - .note - flex-shrink: 0 - margin-bottom: 4px - font-size: $fs-12 - color: var(--text-p4) - font-weight: 500 + font-size: $fs-h4 &:hover color: $color-hover !important - box-shadow: $boxshadow-card-float - transform: translateY(-1px) -.wiki+.related-wrap#read-next .body>a - font-size: $fs-h3 - &:last-child - color: var(--text-p4) + #next + text-align: right +.wiki+.related-wrap#read-next + .item + a + font-size: $fs-h3 + &#prev a + color: var(--text-p3) .related-wrap#comments diff --git a/source/css/_layout/sidebar/footer.styl b/source/css/_layout/sidebar/footer.styl index 10f6b13..79c9f33 100644 --- a/source/css/_layout/sidebar/footer.styl +++ b/source/css/_layout/sidebar/footer.styl @@ -1,4 +1,4 @@ -.l_left .footer +.l_left>.footer margin: 0.5rem var(--gap-l) 0 @media screen and (max-width: $device-tablet) margin-bottom: 1rem diff --git a/source/css/_layout/sidebar/sidebar.styl b/source/css/_layout/sidebar/sidebar.styl index b31f398..4d50a49 100644 --- a/source/css/_layout/sidebar/sidebar.styl +++ b/source/css/_layout/sidebar/sidebar.styl @@ -237,3 +237,6 @@ nav.menu -webkit-box-orient: vertical overflow: hidden -webkit-line-clamp: 5 + +.widgets .loading-wrap + margin: 0.5rem 0 \ No newline at end of file diff --git a/source/css/_layout/tag-plugins/timeline.styl b/source/css/_layout/tag-plugins/timeline.styl index b8e50ec..23d2c86 100644 --- a/source/css/_layout/tag-plugins/timeline.styl +++ b/source/css/_layout/tag-plugins/timeline.styl @@ -137,8 +137,8 @@ font-size: $fs-12 .tag-plugin.timeline.stellar-timeline-api .body .footer + margin: 0 0 -0.5rem padding: 0.5rem 0 1rem - margin-bottom: -0.5rem user-select: none font-weight: 500 display: flex