Merge branch 'v1.2' into myblog

i18n
xaoxuu 5 years ago
commit ef7ae3f461
  1. 2
      _config.yml
  2. 4
      languages/en.yml
  3. 4
      languages/zh-CN.yml
  4. 4
      languages/zh-HK.yml
  5. 4
      languages/zh-TW.yml
  6. 13
      layout/_partial/archive.ejs
  7. 1
      layout/_partial/footer.ejs
  8. 5
      layout/_partial/header.ejs
  9. 3
      layout/_partial/loading.ejs
  10. 26
      layout/_partial/side.ejs
  11. 98
      layout/archive.ejs
  12. 7
      layout/category.ejs
  13. 27
      layout/index.ejs
  14. 29
      layout/layout.ejs
  15. 94
      layout/links.ejs
  16. 7
      layout/page.ejs
  17. 7
      layout/post.ejs
  18. 7
      layout/tag.ejs
  19. 169
      source/less/_base.less
  20. 7
      source/less/_header.less
  21. 314
      source/less/_side.less
  22. 313
      source/less/_widget.less
  23. 1
      source/style.less

@ -20,7 +20,7 @@ style: pure # pure: 导航栏和标题栏背景是白色
# 服务开关,如果你想禁用某些功能,直接设置为false或者注释掉,相关的js脚本就不会加载。
# 有些服务这里打开了也未必会生效,还需要额外的配置,详见文档。
services:
cdn: true
# cdn: true
scrollreveal: true
nodewaves: true
busuanzi: true

@ -1,6 +1,3 @@
pagetitle:
category: Category
tagcloud: Tag
sidebar:
category: Categories
tagcloud: Hot Tags
@ -31,6 +28,7 @@ footer:
times: times
search:
placeholder: Search
placeholder_home: ' '
symbol:
comma: ", "
period: ". "

@ -1,6 +1,3 @@
pagetitle:
category: 分类
tagcloud: 标签
sidebar:
category: 所有分类
tagcloud: 热门标签
@ -31,6 +28,7 @@ footer:
times:
search:
placeholder: 搜索
placeholder_home: 'la víspera de la tormenta'
symbol:
comma: ","
period: "。"

@ -1,6 +1,3 @@
pagetitle:
category: 分類
tagcloud: 標籤
sidebar:
category: 所有分類
tagcloud: 熱門標籤
@ -31,6 +28,7 @@ footer:
  times:
search:
placeholder: 搜尋
placeholder_home: ' '
symbol:
comma: ","
period: "。"

@ -1,6 +1,3 @@
pagetitle:
category: 分類
tagcloud: 標籤
sidebar:
category: 所有分類
tagcloud: 熱門標籤
@ -31,6 +28,7 @@ footer:
times:
search:
placeholder: 搜尋
placeholder_home: ' '
symbol:
comma: ","
period: "。"

