diff --git a/_config.yml b/_config.yml index 21b2c0c..3f92437 100644 --- a/_config.yml +++ b/_config.yml @@ -486,12 +486,10 @@ tag_ui: # 留空或 index # Website Background (設置網站背景) # can set it to color or image (可設置圖片 或者 顔色) -# The formal of color: '#49B202' # The formal of image: url(http://xxxxxx.com/xxx.jpg) -# White color will be shown as default background: -# Show the footer background image (same as top_img) +# Footer Background footer_bg: false # the position of bottom right button/default unit: px (右下角按鈕距離底部的距離/默認單位為px) diff --git a/layout/404.pug b/layout/404.pug index 1e7191b..aaaa169 100644 --- a/layout/404.pug +++ b/layout/404.pug @@ -13,8 +13,7 @@ html(lang=config.language data-theme=theme.display_mode) canvas.fireworks if theme.background - - var is_photo = theme.background.startsWith('url') ? 'photo':'color' - #web_bg(data-type=is_photo) + #web_bg #error-wrap .error-content diff --git a/layout/includes/head/darkmode.pug b/layout/includes/head/darkmode.pug index c3e775d..c80a902 100644 --- a/layout/includes/head/darkmode.pug +++ b/layout/includes/head/darkmode.pug @@ -1,50 +1,53 @@ if theme.darkmode.enable script. - var activateDarkMode = function () { - document.documentElement.setAttribute('data-theme', 'dark') - if (document.querySelector('meta[name="theme-color"]') !== null) { - document.querySelector('meta[name="theme-color"]').setAttribute('content', '#0d0d0d') - } - } - var activateLightMode = function () { - document.documentElement.setAttribute('data-theme', 'light') - if (document.querySelector('meta[name="theme-color"]') !== null) { - document.querySelector('meta[name="theme-color"]').setAttribute('content', '#ffffff') - } - } - - var autoChangeMode = '#{theme.darkmode.autoChangeMode}' - var t = saveToLocal.get('theme') - if (autoChangeMode === '1') { - var isDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches - var isLightMode = window.matchMedia('(prefers-color-scheme: light)').matches - var isNotSpecified = window.matchMedia('(prefers-color-scheme: no-preference)').matches - var hasNoSupport = !isDarkMode && !isLightMode && !isNotSpecified - - if (t === undefined) { - if (isLightMode) activateLightMode() - else if (isDarkMode) activateDarkMode() - else if (isNotSpecified || hasNoSupport) { - var now = new Date() - var hour = now.getHours() - var isNight = hour <= 6 || hour >= 18 - isNight ? activateDarkMode() : activateLightMode() + (function () { + window.activateDarkMode = function () { + document.documentElement.setAttribute('data-theme', 'dark') + if (document.querySelector('meta[name="theme-color"]') !== null) { + document.querySelector('meta[name="theme-color"]').setAttribute('content', '#0d0d0d') } - window.matchMedia('(prefers-color-scheme: dark)').addListener(function (e) { - if (saveToLocal.get('theme') === undefined) { - e.matches ? activateDarkMode() : activateLightMode() + } + window.activateLightMode = function () { + document.documentElement.setAttribute('data-theme', 'light') + if (document.querySelector('meta[name="theme-color"]') !== null) { + document.querySelector('meta[name="theme-color"]').setAttribute('content', '#ffffff') + } + } + + const autoChangeMode = '#{theme.darkmode.autoChangeMode}' + const t = saveToLocal.get('theme') + if (autoChangeMode === '1') { + const isDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches + const isLightMode = window.matchMedia('(prefers-color-scheme: light)').matches + const isNotSpecified = window.matchMedia('(prefers-color-scheme: no-preference)').matches + const hasNoSupport = !isDarkMode && !isLightMode && !isNotSpecified + + if (t === undefined) { + if (isLightMode) activateLightMode() + else if (isDarkMode) activateDarkMode() + else if (isNotSpecified || hasNoSupport) { + const now = new Date() + const hour = now.getHours() + const isNight = hour <= 6 || hour >= 18 + isNight ? activateDarkMode() : activateLightMode() } - }) - } else if (t === 'light') activateLightMode() - else activateDarkMode() - } else if (autoChangeMode === '2') { - now = new Date() - hour = now.getHours() - isNight = hour <= 6 || hour >= 18 - if (t === undefined) isNight ? activateDarkMode() : activateLightMode() - else if (t === 'light') activateLightMode() - else activateDarkMode() - } else { - if (t === 'dark') activateDarkMode() - else if (t === 'light') activateLightMode() - } + window.matchMedia('(prefers-color-scheme: dark)').addListener(function (e) { + if (saveToLocal.get('theme') === undefined) { + e.matches ? activateDarkMode() : activateLightMode() + } + }) + } else if (t === 'light') activateLightMode() + else activateDarkMode() + } else if (autoChangeMode === '2') { + const now = new Date() + const hour = now.getHours() + const isNight = hour <= 6 || hour >= 18 + if (t === undefined) isNight ? activateDarkMode() : activateLightMode() + else if (t === 'light') activateLightMode() + else activateDarkMode() + } else { + if (t === 'dark') activateDarkMode() + else if (t === 'light') activateLightMode() + } + })() + diff --git a/layout/includes/layout.pug b/layout/includes/layout.pug index cff77ca..5787521 100644 --- a/layout/includes/layout.pug +++ b/layout/includes/layout.pug @@ -12,8 +12,7 @@ html(lang=config.language data-theme=theme.display_mode) #body-wrap if theme.background - - var is_photo = theme.background.startsWith('url') ? 'photo':'color' - #web_bg(data-type=is_photo) + #web_bg include ./sidebar.pug include ./header/index.pug diff --git a/layout/includes/rightside.pug b/layout/includes/rightside.pug index 8c53cee..f37a815 100644 --- a/layout/includes/rightside.pug +++ b/layout/includes/rightside.pug @@ -1,28 +1,31 @@ section#rightside #rightside-config-hide - if is_post() - if theme.readmode - button#readmode(type="button" title=_p('rightside.readmode_title')) - i.fas.fa-book-open - if theme.translate && theme.translate.enable + if is_post() && theme.readmode + button#readmode(type="button" title=_p('rightside.readmode_title')) + i.fas.fa-book-open + if theme.translate.enable button#translateLink(type="button" title=_p('rightside.translate_title'))= theme.translate.default if theme.darkmode.enable && theme.darkmode.button button#darkmode(type="button" title=_p('rightside.night_mode_title')) i.fas.fa-adjust #rightside-config-show - button#rightside_config(type="button" title=_p("rightside.setting")) - i.fas.fa-cog - if is_post() && page.comments !== false && theme.comments.use - a#to_comment(href="#post-comment" title=_p("rightside.scroll_to_comment")) - i.fas.fa-comments - if showToc - button#mobile-toc-button.close(type="button" title=_p("rightside.toc")) - i.fas.fa-list-ul + if is_post() + if (theme.readmode || theme.translate.enable || (theme.darkmode.enable && theme.darkmode.button)) + button#rightside_config(type="button" title=_p("rightside.setting")) + i.fas.fa-cog + if commentsJsLoad + a#to_comment(href="#post-comment" title=_p("rightside.scroll_to_comment")) + i.fas.fa-comments + if showToc + button#mobile-toc-button.close(type="button" title=_p("rightside.toc")) + i.fas.fa-list-ul + else if theme.translate.enable || (theme.darkmode.enable && theme.darkmode.button) + button#rightside_config(type="button" title=_p("rightside.setting")) + i.fas.fa-cog + if theme.chat_btn button#chat_btn(type="button" title=_p("rightside.chat_btn")) i.fas.fa-sms button#go-up(type="button" title=_p("rightside.back_to_top")) - i.fas.fa-arrow-up - - + i.fas.fa-arrow-up \ No newline at end of file diff --git a/layout/includes/third-party/pjax.pug b/layout/includes/third-party/pjax.pug index 0f0bb4f..e3c63be 100644 --- a/layout/includes/third-party/pjax.pug +++ b/layout/includes/third-party/pjax.pug @@ -7,7 +7,6 @@ script(src=url_for(theme.CDN.pjax)) script. let pjaxSelectors = [ 'title', - 'meta[name=description]', '#config_change', '#body-wrap', '#rightside-config-hide', diff --git a/package.json b/package.json index e51a840..ad087f2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "hexo-theme-butterfly", - "version": "3.2.0-b7", + "version": "3.2.0", "description": "A Simple and Card UI Design theme for Hexo", "main": "package.json", "scripts": { diff --git a/scripts/filters/random_cover.js b/scripts/filters/random_cover.js index 7252d1d..f484dd1 100644 --- a/scripts/filters/random_cover.js +++ b/scripts/filters/random_cover.js @@ -6,8 +6,13 @@ 'use strict' hexo.extend.filter.register('before_post_render', function (data) { - if (data.top_img && data.top_img.indexOf('/') === -1) data.top_img = data.path + data.top_img - if (data.cover && data.cover.indexOf('/') === -1) data.cover = data.path + data.cover + if (hexo.theme.config.rootConfig.post_asset_folder) { + const imgTestReg = /\.(png|jpe?g|gif|svg|webp)(\?.*)?$/ + const topImg = data.top_img + const cover = data.cover + if (topImg && topImg.indexOf('/') === -1 && imgTestReg.test(topImg)) data.top_img = data.path + topImg + if (cover && cover.indexOf('/') === -1) data.cover = data.path + cover + } if (data.cover === false) { data.randomcover = randomCover() @@ -33,6 +38,7 @@ function randomCover () { return cover } } else { - return theme.default_top_img + cover = 'https://cdn.jsdelivr.net/npm/butterfly-extsrc@1/img/default.jpg' + return cover } } diff --git a/source/css/_layout/head.styl b/source/css/_layout/head.styl index 659a0c5..5d58619 100644 --- a/source/css/_layout/head.styl +++ b/source/css/_layout/head.styl @@ -2,7 +2,6 @@ position: relative width: 100% background-color: $light-blue - background-attachment: scroll background-position: center center background-size: cover background-repeat: no-repeat diff --git a/source/css/_mode/darkmode.styl b/source/css/_mode/darkmode.styl index 541e39c..fc38a7b 100644 --- a/source/css/_mode/darkmode.styl +++ b/source/css/_mode/darkmode.styl @@ -28,21 +28,15 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark' --reward-pop: lighten(#121212, 10) --sidebar-icon-color: alpha(#FFFFFF, .7) - // 網站背景,footer背景 - #web_bg[data-type=color] - background: darken(#121212, 2) - - #web_bg[data-type=photo]:before + #web_bg:before, + #footer:before, + #page-header:before position: absolute width: 100% height: 100% background-color: alpha($dark-black, .7) content: '' - #footer - &:before - background-color: alpha($dark-black, .7) - #article-container code background: #2c2c2c @@ -56,16 +50,6 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark' // 頭部 #page-header - &:before - position: absolute - top: 0 - left: 0 - display: block - width: 100% - height: 100% - background-color: alpha($dark-black, .7) - content: '' - & > #nav.fixed, &.no-top-img #nav background: alpha(#121212, .8) @@ -165,5 +149,6 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark' #artitalk_main #lazy background: #121212 + #operare_artitalk .c2 background: #121212 \ No newline at end of file diff --git a/source/css/var.styl b/source/css/var.styl index 5664622..f0ac7ce 100644 --- a/source/css/var.styl +++ b/source/css/var.styl @@ -32,7 +32,7 @@ $code-font-size = hexo-config('font.code-font-size') ? convert(hexo-config('font $font-color = #1F2D3D $rem = 20px $text-line-height = 2 -$web-bg = hexo-config('background') && convert(hexo-config('background')) +$web-bg = hexo-config('background') && unquote(hexo-config('background')) $index_top_img_height = hexo-config('index_top_img_height') ? convert(hexo-config('index_top_img_height')) : 100vh $index_site_info_top = hexo-config('index_site_info_top') ? convert(hexo-config('index_site_info_top')) : 43% // Global color & SVG