From e898a4a81855cd5f9c9f13b6002604be77c7e54f Mon Sep 17 00:00:00 2001 From: xaoxuu Date: Sat, 19 Nov 2022 17:42:35 +0800 Subject: [PATCH] [opt] css --- layout/_partial/sidebar/index.ejs | 4 ++-- source/css/_layout/main.styl | 6 ++++-- source/css/_layout/md.styl | 7 +++++-- source/css/_layout/partial/bread-nav.styl | 2 +- source/css/_layout/partial/navbar.styl | 9 ++++++++- source/css/_layout/sidebar/sidebar.styl | 2 +- source/css/_layout/sidebar/widgets.styl | 10 +++++++--- 7 files changed, 28 insertions(+), 12 deletions(-) diff --git a/layout/_partial/sidebar/index.ejs b/layout/_partial/sidebar/index.ejs index 558d6e7..f24dd2c 100755 --- a/layout/_partial/sidebar/index.ejs +++ b/layout/_partial/sidebar/index.ejs @@ -47,7 +47,7 @@ function layoutWidgets() { var el = ''; el += '
'; if (page.layout == 'wiki' && proj && page.menu_id == 'wiki') { - el += ''; } if (page.sidebar) { page.sidebar.forEach((w, i) => { diff --git a/source/css/_layout/main.styl b/source/css/_layout/main.styl index eee7f13..1e66af0 100644 --- a/source/css/_layout/main.styl +++ b/source/css/_layout/main.styl @@ -5,8 +5,10 @@ margin-left: "calc(2 * %s)" % var(--gap-l) margin-right: "calc(2 * %s + %s / 2)" % (var(--gap-l) var(--width-left)) @media screen and (min-width: $device-mobile-max) - padding-top: "calc(1 * %s)" % var(--gap-l) + padding-top: "calc(2 * %s)" % var(--gap-l) + @media screen and (max-width: $device-mobile-max) + padding-top: 1rem header - margin: 4rem 1rem 2rem + margin: 2rem 1rem 1rem .logo-wrap margin: 0 diff --git a/source/css/_layout/md.styl b/source/css/_layout/md.styl index 8d6db36..d75b525 100644 --- a/source/css/_layout/md.styl +++ b/source/css/_layout/md.styl @@ -1,6 +1,9 @@ article.md max-width: 100% - padding: 1rem + padding: 0 1rem + margin-top: 1rem + &:first-child + margin-top: 0 color: var(--text-p1) line-height: 1.7 word-break: break-word @@ -33,7 +36,7 @@ article.md.content align-self: center border-bottom-style: dashed border-bottom-color: $color-accent - >:first-child + >:first-child:not(h1) margin-top: 0 h1:not(:first-child) margin-top: 2em diff --git a/source/css/_layout/partial/bread-nav.styl b/source/css/_layout/partial/bread-nav.styl index 1c5b432..4212f76 100644 --- a/source/css/_layout/partial/bread-nav.styl +++ b/source/css/_layout/partial/bread-nav.styl @@ -1,6 +1,6 @@ // 面包屑导航 .bread-nav - padding: 1rem 1rem 0 + padding: 0.25rem 1rem 0 color: var(--text-p3) font-weight: 500 div#breadcrumb diff --git a/source/css/_layout/partial/navbar.styl b/source/css/_layout/partial/navbar.styl index 9f0202f..f898d94 100644 --- a/source/css/_layout/partial/navbar.styl +++ b/source/css/_layout/partial/navbar.styl @@ -1,7 +1,7 @@ .nav-wrap position: sticky position: -webkit-sticky - margin-top: .75rem + margin-top: -0.5rem top: -2px background: var(--site-bg) padding: 0 1rem @@ -57,3 +57,10 @@ nav.cap @media screen and (max-width: $device-mobile-max) .nav-wrap margin-top: 0 + padding-left: 0 + padding-right: 0 + nav + a:first-child + margin-left: 1rem + a:last-child + margin-right: 1rem diff --git a/source/css/_layout/sidebar/sidebar.styl b/source/css/_layout/sidebar/sidebar.styl index 7449985..196d3b1 100644 --- a/source/css/_layout/sidebar/sidebar.styl +++ b/source/css/_layout/sidebar/sidebar.styl @@ -6,6 +6,7 @@ height: "calc(100vh - 1 * %s)" % var(--gap-l) .header margin: var(--gap-l) var(--gap-l) 0 + margin-top: "calc(2 * %s)" % var(--gap-l) @media screen and (min-width: $device-mobile-max) >.widgets:first-child>.widget-wrap:first-child margin-top: "calc(2 * %s)" % var(--gap-l) @@ -23,7 +24,6 @@ .logo-wrap - margin: 1rem 0 display: flex align-items: center overflow: hidden diff --git a/source/css/_layout/sidebar/widgets.styl b/source/css/_layout/sidebar/widgets.styl index 0e70254..0ba8458 100644 --- a/source/css/_layout/sidebar/widgets.styl +++ b/source/css/_layout/sidebar/widgets.styl @@ -9,9 +9,10 @@ z-index: 1 line-height: 1.2 .widget-wrap - margin: 1rem var(--gap-l) 2rem var(--gap-l) + margin: 1rem 0 2rem .widget-header - margin-top: 3rem + padding-left: var(--gap-l) + padding-right: var(--gap-l) display: flex justify-content: space-between align-items: center @@ -41,7 +42,7 @@ fill: $color-hover .widget-body - margin: 0.5rem 0 + margin: 0.5rem var(--gap-l) color: var(--text-p1) p margin-top: .5em @@ -49,6 +50,8 @@ line-height: 1.5 .widget-header+.widget-body margin-top: 0 + .widget-wrap+.widget-wrap .widget-header + margin-top: 3rem .l_left .widgets @@ -70,6 +73,7 @@ .widget-wrap#related .widget-body a margin-top: 0.5rem margin-bottom: 1rem + max-width: 'calc(100% - %s * 2)' % var(--gap-l) .title font-weight: 700 font-size: $fs-14