i18n
xaoxuu 5 years ago
parent fb9c67dfae
commit 408c00be7c
  1. 2
      _config.yml
  2. 1
      layout/_partial/header.ejs
  3. 26
      layout/_partial/side.ejs
  4. 97
      layout/archive.ejs
  5. 6
      layout/category.ejs
  6. 6
      layout/index.ejs
  7. 29
      layout/layout.ejs
  8. 93
      layout/links.ejs
  9. 6
      layout/page.ejs
  10. 6
      layout/post.ejs
  11. 6
      layout/tag.ejs
  12. 314
      source/less/_side.less
  13. 313
      source/less/_widget.less
  14. 1
      source/style.less

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

@ -69,3 +69,4 @@
</nav>
</header>
</aside>
<script>setLoadingBarProgress(40);</script>

@ -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,55 @@
<% 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') %>
<!-- 根据主题中的设置决定是否在archive中针对摘要部分的MathJax公式加载mathjax.js文件 -->
<%

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

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

@ -2,23 +2,16 @@
<html>
<%- partial('_partial/head') %>
<body>
<%- 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/footer', null, {cache: !config.relative_link}) %>
<script>setLoadingBarProgress(80);</script>
<%- partial('_partial/scripts') %>
<script>setLoadingBarProgress(100);</script>
</body>
</html>

@ -1,47 +1,52 @@
<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') %>

@ -1 +1,5 @@
<%- 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') %>

@ -1 +1,5 @@
<%- 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') %>

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

@ -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