From 8eb4071c854c8c41f7a425262dd939ab92112e9f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=87=A1=E6=A2=A6=E6=98=9F=E5=B0=98?= Date: Sun, 12 Jun 2022 15:39:35 +0800 Subject: [PATCH] :art: Sync all code from branch develop. --- assets/css/_colors.scss | 1 + assets/css/_common/outline/footer/index.scss | 7 +++- assets/css/_common/outline/mobile.scss | 1 + .../_common/outline/sidebar/sidebar-toc.scss | 1 + .../outline/sidebar/sidebar-toggle.scss | 2 + .../_common/outline/sidebar/site-state.scss | 1 + assets/css/_common/scaffolding/base.scss | 2 + .../scaffolding/highlight/copy-code.scss | 3 ++ .../_common/scaffolding/highlight/index.scss | 5 +++ assets/css/_common/scaffolding/tags/note.scss | 1 + assets/css/_common/scaffolding/tags/tabs.scss | 2 + assets/css/_common/scaffolding/toggles.scss | 2 + assets/css/_variables/base.scss | 15 +++++++- assets/css/main.scss | 10 +++-- exampleSite/config.yaml | 7 ++-- layouts/_default/baseof.html | 8 ++++ layouts/partials/header.html | 38 +------------------ 17 files changed, 60 insertions(+), 46 deletions(-) diff --git a/assets/css/_colors.scss b/assets/css/_colors.scss index 7ab1126..391f348 100644 --- a/assets/css/_colors.scss +++ b/assets/css/_colors.scss @@ -29,6 +29,7 @@ color-scheme: light; } +@if $darkmode { @media (prefers-color-scheme: dark) { :root { --body-bg-color: #{$body-bg-color-dark}; diff --git a/assets/css/_common/outline/footer/index.scss b/assets/css/_common/outline/footer/index.scss index 9e5250c..154186c 100644 --- a/assets/css/_common/outline/footer/index.scss +++ b/assets/css/_common/outline/footer/index.scss @@ -78,13 +78,16 @@ } .with-love { + color: $footer_icon_color; display: inline-block; margin: 0 5px; + @if $footer_icon_animated { animation: icon-animate 1.33s ease-in-out infinite; } } +@if $footer_beian_enable { .beian img { display: inline-block; margin: 0 3px; @@ -92,12 +95,14 @@ } } +@if $busuanzi_enable { .busuanzi-count { + @if $busuanzi_visitors { #busuanzi_container_site_uv { display: none; } } - + @if $busuanzi_views { #busuanzi_container_site_pv { display: none; } diff --git a/assets/css/_common/outline/mobile.scss b/assets/css/_common/outline/mobile.scss index fb52f56..8282056 100644 --- a/assets/css/_common/outline/mobile.scss +++ b/assets/css/_common/outline/mobile.scss @@ -56,6 +56,7 @@ margin-bottom: 10px !important; padding: 10px !important; + @if $note_icons { &:not(.no-icon) { padding-left: 35px !important; } diff --git a/assets/css/_common/outline/sidebar/sidebar-toc.scss b/assets/css/_common/outline/sidebar/sidebar-toc.scss index 90d1633..cca699b 100644 --- a/assets/css/_common/outline/sidebar/sidebar-toc.scss +++ b/assets/css/_common/outline/sidebar/sidebar-toc.scss @@ -1,3 +1,4 @@ +@if $toc_enable { .post-toc { font-size: $font-size-small; padding: 0 8px; diff --git a/assets/css/_common/outline/sidebar/sidebar-toggle.scss b/assets/css/_common/outline/sidebar/sidebar-toggle.scss index 80e6511..4347f6e 100644 --- a/assets/css/_common/outline/sidebar/sidebar-toggle.scss +++ b/assets/css/_common/outline/sidebar/sidebar-toggle.scss @@ -12,8 +12,10 @@ @media (any-hover: hover) { body:not(.sidebar-active) .sidebar-toggle:hover { + @include toggle-arrow($sidebar_position); } } .sidebar-active .sidebar-toggle { + @include toggle-close($sidebar_position); } diff --git a/assets/css/_common/outline/sidebar/site-state.scss b/assets/css/_common/outline/sidebar/site-state.scss index 691f7b9..9958eb2 100644 --- a/assets/css/_common/outline/sidebar/site-state.scss +++ b/assets/css/_common/outline/sidebar/site-state.scss @@ -1,3 +1,4 @@ +@if $site_state { .site-state { @include flex-wrap(); line-height: 1.4; diff --git a/assets/css/_common/scaffolding/base.scss b/assets/css/_common/scaffolding/base.scss index c3e38aa..3f3e049 100644 --- a/assets/css/_common/scaffolding/base.scss +++ b/assets/css/_common/scaffolding/base.scss @@ -18,6 +18,7 @@ body { position: relative; transition: padding $transition-ease; + @if $body_scrollbar_overlay { overflow-x: hidden; @supports (overflow-x: clip) { overflow-x: clip; @@ -25,6 +26,7 @@ body { width: 100vw; } + @if $body_scrollbar_stable { overflow-y: scroll; } } diff --git a/assets/css/_common/scaffolding/highlight/copy-code.scss b/assets/css/_common/scaffolding/highlight/copy-code.scss index 72e2e7c..0b28ff4 100644 --- a/assets/css/_common/scaffolding/highlight/copy-code.scss +++ b/assets/css/_common/scaffolding/highlight/copy-code.scss @@ -11,11 +11,13 @@ position: absolute; transition: opacity $transition-ease; + @if $codeblock_copy_btn_style == 'flat' { background: white; border: 0; font-size: $font-size-smaller; right: 0; top: 0; + } @else if $codeblock_copy_btn_style == 'mac' { color: var(--highlight-foreground); font-size: 14px; right: 0; @@ -31,6 +33,7 @@ } } +@if $codeblock_copy_btn_style == 'mac' { figure.highlight { border-radius: 5px; box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .4); diff --git a/assets/css/_common/scaffolding/highlight/index.scss b/assets/css/_common/scaffolding/highlight/index.scss index 173d5b0..8181783 100644 --- a/assets/css/_common/scaffolding/highlight/index.scss +++ b/assets/css/_common/scaffolding/highlight/index.scss @@ -1,8 +1,13 @@ // Use `@use` to fix issue #67 +// TODO find way to import file by dynmatic // @import '(theme.highlight.enable && theme.highlight.light.file) ? theme.highlight.light.file : null'; // @import '(theme.prism.enable && theme.prism.light) ? theme.prism.light : null'; // @import '(theme.prism.enable && theme.prism.number) ? theme.prism.number : null'; +/* @media (prefers-color-scheme: dark) { + @import '(theme.darkmode && theme.highlight.enable && theme.highlight.dark.file) ? theme.highlight.dark.file : null'; + @import '(theme.darkmode && theme.prism.enable && theme.prism.dark) ? theme.prism.dark : null'; +} */ // @import 'theme.codeblock.copy_button.enable ? "copy-code" : null'; diff --git a/assets/css/_common/scaffolding/tags/note.scss b/assets/css/_common/scaffolding/tags/note.scss index d29d8cd..877e097 100644 --- a/assets/css/_common/scaffolding/tags/note.scss +++ b/assets/css/_common/scaffolding/tags/note.scss @@ -68,6 +68,7 @@ &.#{$type} { @if $note-style == 'flat' { background: map-get($note-bg, $type); + @if $darkmode { @media (prefers-color-scheme: dark) { background: mix(map-get($note-bg, $type), $body-bg-color-dark, 10%); } diff --git a/assets/css/_common/scaffolding/tags/tabs.scss b/assets/css/_common/scaffolding/tags/tabs.scss index 3cfafd1..5c0217c 100644 --- a/assets/css/_common/scaffolding/tags/tabs.scss +++ b/assets/css/_common/scaffolding/tags/tabs.scss @@ -42,6 +42,7 @@ border-radius: $tbr; } + @if $tabs_transition_tabs { transition: all $transition-ease-out; } @@ -56,6 +57,7 @@ width: (18em / 14); } + @if $tabs_transition_labels { transition: all $transition-ease-out; } } diff --git a/assets/css/_common/scaffolding/toggles.scss b/assets/css/_common/scaffolding/toggles.scss index c54669a..bbc3c0d 100644 --- a/assets/css/_common/scaffolding/toggles.scss +++ b/assets/css/_common/scaffolding/toggles.scss @@ -18,7 +18,9 @@ } .toggle.toggle-arrow { + @include toggle-arrow($sidebar_position); } .toggle.toggle-close { + @include toggle-close($sidebar_position); } diff --git a/assets/css/_variables/base.scss b/assets/css/_variables/base.scss index 6f6973b..492bc72 100644 --- a/assets/css/_variables/base.scss +++ b/assets/css/_variables/base.scss @@ -69,6 +69,8 @@ $menu-item-bg-color : $whitesmoke; $menu-item-bg-color-dark : $black-light; // TODO why there need convert +//$theme-color : convert($theme_color_light); +//$theme-color-dark : convert($theme_color_dark); $theme-color : $theme_color_light; $theme-color-dark : $theme_color_dark; @@ -79,7 +81,7 @@ $theme-color-dark : $theme_color_dark; @function get-font-family($config) { //TODO find the way daymatic variable $custom-family: $config; - $custom-family: 'Microsoft YaHei'; + //$custom-family : hexo-config('font.' + $config + '.family'); @return if(type-of($custom-family) == string, unquote($custom-family), null); } @@ -113,6 +115,7 @@ $font-family-monospace : consolas, Menlo, monospace, $font-family-chinese; // Font size +$font-size-base : if($font_enable and (type-of($font_global_size) == number), $font_global_size * 1em, 1em); $font-size-smallest : .75em; $font-size-smaller : .8125em; $font-size-small : .875em; @@ -124,6 +127,7 @@ $font-size-largest : 1.5em; // Headings font size $font-size-headings-step : .125em; +$font-size-headings-base : if($font_enable and (type-of($font_headings_size) == number), $font_headings_size * 1em, 1.625em); // Global line height @@ -157,9 +161,13 @@ $table-row-hover-bg-color-dark : #363636; // -------------------------------------------------- $code-font-family : $font-family-monospace; +$highlight-background : $highlight_light_background; +$highlight-foreground : $highlight_light_foreground; $highlight-gutter-background : mix($highlight-background, $highlight-foreground, 90%); $highlight-gutter-foreground : mix($highlight-background, $highlight-foreground, 10%); +$highlight-background-dark : $highlight_dark_background; +$highlight-foreground-dark : $highlight_dark_foreground; $highlight-gutter-background-dark : mix($highlight-background-dark, $highlight-foreground-dark, 90%); $highlight-gutter-foreground-dark : mix($highlight-background-dark, $highlight-foreground-dark, 10%); @@ -226,6 +234,7 @@ $brand-hover-color : white; $brand-color-dark : $grey-lighter; $brand-hover-color-dark : $grey-lighter; +$font-size-title : if($font_enable and (type-of($font_title_size) == number), $font_title_size * 1em, 1.375em); $font-size-subtitle : $font-size-smaller; $subtitle-color : $grey-dark; $site-subtitle-color : $grey-dark; @@ -249,6 +258,8 @@ $tag-cloud-end-dark : #eee; // Variables for sidebar section elements. // -------------------------------------------------- +$sidebar-padding : if(type-of($sidebar_padding) == number, $sidebar_padding * 1px, 18px); +$sidebar-offset : if(type-of($sidebar_offset) == number, $sidebar_offset * 1px, 12px); $sidebar-nav-color : $grey-dim; $sidebar-nav-hover-color : $whitesmoke; $sidebar-highlight : $blue-bright; @@ -288,11 +299,13 @@ $b2t-bg-color : $black-deep; $post-eof-margin-top : 80px; // or 160px for more white space; $post-eof-margin-bottom : 60px; // or 120px for less white space; +$post-card-margin : 1em 0; // Note colors // -------------------------------------------------- // Read note light_bg_offset from NexT config and set in '$lbg%' to use it as string variable. +$lbg : if(type-of($note_light_bg_offset) == number, $note_light_bg_offset * 1%, 0); $note-types : 'default' 'primary' 'info' 'success' 'warning' 'danger'; $note-border-radius : 3px; diff --git a/assets/css/main.scss b/assets/css/main.scss index 620fd7f..244128f 100644 --- a/assets/css/main.scss +++ b/assets/css/main.scss @@ -139,14 +139,16 @@ $second_comment_name: {{ lower (index $sortNav 1).name }}; // Variables Layer // -------------------------------------------------- @import '_variables/base'; +{{ printf "/* %s Scheme Style */" $P.scheme }} +{{ printf "@import '_variables/%s';" $P.scheme }} // TODO -// @import 'theme.injects.variable'; +//@import 'theme.injects.variable'; // Mixins Layer // -------------------------------------------------- @import '_mixins'; // TODO -// @import 'theme.injects.mixin'; +//@import 'theme.injects.mixin'; // Dark mode colors // -------------------------------------------------- @@ -162,11 +164,11 @@ $second_comment_name: {{ lower (index $sortNav 1).name }}; @import '_common/outline'; // Components - +@import '_common/components'; // Schemes Layer // -------------------------------------------------- - +{{ printf "@import '_schemes/%s/';" $P.scheme }} // Custom Layer // TODO diff --git a/exampleSite/config.yaml b/exampleSite/config.yaml index 70f7514..f3c505c 100644 --- a/exampleSite/config.yaml +++ b/exampleSite/config.yaml @@ -4,7 +4,6 @@ # See: https://theme-next.js.org/docs/getting-started/configuration # =============================================================== - baseURL: / theme: hugo-theme-next @@ -76,7 +75,6 @@ menus: pre: heartbeat weight: 4 - params: mainSections: ["posts"] yearFormat: "2006" @@ -123,6 +121,7 @@ params: # Dark Mode darkmode: true + # --------------------------------------------------------------- # Site Information Settings # --------------------------------------------------------------- @@ -162,12 +161,12 @@ params: #creator: #image: #site: - #googlePlus: #facebook: # admins: # app_id: + # --------------------------------------------------------------- # Menu Settings # --------------------------------------------------------------- @@ -217,7 +216,6 @@ params: # Sidebar padding in pixels. padding: 18 # Sidebar offset from top menubar in pixels (only for Pisces | Gemini). - offset: 12 # Sidebar Avatar @@ -285,6 +283,7 @@ params: # Maximum heading depth of generated toc. maxDepth: 6 + # --------------------------------------------------------------- # Footer Settings # See: https://theme-next.js.org/docs/theme-settings/footer diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 9de4235..eb99ade 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -12,19 +12,24 @@ {{ hugo.Generator }} + + {{- partial "head.html" . }} + {{ block "title" . }}{{ .Site.Title }}{{ end }} +
+ {{- partial "header.html" . }}
{{- if ne .Site.Params.sidebar.display "remove" }} @@ -33,7 +38,9 @@
{{ partial "widgets.html" . }} +
+ {{- block "main" . }}{{- end }} {{- if .IsPage }} {{- partial "comments.html" . }} {{- end }} @@ -41,6 +48,7 @@
+ {{- partial "footer" . }}
diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 379ac88..01f3aaa 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -1,36 +1,2 @@ -
-
-
-
- - - -
-
-
- - -

{{ .Site.Title }}

- - -

{{ .Site.Params.subtitle }}

- {{ with .Site.Params.customLogo }} - {{ if .show }} - Custom Logo - {{ end }} - {{ end }} -
-
-
-
-
-
- -
-
- - - -
-
\ No newline at end of file +{{ partial "header/brand.html" . }} +{{ partial "header/menus.html" . }} \ No newline at end of file