<% if (is_home()) { %> - <%- partial('home-content') %> + <%- partial('_page/home') %> <% } else if (is_archive()) { %> - <%- partial('archive-content') %> + <%- partial('_page/archive') %> <% } else if (is_post()) { %> - <%- partial('post-content') %> + <%- partial('_page/post') %> <% } else if (is_category()) { %> - <%- partial('category-content') %> + <%- partial('_page/category-archive') %> <% } else if (is_tag()) { %> - <%- partial('tag-content') %> + <%- partial('_page/tag-archive') %> <% } else if (page_title === 'category' || page_title === 'categories') { %> - <%- partial('category-list') %> + <%- partial('_page/category') %> <% } else if (page_title === 'tag' || page_title === 'tags') { %> - <%- partial('_partial/tagcloud') %> + <%- partial('_page/tag') %> <% } else if (page_type === '404') { %> - <%- partial('404') %> + <%- partial('_page/404') %> <% } else { %> diff --git a/layout/tag.ejs b/layout/tag.ejs deleted file mode 100644 index da62077cc..000000000 --- a/layout/tag.ejs +++ /dev/null @@ -1 +0,0 @@ -<%- partial('page') %> \ No newline at end of file diff --git a/layout/tags.ejs b/layout/tags.ejs deleted file mode 100644 index da62077cc..000000000 --- a/layout/tags.ejs +++ /dev/null @@ -1 +0,0 @@ -<%- partial('page') %> \ No newline at end of file diff --git a/source/css/common/markdown.styl b/source/css/common/markdown.styl index 07ede3043..ff245f053 100644 --- a/source/css/common/markdown.styl +++ b/source/css/common/markdown.styl @@ -153,32 +153,41 @@ h5 h6 { position relative + display flex + justify-content space-between + order 0 box-sizing border-box padding-top 0.4rem padding-bottom 0.2rem overflow hidden color var(--text-color-2) - line-height 1.5 - white-space nowrap - text-overflow ellipsis + line-height 1.6 border-bottom 1px solid var(--post-h-bottom-border-color) + +keep-tablet() { - line-height 1.25 + line-height 1.4 + } + + + +keep-mobile() { + line-height 1.3 } + &:hover { a.headerlink { visibility visible } } + a.headerlink { position relative - float right + order 1 box-sizing border-box - margin-left 0.32rem - padding-top 0.25rem + margin-left 0.4rem + padding-top 0.2rem color var(--text-color-4) font-size 1.2rem text-decoration none @@ -190,6 +199,7 @@ color var(--text-color-3) } + &::before { font-weight 600 font-family 'Font Awesome 6 Free' @@ -204,7 +214,11 @@ font-size 1.8rem +keep-tablet() { - font-size 1.7rem + font-size 1.6rem + } + + +keep-mobile() { + line-height 1.5rem } } @@ -214,7 +228,11 @@ font-size 1.7rem +keep-tablet() { - font-size 1.6rem + font-size 1.5rem + } + + +keep-mobile() { + line-height 1.4rem } } @@ -224,27 +242,47 @@ font-size 1.6rem +keep-tablet() { - font-size 1.5rem + font-size 1.4rem + } + + +keep-mobile() { + line-height 1.3rem } } h4 { font-weight 550 - font-size 1.5rem + font-size 1.4rem +keep-tablet() { - font-size 1.4rem + font-size 1.2rem + } + + +keep-mobile() { + line-height 1.1rem + } + + a.headerlink { + font-size 1.1rem } } h5 { font-weight 500 - font-size 1.28rem + font-size 1.3rem +keep-tablet() { - font-size 1.18rem + font-size 1.2rem + } + + +keep-mobile() { + line-height 1.1rem + } + + a.headerlink { + font-size 1.1rem } } @@ -258,6 +296,10 @@ font-size 1.1rem line-height 1.1 } + + a.headerlink { + font-size 1rem + } } diff --git a/source/css/layout/404.styl b/source/css/layout/_page/404.styl similarity index 100% rename from source/css/layout/404.styl rename to source/css/layout/_page/404.styl diff --git a/source/css/layout/archive-content.styl b/source/css/layout/_page/archive.styl similarity index 100% rename from source/css/layout/archive-content.styl rename to source/css/layout/_page/archive.styl diff --git a/source/css/layout/category-content.styl b/source/css/layout/_page/category-archive.styl similarity index 93% rename from source/css/layout/category-content.styl rename to source/css/layout/_page/category-archive.styl index 8e321922b..48c5275a7 100644 --- a/source/css/layout/category-content.styl +++ b/source/css/layout/_page/category-archive.styl @@ -1,6 +1,6 @@ $category-name-font-size = 1.5rem -.category-container { +.category-archive-container { keep-container(1, 2rem, 2rem) diff --git a/source/css/layout/category-list.styl b/source/css/layout/_page/category.styl similarity index 98% rename from source/css/layout/category-list.styl rename to source/css/layout/_page/category.styl index 468fcb241..73dd9c7f4 100644 --- a/source/css/layout/category-list.styl +++ b/source/css/layout/_page/category.styl @@ -1,7 +1,7 @@ $left-gap = 1.6rem $spacing-padding = 0.6rem -.category-list-container { +.category-page-container { keep-container(1, 2rem, 0) diff --git a/source/css/layout/home-content.styl b/source/css/layout/_page/home.styl similarity index 100% rename from source/css/layout/home-content.styl rename to source/css/layout/_page/home.styl diff --git a/source/css/layout/post-content.styl b/source/css/layout/_page/post.styl similarity index 99% rename from source/css/layout/post-content.styl rename to source/css/layout/_page/post.styl index 258e884df..f463a28b2 100644 --- a/source/css/layout/post-content.styl +++ b/source/css/layout/_page/post.styl @@ -1,4 +1,4 @@ -@import "../common/stylus-variables.styl" +@import "../../common/stylus-variables.styl" $avatar-width = 3.2rem $arrow-icon-width = 1rem diff --git a/source/css/layout/tag-content.styl b/source/css/layout/_page/tag-archive.styl similarity index 94% rename from source/css/layout/tag-content.styl rename to source/css/layout/_page/tag-archive.styl index 58f77fda2..2e710164e 100644 --- a/source/css/layout/tag-content.styl +++ b/source/css/layout/_page/tag-archive.styl @@ -1,6 +1,6 @@ $tag-name-font-size = 1.5rem -.tag-container { +.tag-archive-container { keep-container(1, 2rem, 2rem) diff --git a/source/css/layout/_page/tag.styl b/source/css/layout/_page/tag.styl new file mode 100644 index 000000000..479890c2f --- /dev/null +++ b/source/css/layout/_page/tag.styl @@ -0,0 +1,54 @@ +.tag-page-container { + + keep-container(1, 2rem, 0) + + .tagcloud-content { + + text-align justify + + a { + display inline-block + box-sizing border-box + padding 0.68rem 0.5rem + } + } + + + .tag-list-content { + .tag-list { + position relative + display flex + flex-wrap wrap + gap 0.82rem + justify-content flex-start + box-sizing border-box + + .tag-list-item { + position relative + box-sizing border-box + overflow hidden + border-radius 0.3rem + + + .tag-list-link { + display inline-block + padding 0.4rem 0.6rem + color var(--text-color-3) + background var(--background-color-2) + + &:hover { + color var(--primary-color) + } + } + + + .tag-list-count { + display inline-block + padding 0.4rem 0.6rem + color var(--text-color-3) + background var(--background-color-3) + } + } + } + } +} diff --git a/source/css/layout/_partial/comment/waline.styl b/source/css/layout/_partial/comment/waline.styl index 9bf73fa15..4be72abcc 100644 --- a/source/css/layout/_partial/comment/waline.styl +++ b/source/css/layout/_partial/comment/waline.styl @@ -4,11 +4,15 @@ --waline-active-color var(--primary-color-light-1) --waline-color var(--text-color-3) --waline-bgcolor var(--background-color-1) + --waline-bg-color var(--background-color-1) --waline-border-color var(--border-color) --waline-disable-bgcolor var(--background-color-2) + --waline-disable-bg-color var(--background-color-2) --waline-disable-color var(--text-color-3) --waline-code-bgcolor rgba(40, 44, 52, 0.9) + --waline-code-bg-color rgba(40, 44, 52, 0.9) --waline-info-bgcolor var(--background-color-3) + --waline-info-bg-color var(--background-color-3) --waline-info-color var(--text-color-3) --waline-border 1px solid var(--waline-border-color) --waline-dark-grey var(--text-color-3) diff --git a/source/css/layout/_partial/footer.styl b/source/css/layout/_partial/footer.styl index 3eea1fd7b..3588311aa 100644 --- a/source/css/layout/_partial/footer.styl +++ b/source/css/layout/_partial/footer.styl @@ -1,6 +1,10 @@ $shields-style-height = 22px .footer { + display flex + flex-direction column + align-items center + justify-content center padding 1rem 0 color var(--text-color-4) font-size 1rem @@ -18,160 +22,76 @@ $shields-style-height = 22px } - .website-info-box { + .info-item { + position relative display flex - flex-direction column + flex-wrap wrap align-items center justify-content center + box-sizing border-box + margin 0.2rem 0 + color var(--text-color-4) + &.count-info { + display flex - &.shields { - padding 0 1rem - - img { - height $shields-style-height !important + .count-item { + &.uv + &.pv { + display none + } } + } - a { - position relative - display inline-flex - box-sizing border-box - text-decoration none - } + &.deploy-info { + display flex - .shields-item - .count-box { - margin 0.3rem 0.2rem - user-select none + a + .tooltip { + display flex + align-items center } - } - - +keep-mobile() { - &.shields { - .shields-item - .count-box { - margin 0.12rem -0.3rem - transform scale(0.9) - transform-origin center center - } + img { + height 1.08rem + margin 0 0.4rem } } - .info-item { - position relative - display flex - flex-wrap wrap - align-items center - justify-content center - box-sizing border-box - color var(--text-color-4) - - - &.shields { - .count-box { - display flex - justify-content flex-start - height $shields-style-height - color #f2f2f2 - font-size 12.6px - - - .item-type - .item-value { - display flex - align-items center - height 100% - padding 0 6px - } - - - .item-type { - margin-right 0 - background #555555 - } + &.count-info + &.record-info { - .item-value { + .count-item + .record-item { + margin-right 15px - &.uv { - background coral - } - - &.pv { - background orange - } - - &.word { - background indianred - } - } + &::before { + position absolute + top 50% + left -10px + box-sizing border-box + transform translateY(-56%) + content '|' } - } - - &.default { - margin 0.2rem 0 - - .count-box { - margin-right 15px + &:first-child { &::before { - position absolute - top 50% - left -10px - box-sizing border-box - transform translateY(-55%) - content '|' - } - - - &:first-child { - &::before { - display none - } - } - - - &:last-child { - margin-right 0 - } - - - .item-type { - margin-right 4px - } - } - } - - - &.count-item { - display flex - - .count-box { - &.uv - &.pv { display none } } - } - - &.deploy-info { - display flex - - a - .tooltip { - display flex - align-items center + &:last-child { + margin-right 0 } - img { - height 1.08rem - margin 0 0.4rem + + .item-type { + margin-right 4px } } } diff --git a/source/css/layout/_partial/tagcloud.styl b/source/css/layout/_partial/tagcloud.styl deleted file mode 100644 index ff9cdaf56..000000000 --- a/source/css/layout/_partial/tagcloud.styl +++ /dev/null @@ -1,15 +0,0 @@ -.tagcloud-container { - - keep-container(1, 2rem, 0) - - .tagcloud-content { - - text-align justify - - a { - display inline-block - box-sizing border-box - padding 0.68rem 0.5rem - } - } -} diff --git a/source/css/style.styl b/source/css/style.styl index 6d16778b0..3636f0539 100644 --- a/source/css/style.styl +++ b/source/css/style.styl @@ -19,20 +19,20 @@ @import "layout/_partial/paginator.styl" @import "layout/_partial/first-screen.styl" @import "layout/_partial/image-mask.styl" -@import "layout/category-list.styl" @import "layout/_partial/post-meta-info.styl" @import "layout/_partial/post/post-copyright-info.styl" -@import "layout/home-content.styl" -@import "layout/archive-content.styl" -@import "layout/post-content.styl" -@import "layout/category-content.styl" -@import "layout/tag-content.styl" -@import "layout/404.styl" +@import "layout/_page/home.styl" +@import "layout/_page/archive.styl" +@import "layout/_page/post.styl" +@import "layout/_page/category.styl" +@import "layout/_page/category-archive.styl" +@import "layout/_page/tag.styl" +@import "layout/_page/tag-archive.styl" +@import "layout/_page/404.styl" @import "layout/_template/page-template.styl" @import "layout/_template/friends-link.styl" @import "layout/_template/photo-album.styl" @import "layout/_template/tools-nav.styl" -@import "layout/_partial/tagcloud.styl" @import "layout/_partial/common/empty-content.styl" @import "layout/_partial/post/post-share.styl" @import "layout/_partial/post/reward-author.styl" diff --git a/source/js/main.js b/source/js/main.js index ea15ab3d0..a0a8abd71 100644 --- a/source/js/main.js +++ b/source/js/main.js @@ -29,8 +29,6 @@ window.addEventListener('DOMContentLoaded', () => { KEEP.setFooterVersion = () => { const vd = document.querySelector('.footer .keep-version') vd && (vd.innerHTML = KEEP.themeInfo.theme) - const vd2 = document.querySelector('.footer .shields-keep-version') - vd2 && (vd2.src = vd2.src.replace('Keep', KEEP.themeInfo.theme)) } // set styleStatus to localStorage diff --git a/source/js/utils.js b/source/js/utils.js index 7e4e4eca3..dda1571e5 100644 --- a/source/js/utils.js +++ b/source/js/utils.js @@ -545,8 +545,8 @@ KEEP.initUtils = () => { getText('#busuanzi_value_site_pv') || getText('#busuanzi_value_page_pv') ) { - const tmpDom1 = document.querySelector('.footer .count-item .uv') - const tmpDom2 = document.querySelector('.footer .count-item .pv') + const tmpDom1 = document.querySelector('.footer .count-info .uv') + const tmpDom2 = document.querySelector('.footer .count-info .pv') const tmpDom3 = document.querySelector('.post-meta-info .post-pv') tmpDom1 && (tmpDom1.style.display = 'flex') tmpDom2 && (tmpDom2.style.display = 'flex')