@ -1,16 +1,3 @@
<% if (is_tag()) { %>
<script>
window.subData= { title:'<%- __('pagetitle.tagcloud') %> : <%= page.tag %>'}
</script>
<% } else if (is_archive()) { %>
<script>
window.subData= { title:'year : <%= page.year %><%= page.month ? '.' + page.month : '' %>'}
</script>
<% } else if (is_category()) { %>
<script>
window.subData= { title:'<%- __('pagetitle.category') %> : <%= page.category %>'}
</script>
<% } %>
<% if (site.posts && site.posts.length > 0) { %>

@ -19,3 +19,4 @@
<div><%- __('footer.use') %> <a href="https://xaoxuu.com/wiki/material-x/" target="_blank" class="codename">Material X</a> <%- __('footer.theme') %><% if (theme.services && theme.services.busuanzi == true) { %><%- __('symbol.comma') %><%- __('footer.total_views') %> <span id="busuanzi_value_site_pv"><i class="fas fa-spinner fa-spin fa-fw" aria-hidden="true"></i></span> <%- __('footer.times') %><% } %><%- __('symbol.period') %>
</div>
</footer>
<script>setLoadingBarProgress(80);</script>

@ -1,3 +1,7 @@
<div id="loading-bar-wrapper">
<div id="loading-bar" class="<%= theme.style %>"></div>
</div>
<header class="l_header <%= theme.style %>">
<div class='wrapper'>
<div class="nav-main container container--flex">
@ -65,3 +69,4 @@
</nav>
</header>
</aside>
<script>setLoadingBarProgress(40);</script>

@ -1,3 +0,0 @@
<div id="loading-bar-wrapper">
<div id="loading-bar" class="<%= theme.style %>"></div>
</div>

@ -1,13 +1,15 @@
<% if (config.widgets && config.widgets.length){ %>
<%
let supportWidgets = ['author', 'category', 'list', 'music', 'tagcloud', 'toc', 'plain', 'related_posts'];
%>
<% config.widgets.forEach(function(item){ %>
<% if (item.enable != false){ %>
<% let widget_name = item.widget ? item.widget : 'plain'; %>
<% if (supportWidgets.indexOf(widget_name) > -1){ %>
<%- partial('../_widget/' + item.widget, {item: item}) %>
<aside class='l_side'>
<% if (config.widgets && config.widgets.length){ %>
<%
let supportWidgets = ['author', 'category', 'list', 'music', 'tagcloud', 'toc', 'plain', 'related_posts'];
%>
<% config.widgets.forEach(function(item){ %>
<% if (item.enable != false){ %>
<% let widget_name = item.widget ? item.widget : 'plain'; %>
<% if (supportWidgets.indexOf(widget_name) > -1){ %>
<%- partial('../_widget/' + item.widget, {item: item}) %>
<% } %>
<% } %>
<% } %>
<% }) %>
<% } %>
<% }) %>
<% } %>
</aside>

@ -1,48 +1,56 @@
<% if (page.year || page.month) { %>
<%- partial('_partial/archive') %>
<% } else { %>
<article id="archive-page" class="post article white-box">
<section class="archive">
<%
var year = -1, postid = -1;
site.posts.sort('date', -1).each(function(post) {
post.year = date(post.date, 'YYYY');
if (post.year && post.year !== year) {
year = post.year;
%>
<div class="archive-item archive-year mark">
<h2><%= year %></h2>
<hr>
</div>
<% } %>
<div class="archive-item archive-post mark">
<a href="<%= url_for(post.path) %>">
<time><%= date(post.date, 'MM-DD') %></time>
<span class="title">
<% if(post.title){ %>
<%- post.title %>
<% } else if (post.date) { %>
<%= date(post.date, config.date_format) %>
<% } %>
<% if(post.music){ %>
&nbsp;<i class="fas fa-music" aria-hidden="true"></i>
<% } %>
<% if(post.video){ %>
&nbsp;<i class="fas fa-video" aria-hidden="true"></i>
<% } %>
<% if (post.icon) { %>
&nbsp;<i class="<%- post.icon %>" aria-hidden="true"></i>
<% } %>
<% (post.icons && post.icons||[]).forEach(function(icon){ %>
&nbsp;<i class="<%- icon %>" aria-hidden="true"></i>
<% }) %>
</span>
</a>
</div>
<% }); %>
</section>
</article>
<% } %>
<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %>
<div class='l_main'>
<% if (page.year || page.month) { %>
<%- partial('_partial/archive') %>
<% } else { %>
<article id="archive-page" class="post article white-box">
<section class="archive">
<%
var year = -1, postid = -1;
site.posts.sort('date', -1).each(function(post) {
post.year = date(post.date, 'YYYY');
if (post.year && post.year !== year) {
year = post.year;
%>
<div class="archive-item archive-year mark">
<h2><%= year %></h2>
<hr>
</div>
<% } %>
<div class="archive-item archive-post mark">
<a href="<%= url_for(post.path) %>">
<time><%= date(post.date, 'MM-DD') %></time>
<span class="title">
<% if(post.title){ %>
<%- post.title %>
<% } else if (post.date) { %>
<%= date(post.date, config.date_format) %>
<% } %>
<% if(post.music){ %>
&nbsp;<i class="fas fa-music" aria-hidden="true"></i>
<% } %>
<% if(post.video){ %>
&nbsp;<i class="fas fa-video" aria-hidden="true"></i>
<% } %>
<% if (post.icon) { %>
&nbsp;<i class="<%- post.icon %>" aria-hidden="true"></i>
<% } %>
<% (post.icons && post.icons||[]).forEach(function(icon){ %>
&nbsp;<i class="<%- icon %>" aria-hidden="true"></i>
<% }) %>
</span>
</a>
</div>
<% }); %>
</section>
</article>
<% } %>
</div>
<%- partial('_partial/side') %>
<%- partial('_partial/footer', null, {cache: !config.relative_link}) %>
<!-- 根据主题中的设置决定是否在archive中针对摘要部分的MathJax公式加载mathjax.js文件 -->
<%

@ -1 +1,6 @@
<%- partial('_partial/archive') %>
<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %>
<div class='l_main'>
<%- partial('_partial/archive') %>
</div>
<%- partial('_partial/side') %>
<%- partial('_partial/footer', null, {cache: !config.relative_link}) %>

@ -1 +1,26 @@
<%- partial('_partial/archive') %>
<div class='home-cover'>
<h1 class='title'>xaoxuu</h1>
<br>
<% if (theme.search.enable === true) { %>
<div class="m_search">
<form name="searchform" class="form u-search-form">
<input type="text" class="input u-search-input" placeholder="<%- __('search.placeholder_home') %>" />
<span class="icon"><i class="fas fa-search fa-fw"></i></span>
</form>
</div>
<% } %>
<div class='menu'>
<ul class='h-list'>
<% if (config.menu) { %>
<% (config.menu || []).forEach(function(value){ %>
<li>
<a id="<%= url_for(value.url).replace(/\/|%/g, "")?url_for(value.url).replace(/\/|%/g, ""):"home" %>"
class="nav flat-box" href="<%= url_for(value.url) %>">
<i class='<%= value.icon %> fa-fw'></i>&nbsp;<%= __('navbar.'+value.name) == ('navbar.'+value.name) ? value.name : __('navbar.'+value.name) %>
</a>
</li>
<%})%>
<% } %>
</ul>
</div>
</div>

@ -2,25 +2,14 @@
<html>
<%- partial('_partial/head') %>
<body>
<%- partial('_partial/loading') %>
<script>setLoadingBarProgress(20)</script>
<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %>
<script>setLoadingBarProgress(40);</script>
<div class="l_body">
<div class='container clearfix'>
<div class='l_main'>
<%- body %>
</div>
<aside class='l_side'>
<%- partial('_partial/side') %>
</aside>
<script>setLoadingBarProgress(60);</script>
</div>
<a class="s-top fas fa-arrow-up fa-fw" href='javascript:void(0)'></a>
</div>
<%- partial('_partial/footer', null, {cache: !config.relative_link}) %>
<script>setLoadingBarProgress(80);</script>
<%- partial('_partial/scripts') %>
<script>setLoadingBarProgress(100);</script>
<div class="l_body">
<div class='container clearfix'>
<%- body %>
<script>setLoadingBarProgress(60);</script>
</div>
<a class="s-top fas fa-arrow-up fa-fw" href='javascript:void(0)'></a>
</div>
<%- partial('_partial/scripts') %>
<script>setLoadingBarProgress(100);</script>
</body>
</html>

@ -1,47 +1,53 @@
<article id="<%= page.layout %>" class="post white-box article-type-<%= page.layout %>" itemscope itemprop="blogPost">
<%- partial('_partial/meta',{post:page}) %>
<section class="article typo l_friends">
<% if (page.links){ %>
<% (page.links||[]).forEach(function(group){ %>
<% if(group.items) { %>
<div class='friends-group'>
<% if(group.group) { %>
<h2 class='friend-header'>
<% if (group.icon) { %>
<i class="<%= group.icon %> fa-fw" aria-hidden="true"></i>
<%} %>
<%= group.group %>
</h2>
<%} %>
<div class='friend-content'>
<% (group.items||[]).forEach(function(item){ %>
<a class='friend-card' style='background:<%- item.backgroundColor %>; color:<%- item.textColor %>'
target="_blank" rel="external nofollow noopener noreferrer" href='<%- url_for(item.url) %>'>
<div class='friend-left'>
<img class='avatar' src='<%- theme.loading_img %>' data-echo='<%- url_for(item.avatar ? item.avatar : "https://img.vim-cn.com/a4/87a96e2e01b1180bba1e76e190df5220378c1a.png") %>'/>
</div>
<div class='friend-right'>
<p class="friend-name"><%- item.name %></p>
<% if(item.tags){ %>
<div class='friend-tags-wrapper'>
<% (item.tags||[]).forEach(function(tag){ %>
<p class="tags"><i class="fas fa-hashtag fa-fw" aria-hidden="true"></i><%= tag %></p>
<% }) %>
</div>
<% } %>
</div>
</a>
<% }) %>
<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %>
<div class='l_main'>
<article id="<%= page.layout %>" class="post white-box article-type-<%= page.layout %>" itemscope itemprop="blogPost">
<%- partial('_partial/meta',{post:page}) %>
<section class="article typo l_friends">
<% if (page.links){ %>
<% (page.links||[]).forEach(function(group){ %>
<% if(group.items) { %>
<div class='friends-group'>
<% if(group.group) { %>
<h2 class='friend-header'>
<% if (group.icon) { %>
<i class="<%= group.icon %> fa-fw" aria-hidden="true"></i>
<%} %>
<%= group.group %>
</h2>
<%} %>
<div class='friend-content'>
<% (group.items||[]).forEach(function(item){ %>
<a class='friend-card' style='background:<%- item.backgroundColor %>; color:<%- item.textColor %>'
target="_blank" rel="external nofollow noopener noreferrer" href='<%- url_for(item.url) %>'>
<div class='friend-left'>
<img class='avatar' src='<%- theme.loading_img %>' data-echo='<%- url_for(item.avatar ? item.avatar : "https://img.vim-cn.com/a4/87a96e2e01b1180bba1e76e190df5220378c1a.png") %>'/>
</div>
<div class='friend-right'>
<p class="friend-name"><%- item.name %></p>
<% if(item.tags){ %>
<div class='friend-tags-wrapper'>
<% (item.tags||[]).forEach(function(tag){ %>
<p class="tags"><i class="fas fa-hashtag fa-fw" aria-hidden="true"></i><%= tag %></p>
<% }) %>
</div>
<% } %>
</div>
</a>
<% }) %>
</div>
</div>
</div>
<%} %>
<% }) %>
<% } %>
<br><hr>
<%- page.content %>
</section>
</article>
<%} %>
<% }) %>
<% } %>
<br><hr>
<%- page.content %>
</section>
</article>
<br>
<br>
<%- partial('_third-party/comments') %>
<%- partial('_third-party/comments') %>
</div>
<%- partial('_partial/side') %>
<%- partial('_partial/footer', null, {cache: !config.relative_link}) %>

@ -1 +1,6 @@
<%- partial('_partial/article', {post: page, index: false}) %>
<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %>
<div class='l_main'>
<%- partial('_partial/article', {post: page, index: false}) %>
</div>
<%- partial('_partial/side') %>
<%- partial('_partial/footer', null, {cache: !config.relative_link}) %>

@ -1 +1,6 @@
<%- partial('_partial/article', {post: page, index: false}) %>
<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %>
<div class='l_main'>
<%- partial('_partial/article', {post: page, index: false}) %>
</div>
<%- partial('_partial/side') %>
<%- partial('_partial/footer', null, {cache: !config.relative_link}) %>

@ -1 +1,6 @@
<%- partial('_partial/archive') %>
<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %>
<div class='l_main'>
<%- partial('_partial/archive') %>
</div>
<%- partial('_partial/side') %>
<%- partial('_partial/footer', null, {cache: !config.relative_link}) %>

@ -43,6 +43,167 @@ body {
}
}
.home-cover{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
// background: white;
display: flex;
flex-wrap: wrap;
flex-direction: column;
margin-bottom: 2*@gap;
align-items: center;
align-self: center;
align-content: center;
padding: @gap;
.title{
font-size: @fontsize_h1*2;
margin-top: 25vh;
align-self: center;
}
.m_search{
margin-top: 10vh;
position: relative;
height: @height_navbar - @gap;
width: 1.2*@width_sidebar;
@media(max-width: @on_laptop){
width: 1.2*@width_sidebar_m;
}
line-height: @height_navbar - @gap;
vertical-align: middle;
.form {
position: relative;
display: block;
width: 100%;
}
.icon,.input{
.enable-trans(.1s);
}
.icon {
position: absolute;
display:block;
height: @height_navbar - @gap;
width: @height_navbar - @gap;
line-height: @height_navbar - @gap;
top: 0;
left: @gap/2;
font-size: @fontsize_base;
}
.input {
display:block;
font-size: @fontsize_base;
line-height: @height_navbar - @gap;
margin: 0;
width: 100%;
color: fade(@color_text_in_header, 60%);
padding-left: @fontsize_base + @gap - 2px;
@media(max-width: @on_phone){
padding-left: @fontsize_base + @gap - 2px;
}
height: @height_navbar - @gap;
line-height: @height_navbar - @gap;
font-family: @fontfamily_base;
border: none;
border-radius: @border_radius_searchbar;
background: fade(@theme_cardbg, 15%);
box-sizing: border-box;
-webkit-appearance: none;
box-shadow: none;
border: 1px dashed transparent;
.enable-trans();
~ .icon{
color: fade(@color_text_in_header, 60%);
}
.set-placeholder({color: fade(@color_text_in_header, 60%)});
&:hover{
border: 1px dashed fade(@color_text_in_header, 60%);
}
&:focus {
~ .icon{
color: @color_text_in_header;
}
color: @color_text_in_header;
border: 1px solid fade(@color_text_in_header, 60%);
// .set-placeholder({color: @black});
}
}
}
background: @theme_cardbg;
&, a{
color: @theme_main;
}
box-shadow: @boxshadow_card_normal; // 适合白色导航栏背景
.menu{
margin-top: 4vh;
ul {
display: flex;
flex-wrap: wrap;
align-items: center;
li {
display: flex;
flex-wrap: wrap;
align-items: center;
padding: 0;
height: auto;
}
}
ul > li > a{
font-size: @fontsize_small;
padding: 0 2px;
margin: 0 4px;
.enable-trans();
color: fade(@color_text_main, 70%);
border-bottom: @loading_height solid transparent;
&.current{
border-bottom: @loading_height solid fade(@theme_main, 80%);
}
&:hover{
color: @theme_main;
border-bottom: @loading_height solid @theme_main;
}
&:active,&.active{
color: @theme_main;
border-bottom: @loading_height solid @theme_main;
}
}
}
.switcher{
& > li{
a{
&:hover {
background: fade(@theme_main, 15%);
}
}
}
}
.m_search {
.input {
color: fade(@theme_main, 60%);
background: @theme_background;
~ .icon{
color: fade(@theme_main, 60%);
}
.set-placeholder({color: fade(@theme_main, 60%)});
&:hover{
border: 1px dashed fade(@theme_main, 60%);
}
&:focus {
~ .icon{
color: @theme_main;
}
color: @theme_main;
background: fade(@theme_main, 15%);
border: 1px solid fade(@theme_main, 60%);
}
}
}
}
.z-depth-nav {
box-shadow: 0 1px 2px 0px rgba(0, 0, 0, 0.24), 0 3px 6px 0px rgba(0, 0, 0, 0.1);
@ -197,12 +358,8 @@ img {
clear: both;
}
}
.container.clearfix{
display: flex;
@media(max-width: @on_pad) {
display: inherit;
}
}
.hidden {
text-indent: -9999px;
visibility: hidden;

@ -31,7 +31,12 @@
height: @height_navbar;
}
background: @color_bg_navbar;
&.hide{
transform: translateY(100px) scale(0);
}
&.show{
transform: translateY(0) scale(1);
}
&, a{
.txt-ellipsis;
height: @height_navbar;

@ -13,3 +13,317 @@
}
}
.l_side section{
z-index: 0;
&:extend(.z-depth-main);
background: @theme_cardbg;
margin-top: @gap;
font-family: @fontfamily_base;
font-size: @fontsize_base;
&:first-child{
margin-top: 0;
}
border-radius: @border_radius;
.enable-trans();
&:hover {
box-shadow: @boxshadow_card_raised;
}
&:active {
box-shadow: @boxshadow_card_normal;
}
width: @width_sidebar;
@media(max-width: @on_laptop) {
width: @width_sidebar_m;
}
@media(max-width: @on_pad) {
width: 100%;
}
@media(max-width: @on_phone) {
width: ~"calc(100% - 2 * @{gap})";
margin: @gap @gap 0 @gap;
}
max-height: ~"calc(100% - @{height_navbar} - 4 * @{gap})";
header{
display: flex;
justify-content: space-between;
border-top-left-radius: @border_radius;
border-top-right-radius: @border_radius;
background-color: @color_bg_navbar;
color: @color_text_in_header;
font-weight: bold;
line-height: 1.5em;
padding: 8px @gap;
.rightBtn{
color: @color_text_in_header;
&:hover {
color: darken(@color_text_highlight, 25%);
&.rotate90{
transform: rotate(90deg);
}
}
}
&.pure{
background-color: @theme_cardbg;
color: @theme_main;
padding-top: 14px; // 适合白色导航栏背景
padding-bottom: 14px; // 适合白色导航栏背景
.rightBtn{
color: @theme_main;
&:hover {
color: darken(@color_text_highlight, 25%);
}
}
}
}
.content{
text-align: justify;
padding: @gap/2;
max-height: ~"calc(100% - @{height_navbar} - 12.5 * @{gap})";
ul > li{
a{
color: fade(@color_text_main, 80%);
padding: 0 @gap;
line-height: @height_cell;
display: flex;
justify-content: space-between;
align-content: center;
border-left: 2px solid transparent;
.enable-trans();
.name{
flex:auto;
&:extend(.txt-ellipsis);
color: fade(@color_text_main, 80%);
}
.badge{
flex:none;
font-weight: normal;
font-size: @fontsize_small;
color: fade(@color_text_main, 70%);
}
&:hover{
border-left: 4px solid @theme_main;
background: fade(@theme_main, 10%);
}
&:active{
border-left: 8px solid @theme_main;
}
&.child{
padding-left: @gap*2;
}
}
}
}
&.author{
.enable-trans();
.content{
padding: 0;
div.avatar{
display: flex;
justify-content: center;
}
img{
padding: 0;
margin: 0;
display: flex;
justify-content: center;
width: @width_sidebar;
height: @width_sidebar;
border-top-left-radius: @border_radius;
border-top-right-radius: @border_radius;
@media(max-width: @on_laptop) {
width: @width_sidebar_m;
height: @width_sidebar_m;
}
@media(max-width: @on_pad){
width: 96px;
height: 96px;
border-radius: 100%;
margin-top: @gap/2;
padding: @gap/2;
}
}
h2{
text-align: center;
font-weight: bold;
margin: @gap/2;
@media(max-width: @on_pad){
margin: @gap/2;
}
}
p{
font-size: @fontsize_base;
font-weight: bold;
text-align: center;
margin: @gap/2 @gap/2 0 @gap/2;
empty-cells: hide;
}
.social-wrapper{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
padding: 4px @gap/2;
a{
color: fade(@color_text_main, 70%);
.enable-trans();
&:hover{
color: @color_text_highlight;
}
&.social {
display: flex;
justify-content: center;
align-items: center;
width: 32px;
height: 32px;
margin: 4px;
border-radius: 100px;
&:hover {
background: fade(@theme_main, 10%);
color: @theme_main;
}
}
}
@media(max-width: @on_pad){
justify-content: center;
}
}
}
@media(max-width: @on_pad){
box-shadow: none;
background: @theme_background;
margin-top: 2*@gap;
}
}
&.plain{
.content{
font-size: @fontsize_small;
font-weight: bold;
word-break: break-all;
padding: @gap/2 @gap;
line-height: @fontsize_small + 8px;
&.pure{
padding: 0 @gap @gap @gap; // 适合白色导航栏背景
}
a{
color: @color_text_link;
.enable-trans();
&:hover {
color: @color_text_highlight;
text-decoration: underline;
}
&:active {
color: darken(@color_text_highlight, 25%);
}
}
}
}
&.list{
.content{
padding: @gap/2 0;
&.pure{
padding-top: 0; // 适合白色导航栏背景
}
a{
font-size: @fontsize_small;
font-weight: bold;
&:hover{
text-decoration: none;
}
i{
color: fade(@color_text_main,70%);
line-height: @height_cell;
margin-right: 3px;
}
img{
display: inline;
vertical-align: middle;
height: 18px;
width: 18px;
margin-bottom: 4px;
&#round{
border-radius: 100%;
}
}
}
}
}
&.category{
.content{
padding: @gap/2 0;
font-size: @fontsize_small;
font-weight: bold;
&.pure{
padding-top: 0; // 适合白色导航栏背景
}
}
}
&.tagcloud{
.content{
text-align: justify;
padding: @gap/2 @gap;
&.pure{
padding: 0 @gap @gap @gap; // 适合白色导航栏背景
}
a{
display:inline-block;
.enable-trans(.1s);
line-height: 1.6em;
&:hover{
color: @color_text_highlight !important; //to cover inline style.
text-decoration: underline
}
}
}
}
&.music{
header{
&.pure{
padding-bottom: @gap/4; // 适合白色导航栏背景
}
}
.content{
padding: @gap/2+4px;
padding-top: @gap/2;
&.pure{
padding-top: @gap/4; // 适合白色导航栏背景
}
.aplayer{
border-radius: 4px;
color: #666;
font-family: @fontfamily_base;
}
}
}
&.related_posts{
.content{
padding: @gap/2 0;
font-size: @fontsize_small;
font-weight: bold;
&.pure{
padding-top: 0; // 适合白色导航栏背景
}
h3{
font-size: @fontsize_small;
font-weight: bold;
margin: 0;
a{
// line-height: @fontsize_small*1.7;
line-height: inherit;
padding-top: 4px;
padding-bottom: 4px;
}
}
}
}
}

