From 48212b9610ecedb04fb676915b2ede5ed56d4d39 Mon Sep 17 00:00:00 2001 From: Jerry Date: Mon, 5 Aug 2024 16:04:05 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=BE=A9=20pagination=20UI=20?= =?UTF-8?q?=E9=A1=AF=E7=A4=BA=E7=95=B0=E5=B8=B8=E7=9A=84=20bug=20fix:=20?= =?UTF-8?q?=E4=BF=AE=E5=BE=A9=20footer=5Fimg=20=E9=85=8D=E7=BD=AE=E4=B8=8D?= =?UTF-8?q?=E7=94=9F=E6=95=88=E7=9A=84=20bug=20improvement:=20=E5=84=AA?= =?UTF-8?q?=E5=8C=96=20=E8=83=8C=E6=99=AFurl=20=E7=9A=84=E5=88=A4=E6=96=B7?= =?UTF-8?q?=20feat:=20=E8=83=8C=E6=99=AF=E5=9C=96=E7=89=87=E9=85=8D?= =?UTF-8?q?=E7=BD=AE=E4=B8=8D=E5=86=8D=E9=9C=80=E8=A6=81=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=20url()?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- _config.yml | 3 +- layout/includes/header/index.pug | 48 ++++++++++++++---------------- layout/includes/layout.pug | 13 ++------ scripts/helpers/page.js | 17 +++++++++-- source/css/_global/index.styl | 3 +- source/css/_layout/pagination.styl | 1 + source/css/var.styl | 1 - 7 files changed, 43 insertions(+), 43 deletions(-) diff --git a/_config.yml b/_config.yml index cd7b323..67638ba 100644 --- a/_config.yml +++ b/_config.yml @@ -90,8 +90,7 @@ category_per_img: footer_img: false # Website Background -# Can set it to color or image -# The formal of image: url(http://xxxxxx.com/xxx.jpg) +# Can set it to color or image url background: cover: diff --git a/layout/includes/header/index.pug b/layout/includes/header/index.pug index b72d14a..c97ccee 100644 --- a/layout/includes/header/index.pug +++ b/layout/includes/header/index.pug @@ -1,43 +1,41 @@ +- + const returnTopImg = img => img !== false ? img || theme.default_top_img : false + const isFixedClass = theme.nav.fixed ? ' fixed' : '' + var top_img = false + let headerClassName = 'not-top-img' + var bg_img = '' + if !theme.disable_top_img && page.top_img !== false if is_post() - - var top_img = page.top_img || page.cover || theme.default_top_img + - top_img = page.top_img || page.cover || theme.default_top_img else if is_page() - - var top_img = page.top_img || theme.default_top_img + - top_img = page.top_img || theme.default_top_img else if is_tag() - - var top_img = theme.tag_per_img && theme.tag_per_img[page.tag] - - top_img = top_img ? top_img : (theme.tag_img !== false ? theme.tag_img || theme.default_top_img : false) + - top_img = theme.tag_per_img && theme.tag_per_img[page.tag] + - top_img = top_img || returnTopImg(theme.tag_img) else if is_category() - - var top_img = theme.category_per_img && theme.category_per_img[page.category] - - top_img = top_img ? top_img : (theme.category_img !== false ? theme.category_img || theme.default_top_img : false) + - top_img = theme.category_per_img && theme.category_per_img[page.category] + - top_img = top_img || returnTopImg(theme.category_img) else if is_home() - - var top_img = theme.index_img !== false ? theme.index_img || theme.default_top_img : false + - top_img = returnTopImg(theme.index_img) else if is_archive() - - var top_img = theme.archive_img !== false ? theme.archive_img || theme.default_top_img : false + - top_img = returnTopImg(theme.archive_img) else - - var top_img = page.top_img || theme.default_top_img + - top_img = page.top_img || theme.default_top_img if top_img !== false - - var imgSource = top_img && isImgOrUrl(top_img) ? `background-image: url('${url_for(top_img)}')` : `background: ${top_img}` - - var bg_img = top_img ? imgSource : '' - - var site_title = page.title || page.tag || page.category || config.title - - var isHomeClass = is_home() ? 'full_page' : 'not-home-page' - - is_post() ? isHomeClass = 'post-bg' : isHomeClass - else - - var isHomeClass = 'not-top-img' -else - - var top_img = false - - var isHomeClass = 'not-top-img' - -- const isFixedClass = theme.nav.fixed ? ' fixed' : '' + - bg_img = getBgPath(top_img) + - headerClassName = is_home() ? 'full_page' : 'not-home-page' + - headerClassName = is_post() ? 'post-bg' : headerClassName -header#page-header(class=`${isHomeClass+isFixedClass}` style=bg_img) +header#page-header(class=`${headerClassName+isFixedClass}` style=bg_img) !=partial('includes/header/nav', {}, {cache: true}) if top_img !== false if is_post() include ./post-info.pug - else if is_home() + else if is_home() #site-info - h1#site-title=site_title + h1#site-title=config.title if theme.subtitle.enable - var loadSubJs = true #site-subtitle @@ -49,4 +47,4 @@ header#page-header(class=`${isHomeClass+isFixedClass}` style=bg_img) i.fas.fa-angle-down.scroll-down-effects else #page-site-info - h1#site-title=site_title \ No newline at end of file + h1#site-title=page.title || page.tag || page.category \ No newline at end of file diff --git a/layout/includes/layout.pug b/layout/includes/layout.pug index b240726..42b04d2 100644 --- a/layout/includes/layout.pug +++ b/layout/includes/layout.pug @@ -13,7 +13,7 @@ html(lang=config.language data-theme=theme.display_mode class=htmlClassHideAside !=partial('includes/loading/index', {}, {cache: true}) if theme.background - #web_bg + #web_bg(style=getBgPath(theme.background)) !=partial('includes/sidebar', {}, {cache: true}) @@ -28,15 +28,8 @@ html(lang=config.language data-theme=theme.display_mode class=htmlClassHideAside if theme.aside.enable && page.aside !== false include widget/index.pug - - var footerBg = theme.footer_img - if (footerBg) - if (footerBg === true) - - var footer_bg = bg_img - else - - var footer_bg = isImgOrUrl(theme.footer_bg) ? `background-image: url('${url_for(footerBg)}')` : `background: ${footerBg}` - else - - var footer_bg = '' - + - const footerBg = theme.footer_img + - const footer_bg = footerBg ? footerBg === true ? bg_img : getBgPath(footerBg) : '' footer#footer(style=footer_bg) !=partial('includes/footer', {}, {cache: true}) diff --git a/scripts/helpers/page.js b/scripts/helpers/page.js index 72ef5be..a0ae860 100644 --- a/scripts/helpers/page.js +++ b/scripts/helpers/page.js @@ -87,7 +87,18 @@ hexo.extend.helper.register('findArchivesTitle', function (page, menu, date) { return loop(menu) || defaultTitle }) -hexo.extend.helper.register('isImgOrUrl', function (path) { - const imgTestReg = /\.(png|jpe?g|gif|svg|webp)(\?.*)?$/i - return path.includes('//') || imgTestReg.test(path) +hexo.extend.helper.register('getBgPath', function (path) { + if (!path) return '' + + const absoluteUrlPattern = /^(?:[a-z][a-z\d+.-]*:)?\/\//i + const relativeUrlPattern = /^(\.\/|\.\.\/|\/|[^/]+\/).*$/ + const colorPattern = /^(#|rgb|rgba|hsl|hsla|linear-gradient|radial-gradient)/i + + if (colorPattern.test(path)) { + return `background-color: ${path};` + } else if (absoluteUrlPattern.test(path) || relativeUrlPattern.test(path)) { + return `background-image: url(${path});` + } else { + return `background: ${path};` + } }) diff --git a/source/css/_global/index.styl b/source/css/_global/index.styl index 0a4373f..cb925c6 100644 --- a/source/css/_global/index.styl +++ b/source/css/_global/index.styl @@ -75,13 +75,12 @@ body input::placeholder color: var(--font-color) -if $web-bg +if hexo-config('background') #web_bg position: fixed z-index: -999 width: 100% height: 100% - background: $web-bg background-attachment: local background-position: center background-size: cover diff --git a/source/css/_layout/pagination.styl b/source/css/_layout/pagination.styl index 3deedeb..925e076 100644 --- a/source/css/_layout/pagination.styl +++ b/source/css/_layout/pagination.styl @@ -38,6 +38,7 @@ .next-post @extend .postImgHover position: relative + display: block overflow: hidden width: 50% height: 150px diff --git a/source/css/var.styl b/source/css/var.styl index 4605a31..7b5b6e5 100644 --- a/source/css/var.styl +++ b/source/css/var.styl @@ -34,7 +34,6 @@ $font-size = hexo-config('font.global-font-size') ? convert(hexo-config('font.gl $code-font-size = hexo-config('font.code-font-size') ? convert(hexo-config('font.code-font-size')) : var(--global-font-size) $font-color = #1F2D3D $text-line-height = 2 -$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