简化视觉元素
This commit is contained in:
parent
3c1f9c3e42
commit
799ad9646e
|
@ -43,11 +43,6 @@ page:
|
||||||
what: Page Not Found
|
what: Page Not Found
|
||||||
why: The address may be entered incorrectly or the address has been deleted.
|
why: The address may be entered incorrectly or the address has been deleted.
|
||||||
action: Back to Home
|
action: Back to Home
|
||||||
categories: "%s's %s has %s categories"
|
|
||||||
tags: "%s's %s has %s tags"
|
|
||||||
archives: "%s in %s years wrote %s articles" # 不知道如何把参数顺序调一下
|
|
||||||
filter: "%s's %s has %s articles"
|
|
||||||
wiki: "%s has %s %s in total"
|
|
||||||
|
|
||||||
message:
|
message:
|
||||||
copied: Copied!
|
copied: Copied!
|
||||||
|
|
|
@ -43,11 +43,6 @@ page:
|
||||||
what: 很抱歉,您访问的页面不存在
|
what: 很抱歉,您访问的页面不存在
|
||||||
why: 可能是输入地址有误或该地址已被删除
|
why: 可能是输入地址有误或该地址已被删除
|
||||||
action: 返回主页
|
action: 返回主页
|
||||||
categories: '%s的%s共有%s个分类'
|
|
||||||
tags: '%s的%s共有%s个标签'
|
|
||||||
archives: '%s在%s年间写了%s篇文章'
|
|
||||||
filter: '%s的%s共有%s篇文章'
|
|
||||||
wiki: '%s共有%s个%s'
|
|
||||||
|
|
||||||
message:
|
message:
|
||||||
copied: 复制成功
|
copied: 复制成功
|
||||||
|
|
|
@ -43,11 +43,6 @@ page:
|
||||||
what: 很抱歉,您訪問的頁面不存在
|
what: 很抱歉,您訪問的頁面不存在
|
||||||
why: 可能是輸入地址有誤或該地址已被刪除
|
why: 可能是輸入地址有誤或該地址已被刪除
|
||||||
action: 返回主頁
|
action: 返回主頁
|
||||||
categories: '%s的%s共有%s個分類'
|
|
||||||
tags: '%s的%s共有%s個標籤'
|
|
||||||
archives: '%s在%s年間寫了%s篇文章'
|
|
||||||
filter: '%s的%s共有%s篇文章'
|
|
||||||
wiki: '%s共有%s个%s'
|
|
||||||
|
|
||||||
message:
|
message:
|
||||||
copied: 複製成功
|
copied: 複製成功
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<div class='nav-wrap'>
|
<div class='nav-wrap mobile-hidden'>
|
||||||
<nav class='sub post cap'>
|
<nav class='sub post cap'>
|
||||||
<% if (is_home()) { %>
|
<% if (is_home()) { %>
|
||||||
<a class='active' href='/'><%- __('btn.recent_publish') %></a>
|
<a class='active' href='/'><%- __('btn.recent_publish') %></a>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<div class='nav-wrap'>
|
<div class='nav-wrap mobile-hidden'>
|
||||||
<nav class='sub wiki cap'>
|
<nav class='sub wiki cap'>
|
||||||
<% if (page.layout == 'index' && page.title && page.wiki) { %>
|
<% if (page.layout == 'index' && page.title && page.wiki) { %>
|
||||||
<a href='<%- url_for(config.wiki_dir || "/wiki/") %>'><%- __('btn.all_wiki') %></a>
|
<a href='<%- url_for(config.wiki_dir || "/wiki/") %>'><%- __('btn.all_wiki') %></a>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<div class='float-panel mobile-only' style='display:none'>
|
<div class='float-panel mobile-only blur' style='display:none'>
|
||||||
<button type='button' class='sidebar-toggle mobile' onclick='sidebar.toggle()'>
|
<button type='button' class='sidebar-toggle mobile' onclick='sidebar.toggle()'>
|
||||||
<svg class="icon" viewBox="0 0 1228 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2849"><path d="M0 0m97.390199 0l973.901995 0q97.390199 0 97.390199 97.390199l0 0q0 97.390199-97.390199 97.3902l-973.901995 0q-97.390199 0-97.390199-97.3902l0 0q0-97.390199 97.390199-97.390199Z" p-id="2850"></path><path d="M0 389.560798m97.390199 0l973.901995 0q97.390199 0 97.390199 97.390199l0 0q0 97.390199-97.390199 97.3902l-973.901995 0q-97.390199 0-97.390199-97.3902l0 0q0-97.390199 97.390199-97.390199Z" p-id="2851"></path><path d="M0 779.121596m97.390199 0l973.901995 0q97.390199 0 97.390199 97.390199l0 0q0 97.390199-97.390199 97.390199l-973.901995 0q-97.390199 0-97.390199-97.390199l0 0q0-97.390199 97.390199-97.390199Z" p-id="2852"></path></svg>
|
<svg class="icon" style="width: 1em; height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15301"><path d="M566.407 808.3c26.9-0.1 49.3-20.8 51.6-47.6-1.9-27.7-23.9-49.7-51.6-51.6h-412.6c-28.2-1.4-52.6 19.5-55.5 47.6 2.3 26.8 24.6 47.5 51.6 47.6h416.5v4z m309.3-249.9c26.9-0.1 49.3-20.8 51.6-47.6-2.2-26.8-24.6-47.5-51.6-47.6h-721.9c-27.7-2.8-52.5 17.4-55.3 45.1-0.1 0.8-0.1 1.7-0.2 2.5 0.9 27.2 23.6 48.5 50.7 47.6H875.707z m-103.1-245.9c26.9-0.1 49.3-20.8 51.6-47.6-0.4-28.3-23.2-51.1-51.5-51.6h-618.9c-29.5-1.1-54.3 21.9-55.5 51.4v0.2c1.4 27.8 25.2 49.2 53 47.8 0.8 0 1.7-0.1 2.5-0.2h618.8z" p-id="15302"></path><path d="M566.407 808.3c26.9-0.1 49.3-20.8 51.6-47.6-1.9-27.7-23.9-49.7-51.6-51.6h-412.6c-28.2-1.4-52.6 19.5-55.5 47.6 1.9 27.7 23.9 49.7 51.6 51.6h416.5z m309.3-249.9c26.9-0.1 49.3-20.8 51.6-47.6-2.2-26.8-24.6-47.5-51.6-47.6h-721.9c-27.7-2.8-52.5 17.4-55.3 45.1-0.1 0.8-0.1 1.7-0.2 2.5 0.9 27.2 23.6 48.5 50.7 47.6H875.707z m-103.1-245.9c26.9-0.1 49.3-20.8 51.6-47.6-0.4-28.3-23.2-51.1-51.5-51.6h-618.9c-29.5-1.1-54.3 21.9-55.5 51.4v0.2c1.4 27.8 25.2 49.2 53 47.8 0.8 0 1.7-0.1 2.5-0.2h618.8z" p-id="15303"></path></svg>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -17,7 +17,6 @@ if (page.menu_id == undefined) {
|
||||||
<% years.push(post.year); %>
|
<% years.push(post.year); %>
|
||||||
<% } %>
|
<% } %>
|
||||||
<% }); %>
|
<% }); %>
|
||||||
<h1 class='list-title h4'><%- __('page.archives', config.title, years.length, site.posts.length) %></h1>
|
|
||||||
<% years.forEach((year, i) => { %>
|
<% years.forEach((year, i) => { %>
|
||||||
<article class='post-card<%- scrollreveal() %>' id='archive'>
|
<article class='post-card<%- scrollreveal() %>' id='archive'>
|
||||||
<div class='list-title h4'><%= year %></div>
|
<div class='list-title h4'><%= year %></div>
|
||||||
|
|
|
@ -9,7 +9,6 @@ if (page.menu_id == undefined) {
|
||||||
<% page.layout = 'categories'; %>
|
<% page.layout = 'categories'; %>
|
||||||
<%- partial('_partial/main/navbar/list_post') %>
|
<%- partial('_partial/main/navbar/list_post') %>
|
||||||
<div class='post-list'>
|
<div class='post-list'>
|
||||||
<h1 class='list-title h4'><%- __('page.categories', config.title, __('btn.blog'), site.categories.length) %></h1>
|
|
||||||
<article class='post-card<%- scrollreveal() %>' id='cats'>
|
<article class='post-card<%- scrollreveal() %>' id='cats'>
|
||||||
<% site.categories.sort('path').each(function(category){ %>
|
<% site.categories.sort('path').each(function(category){ %>
|
||||||
<div>
|
<div>
|
||||||
|
|
|
@ -42,9 +42,6 @@ function layout_posts(partial) {
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
el += '<h1 class="list-title h4">';
|
|
||||||
el += __('page.filter', config.title, page.category || page.tag, page.posts.length);
|
|
||||||
el += '</h1>';
|
|
||||||
page.posts.each(function(post){
|
page.posts.each(function(post){
|
||||||
el += layout_post_card('post', post, partial(post));
|
el += layout_post_card('post', post, partial(post));
|
||||||
})
|
})
|
||||||
|
@ -66,7 +63,6 @@ function layout_wikis(partial) {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
el += '<div class="post-list wiki filter">';
|
el += '<div class="post-list wiki filter">';
|
||||||
el += '<h1 class="list-title h4">' + __("page.wiki", config.title, wikis.length, page.title) + '</h1>';
|
|
||||||
wikis.forEach(function(wiki) {
|
wikis.forEach(function(wiki) {
|
||||||
el += layout_post_card('wiki', wiki, partial(wiki));
|
el += layout_post_card('wiki', wiki, partial(wiki));
|
||||||
});
|
});
|
||||||
|
@ -84,7 +80,6 @@ function layout_wikis(partial) {
|
||||||
}
|
}
|
||||||
}).sort('order');
|
}).sort('order');
|
||||||
el += '<div class="post-list wiki">';
|
el += '<div class="post-list wiki">';
|
||||||
el += '<h1 class="list-title h4">' + __("page.wiki", config.title, wikis.length, __('btn.wiki')) + '</h1>';
|
|
||||||
wikis.forEach(function(wiki) {
|
wikis.forEach(function(wiki) {
|
||||||
el += layout_post_card('wiki', wiki, partial(wiki));
|
el += layout_post_card('wiki', wiki, partial(wiki));
|
||||||
});
|
});
|
||||||
|
|
|
@ -9,7 +9,6 @@ if (page.menu_id == undefined) {
|
||||||
<% page.layout = 'tags'; %>
|
<% page.layout = 'tags'; %>
|
||||||
<%- partial('_partial/main/navbar/list_post') %>
|
<%- partial('_partial/main/navbar/list_post') %>
|
||||||
<div class='post-list'>
|
<div class='post-list'>
|
||||||
<h1 class='list-title h4'><%- __('page.tags', config.title, __('btn.blog'), site.tags.length) %></h1>
|
|
||||||
<article class='post-card<%- scrollreveal() %>' id='tags'>
|
<article class='post-card<%- scrollreveal() %>' id='tags'>
|
||||||
<% site.tags.sort('length', -1).each(function(tag){ %>
|
<% site.tags.sort('length', -1).each(function(tag){ %>
|
||||||
<a class='tag' href="<%= url_for(tag.path) %>">
|
<a class='tag' href="<%= url_for(tag.path) %>">
|
||||||
|
|
|
@ -1,14 +1,16 @@
|
||||||
:root
|
:root
|
||||||
|
--blur-px: 12px
|
||||||
--blur-bg: alpha(white, .5)
|
--blur-bg: alpha(white, .5)
|
||||||
if hexo-config('style.darkmode') == 'auto'
|
if hexo-config('style.darkmode') == 'auto'
|
||||||
@media (prefers-color-scheme: dark)
|
@media (prefers-color-scheme: dark)
|
||||||
:root
|
:root
|
||||||
--blur-bg: alpha(black, .5)
|
--blur-bg: alpha(black, .5)
|
||||||
|
|
||||||
.blur
|
.blur
|
||||||
background: var(--blur-bg)
|
background: var(--blur-bg)
|
||||||
@supports ((-webkit-backdrop-filter:blur(12px)) or (backdrop-filter:blur(12px)))
|
@supports ((-webkit-backdrop-filter:blur(var(--blur-px))) or (backdrop-filter:blur(var(--blur-px))))
|
||||||
background: var(--blur-bg) !important
|
background: var(--blur-bg) !important
|
||||||
backdrop-filter: saturate(200%) blur(12px)
|
backdrop-filter: saturate(200%) blur(var(--blur-px))
|
||||||
-webkit-backdrop-filter: saturate(200%) blur(12px)
|
-webkit-backdrop-filter: saturate(200%) blur(var(--blur-px))
|
||||||
&:hover
|
&:hover
|
||||||
background: var(--card)
|
background: var(--card)
|
||||||
|
|
|
@ -0,0 +1,42 @@
|
||||||
|
.mobile-only
|
||||||
|
display: none
|
||||||
|
@media screen and (max-width: $device-tablet)
|
||||||
|
display: block !important
|
||||||
|
|
||||||
|
.mobile-hidden
|
||||||
|
@media screen and (max-width: $device-tablet)
|
||||||
|
display: none
|
||||||
|
|
||||||
|
.float-panel
|
||||||
|
position: sticky
|
||||||
|
right: 0
|
||||||
|
bottom: 2rem
|
||||||
|
float: right
|
||||||
|
z-index: 9
|
||||||
|
display: flex
|
||||||
|
border-radius: 4px 0 0 4px
|
||||||
|
padding-right: 1rem
|
||||||
|
border: 1px solid var(--block-border)
|
||||||
|
border-right: 0
|
||||||
|
overflow: hidden
|
||||||
|
--blur-px: 24px
|
||||||
|
--blur-bg: alpha(#eaeaea, .6)
|
||||||
|
if hexo-config('style.darkmode') == 'auto'
|
||||||
|
@media (prefers-color-scheme: dark)
|
||||||
|
--blur-bg: alpha(#555, .6)
|
||||||
|
|
||||||
|
.sidebar-toggle.mobile
|
||||||
|
cursor: pointer
|
||||||
|
color: var(--text-p2)
|
||||||
|
border-right: 1px solid transparent
|
||||||
|
background: none
|
||||||
|
padding: 0.5rem
|
||||||
|
line-height: 0
|
||||||
|
font-size: 20px
|
||||||
|
|
||||||
|
|
||||||
|
.l_body.mobile.sidebar
|
||||||
|
.sidebar-toggle.mobile
|
||||||
|
background: var(--card)
|
||||||
|
color: $color-hover
|
||||||
|
border-color: var(--block-border)
|
|
@ -1,29 +0,0 @@
|
||||||
.mobile-only
|
|
||||||
display: none
|
|
||||||
@media screen and (max-width: $device-tablet)
|
|
||||||
display: block !important
|
|
||||||
|
|
||||||
.float-panel
|
|
||||||
position: sticky
|
|
||||||
right: 0
|
|
||||||
bottom: 2rem
|
|
||||||
float: right
|
|
||||||
z-index: 9
|
|
||||||
display: flex
|
|
||||||
border-radius: 2rem 0 0 2rem
|
|
||||||
padding-right: 2rem
|
|
||||||
padding: 4px
|
|
||||||
overflow: hidden
|
|
||||||
background: var(--block-hover)
|
|
||||||
|
|
||||||
.sidebar-toggle.mobile
|
|
||||||
cursor: pointer
|
|
||||||
color: var(--text-p2)
|
|
||||||
background: white
|
|
||||||
padding: 0.5rem
|
|
||||||
margin-right: 1rem
|
|
||||||
border-radius: 32px
|
|
||||||
line-height: 1
|
|
||||||
width: 2rem
|
|
||||||
height: 2rem
|
|
||||||
font-size: 13px
|
|
|
@ -18,11 +18,6 @@
|
||||||
width: 320px
|
width: 320px
|
||||||
max-width: var(--width-main)
|
max-width: var(--width-main)
|
||||||
|
|
||||||
.l_body.mobile.sidebar
|
|
||||||
.sidebar-toggle.mobile
|
|
||||||
background: $color-hover
|
|
||||||
color: white
|
|
||||||
|
|
||||||
|
|
||||||
// iPad 竖屏
|
// iPad 竖屏
|
||||||
@media screen and (max-width: $device-tablet)
|
@media screen and (max-width: $device-tablet)
|
||||||
|
|
|
@ -7,22 +7,4 @@
|
||||||
@media screen and (min-width: $device-tablet)
|
@media screen and (min-width: $device-tablet)
|
||||||
padding-top: "calc(2 * %s)" % var(--gap-l)
|
padding-top: "calc(2 * %s)" % var(--gap-l)
|
||||||
header
|
header
|
||||||
padding: 2rem 1rem 0
|
margin: 2rem 1rem
|
||||||
border-bottom: 2px solid var(--block)
|
|
||||||
margin-bottom: 1.5rem
|
|
||||||
.logo-wrap
|
|
||||||
margin: 0.5rem 0
|
|
||||||
nav.menu
|
|
||||||
background: none
|
|
||||||
padding: 0
|
|
||||||
justify-content: space-between
|
|
||||||
a.nav-item
|
|
||||||
margin: 0
|
|
||||||
margin-bottom: -2px
|
|
||||||
padding: 0.5rem 1rem
|
|
||||||
border-radius: 0
|
|
||||||
border-bottom: 2px solid var(--block)
|
|
||||||
a.nav-item.active, a.nav-item:hover
|
|
||||||
background: none
|
|
||||||
color: $color-theme
|
|
||||||
border-bottom-color: $color-theme
|
|
||||||
|
|
Loading…
Reference in New Issue