@ -1,313 +0,0 @@
.l_side section{
z-index: 0;
&:extend(.z-depth-main);
background: @theme_cardbg;
margin-top: @gap;
font-family: @fontfamily_base;
font-size: @fontsize_base;
&:first-child{
margin-top: 0;
}
border-radius: @border_radius;
.enable-trans();
&:hover {
box-shadow: @boxshadow_card_raised;
}
&:active {
box-shadow: @boxshadow_card_normal;
}
width: @width_sidebar;
@media(max-width: @on_laptop) {
width: @width_sidebar_m;
}
@media(max-width: @on_pad) {
width: 100%;
}
@media(max-width: @on_phone) {
width: ~"calc(100% - 2 * @{gap})";
margin: @gap @gap 0 @gap;
}
max-height: ~"calc(100% - @{height_navbar} - 4 * @{gap})";
header{
display: flex;
justify-content: space-between;
border-top-left-radius: @border_radius;
border-top-right-radius: @border_radius;
background-color: @color_bg_navbar;
color: @color_text_in_header;
font-weight: bold;
line-height: 1.5em;
padding: 8px @gap;
.rightBtn{
color: @color_text_in_header;
&:hover {
color: darken(@color_text_highlight, 25%);
&.rotate90{
transform: rotate(90deg);
}
}
}
&.pure{
background-color: @theme_cardbg;
color: @theme_main;
padding-top: 14px; // 适合白色导航栏背景
padding-bottom: 14px; // 适合白色导航栏背景
.rightBtn{
color: @theme_main;
&:hover {
color: darken(@color_text_highlight, 25%);
}
}
}
}
.content{
text-align: justify;
padding: @gap/2;
max-height: ~"calc(100% - @{height_navbar} - 12.5 * @{gap})";
ul > li{
a{
color: fade(@color_text_main, 80%);
padding: 0 @gap;
line-height: @height_cell;
display: flex;
justify-content: space-between;
align-content: center;
border-left: 2px solid transparent;
.enable-trans();
.name{
flex:auto;
&:extend(.txt-ellipsis);
color: fade(@color_text_main, 80%);
}
.badge{
flex:none;
font-weight: normal;
font-size: @fontsize_small;
color: fade(@color_text_main, 70%);
}
&:hover{
border-left: 4px solid @theme_main;
background: fade(@theme_main, 10%);
}
&:active{
border-left: 8px solid @theme_main;
}
&.child{
padding-left: @gap*2;
}
}
}
}
&.author{
.enable-trans();
.content{
padding: 0;
div.avatar{
display: flex;
justify-content: center;
}
img{
padding: 0;
margin: 0;
display: flex;
justify-content: center;
width: @width_sidebar;
height: @width_sidebar;
border-top-left-radius: @border_radius;
border-top-right-radius: @border_radius;
@media(max-width: @on_laptop) {
width: @width_sidebar_m;
height: @width_sidebar_m;
}
@media(max-width: @on_pad){
width: 96px;
height: 96px;
border-radius: 100%;
margin-top: @gap/2;
padding: @gap/2;
}
}
h2{
text-align: center;
font-weight: bold;
margin: @gap/2;
@media(max-width: @on_pad){
margin: @gap/2;
}
}
p{
font-size: @fontsize_base;
font-weight: bold;
text-align: center;
margin: @gap/2 @gap/2 0 @gap/2;
empty-cells: hide;
}
.social-wrapper{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
padding: 4px @gap/2;
a{
color: fade(@color_text_main, 70%);
.enable-trans();
&:hover{
color: @color_text_highlight;
}
&.social {
display: flex;
justify-content: center;
align-items: center;
width: 32px;
height: 32px;
margin: 4px;
border-radius: 100px;
&:hover {
background: fade(@theme_main, 10%);
color: @theme_main;
}
}
}
@media(max-width: @on_pad){
justify-content: center;
}
}
}
@media(max-width: @on_pad){
box-shadow: none;
background: @theme_background;
margin-top: 2*@gap;
}
}
&.plain{
.content{
font-size: @fontsize_small;
font-weight: bold;
word-break: break-all;
padding: @gap/2 @gap;
line-height: @fontsize_small + 8px;
&.pure{
padding: 0 @gap @gap @gap; // 适合白色导航栏背景
}
a{
color: @color_text_link;
.enable-trans();
&:hover {
color: @color_text_highlight;
text-decoration: underline;
}
&:active {
color: darken(@color_text_highlight, 25%);
}
}
}
}
&.list{
.content{
padding: @gap/2 0;
&.pure{
padding-top: 0; // 适合白色导航栏背景
}
a{
font-size: @fontsize_small;
font-weight: bold;
&:hover{
text-decoration: none;
}
i{
color: fade(@color_text_main,70%);
line-height: @height_cell;
margin-right: 3px;
}
img{
display: inline;
vertical-align: middle;
height: 18px;
width: 18px;
margin-bottom: 4px;
&#round{
border-radius: 100%;
}
}
}
}
}
&.category{
.content{
padding: @gap/2 0;
font-size: @fontsize_small;
font-weight: bold;
&.pure{
padding-top: 0; // 适合白色导航栏背景
}
}
}
&.tagcloud{
.content{
text-align: justify;
padding: @gap/2 @gap;
&.pure{
padding: 0 @gap @gap @gap; // 适合白色导航栏背景
}
a{
display:inline-block;
.enable-trans(.1s);
line-height: 1.6em;
&:hover{
color: @color_text_highlight !important; //to cover inline style.
text-decoration: underline
}
}
}
}
&.music{
header{
&.pure{
padding-bottom: @gap/4; // 适合白色导航栏背景
}
}
.content{
padding: @gap/2+4px;
padding-top: @gap/2;
&.pure{
padding-top: @gap/4; // 适合白色导航栏背景
}
.aplayer{
border-radius: 4px;
color: #666;
font-family: @fontfamily_base;
}
}
}
&.related_posts{
.content{
padding: @gap/2 0;
font-size: @fontsize_small;
font-weight: bold;
&.pure{
padding-top: 0; // 适合白色导航栏背景
}
h3{
font-size: @fontsize_small;
font-weight: bold;
margin: 0;
a{
// line-height: @fontsize_small*1.7;
line-height: inherit;
padding-top: 4px;
padding-bottom: 4px;
}
}
}
}
}

@ -7,7 +7,6 @@
@import "less/_main.less";
@import "less/_side.less";
@import "less/_toc.less";
@import "less/_widget.less";
@import "less/_archive.less";
@import "less/_article.less";
@import "less/_pagination.less";

Loading…
Cancel
Save