iotcat
/
hexo-theme-volantis
mirror of https://github.com/IoTcat/hexo-theme-volantis.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

update css

Browse Source
i18n
xaoxuu 6 years ago
parent 7edff0921f
commit f5ac2ec123
10 changed files with 93 additions and 45 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 25
      layout/_partial/article.ejs
  2. 6
      source/less/_archive.less
  3. 15
      source/less/_article.less
  4. 2
      source/less/_base.less
  5. 8
      source/less/_defines.less
  6. 6
      source/less/_footer.less
  7. 9
      source/less/_main.less
  8. 4
      source/less/_search.less
  9. 59
      source/less/_toc.less
  10. 4
      source/less/_widget.less

25
layout/_partial/article.ejs
Unescape View File

@ -1,22 +1,25 @@
<article id="<%= post.layout %>-<%= post.slug %>" class="post white-box article-type-<%= post.layout %>" itemscope itemprop="blogPost"> <article id="<%= post.layout %>-<%= post.slug %>" class="post white-box article-type-<%= post.layout %>" itemscope itemprop="blogPost">
<section class='meta'> <section class='meta'>
<h2 class="title"> <h1 class="title">
<a href="<%- url_for(post.path) %>"> <% if(post.title){ %>
<% if(post.title){ %> <%= post.title %>
<%= post.title %> <% } else if (post.date) { %>
<% } else if (post.date) { %> <%= date(post.date, 'YYYY-MM-DD dddd') %>
<%= date(post.date, 'YYYY-MM-DD dddd') %> <% } %>
<% } %> </h1>
</a>
</h2>
<time> <time>
<%= date(post.date, 'YYYY-MM-DD dddd') %>&nbsp;&nbsp; <%= date(post.date, 'YYYY-MM-DD dddd') %>&nbsp;&nbsp;
<i class="fa fa-eye" aria-hidden="true"></i>&nbsp;<span id="busuanzi_value_page_pv"><i class="fa fa-spinner fa-spin fa-fw" aria-hidden="true"></i></span> <i class="fa fa-eye" aria-hidden="true"></i>&nbsp;<span id="busuanzi_value_page_pv"><i class="fa fa-spinner fa-spin fa-fw" aria-hidden="true"></i></span>
</time> </time>
<%- partial('categories',{post:post}) %> <%- partial('categories',{post:post}) %>
</section> </section>
<% if(post.toc!==false){ %> <% if(post.toc!==false && toc(post.content).length > 0){ %>
<section class="toc-wrapper"><%- toc(post.content, {list_number: false}) %></section> <section class="toc-wrapper">
<div class="header"><i class="fa fa-list" aria-hidden="true"></i>&nbsp;&nbsp;目录</div>
<div class='content'>
<%- toc(post.content, {list_number: true}) %>
</div>
</section>
<% } %> <% } %>
<section class="article typo"> <section class="article typo">

6
source/less/_archive.less
Unescape View File

@ -14,7 +14,7 @@
margin-top: 1em; margin-top: 1em;
} }
a { a {
color: @text-color; color: @theme-text-main;
text-decoration: none; text-decoration: none;
} }
} }
@ -28,7 +28,7 @@
text-decoration: none; text-decoration: none;
} }
time { time {
color: @text-color; color: @theme-text-main;
flex: none; flex: none;
font-size: @small-font-size; font-size: @small-font-size;
padding: .5em .5em .5em 3em; padding: .5em .5em .5em 3em;
@ -40,7 +40,7 @@
flex: auto; flex: auto;
padding: .5em; padding: .5em;
font-size: @small-font-size; font-size: @small-font-size;
color: fade(@text-color,80%); color: fade(@theme-text-main,80%);
} }
} }
} }

15
source/less/_article.less
Unescape View File

@ -1,5 +1,5 @@
.article { .article {
color: @text-color; color: fade(@theme-text-main,75%);
font-size: @base-font-size; font-size: @base-font-size;
line-height: @base-line-height; line-height: @base-line-height;
word-break: break-all; word-break: break-all;
@ -41,12 +41,11 @@
} }
p { p {
// margin: 20px 0px; // margin: 20px 0px;
color: fade(@text-color,75%);
margin-top: .5em; margin-top: .5em;
margin-bottom: 1em; margin-bottom: 1em;
text-align: justify; text-align: justify;
strong{ strong{
color: @text-color; color: @theme-text-main;
padding-left: 2px; padding-left: 2px;
padding-right: 2px; padding-right: 2px;
} }
@ -120,7 +119,7 @@
} }
h3 { h3 {
font-size: @font-size-h3; font-size: @font-size-h3;
color: @text-color-darken; color: darken(@theme-text-main, 20%);
} }
h4 { h4 {
font-weight: bold; font-weight: bold;
@ -128,14 +127,14 @@
} }
h5 { h5 {
font-weight: bold; font-weight: bold;
color: @text-color; color: @theme-text-main;
// color: fade(@text-color, 60%); // color: fade(@theme-text-main, 60%);
font-size: @font-size-h5; font-size: @font-size-h5;
} }
h6 { h6 {
color: fade(@text-color, 75%); color: fade(@theme-text-main, 75%);
font-size: @font-size-h6; font-size: @font-size-h6;
} }
@ -170,7 +169,7 @@
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
font-family: @code-font-family; font-family: @code-font-family;
color: fade(@text-color, 75%); color: fade(@theme-text-main, 75%);
} }
code { code {
font-family: @code-font-family; font-family: @code-font-family;

2
source/less/_base.less
Unescape View File

@ -17,7 +17,7 @@ html {
font-family: @base-font-family; font-family: @base-font-family;
font-size: @base-font-size; font-size: @base-font-size;
line-height: 1.5rem; line-height: 1.5rem;
color: @text-color; color: @theme-text-main;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%; -ms-text-size-adjust: 100%;

8
source/less/_defines.less
Unescape View File

@ -57,16 +57,18 @@
@white: #ffffff; @white: #ffffff;
@dark: #555555; @dark: #555555;
@text-color: fade(@black, 85%); @text-color: fade(@black, 85%);
@text-color-darken: darken(@text-color, 20%);
// 自定义主题色 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> // 自定义主题色 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
// 网页背景 // 网页背景
@theme-bg-main: #EFEFEF; @theme-bg-main: #EFEFEF;
// 导航栏背景 // @theme-bg-main: #444;
// 导航栏背景（主题色）
@theme-bg-header: @xiaowenwen-green; @theme-bg-header: @xiaowenwen-green;
// 卡片背景 // 卡片背景
@theme-bg-card: #FFF; @theme-bg-card: #FFF;
// @theme-bg-card: lighten(@theme-bg-main, 10%);
// 代码块的背景色 // 代码块的背景色
@theme-bg-code: #EFEFEF; @theme-bg-code: #EFEFEF;
// 引用的颜色 和 分类、归档的 hover 时颜色 // 引用的颜色 和 分类、归档的 hover 时颜色
@ -79,6 +81,8 @@
@theme-text-highlight: @material-orange; @theme-text-highlight: @material-orange;
// 在主题色中显示的文本（白或深灰） // 在主题色中显示的文本（白或深灰）
@theme-text-in-header: white; @theme-text-in-header: white;
@theme-text-main: @text-color;
// @theme-text-main: white;
// 自定义主题色 <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< // 自定义主题色 <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

6
source/less/_footer.less
Unescape View File

@ -2,14 +2,14 @@
position: relative; position: relative;
padding: 40px 10px; padding: 40px 10px;
width: 100%; width: 100%;
color: fade(@text-color, 50%); color: fade(@theme-text-main, 50%);
margin: 0px auto; margin: 0px auto;
font-size: @small-font-size; font-size: @small-font-size;
overflow: hidden; overflow: hidden;
text-align: center; text-align: center;
font-family: @title-font-family; font-family: @title-font-family;
.licenses { .licenses {
color: fade(@text-color, 50%); color: fade(@theme-text-main, 50%);
text-decoration: underline; text-decoration: underline;
} }
.codename { .codename {
@ -20,7 +20,7 @@
padding-top: 20px; padding-top: 20px;
} }
a { a {
color: fade(@text-color, 70%); color: fade(@theme-text-main, 70%);
.enable-trans(); .enable-trans();
&:hover { &:hover {
color: @theme-text-highlight; color: @theme-text-highlight;

9
source/less/_main.less
Unescape View File

@ -98,13 +98,18 @@
@media(max-width: @on-phone) { @media(max-width: @on-phone) {
border-radius: 0; border-radius: 0;
} }
h1{
font-weight: normal;
font-size: @article-title-size;
line-height: @base-line-height;
color: @theme-text-main;
}
&:extend(.z-depth-main); &:extend(.z-depth-main);
.enable-trans(); .enable-trans();
&:hover { &:hover {
&:extend(.z-depth-main-raised); &:extend(.z-depth-main-raised);
} }
&:active { &:active {
// box-shadow: 0 1.5px 3px 0 rgba(0, 0, 0, 0.12), 0 2px 4px 0 rgba(0, 0, 0, 0.08);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.12), 0 2px 4px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.12), 0 2px 4px 0 rgba(0, 0, 0, 0.08);
} }
.meta { .meta {
@ -122,7 +127,7 @@
display: inline; display: inline;
line-height: @base-line-height; line-height: @base-line-height;
font-weight: normal; font-weight: normal;
color: @text-color; color: @theme-text-main;
text-decoration: none; text-decoration: none;
font-size: @article-title-size; font-size: @article-title-size;
@media(max-width: @on-phone) { @media(max-width: @on-phone) {

4
source/less/_search.less
Unescape View File

@ -261,7 +261,7 @@
.title { .title {
display: inline-block; display: inline-block;
max-width: 100%; max-width: 100%;
color: lighten(@text-color, 10%); color: lighten(@theme-text-main, 10%);
font-size: @base-font-size; font-size: @base-font-size;
font-weight: bold; font-weight: bold;
padding: 1px; padding: 1px;
@ -278,7 +278,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
font-size: @small-font-size; font-size: @small-font-size;
line-height: @base-line-height; line-height: @base-line-height;
color: lighten(@text-color, 30%); color: lighten(@theme-text-main, 30%);
.enable-trans(); .enable-trans();
em { em {
// font-weight: bold; // font-weight: bold;

59
source/less/_toc.less
Unescape View File

@ -13,8 +13,7 @@
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.12), 0 2px 4px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.12), 0 2px 4px 0 rgba(0, 0, 0, 0.08);
} }
overflow: auto; max-height: ~"calc(100% - @{header-height} - 4 * @{gap})";
max-height: ~"calc(100% - @{header-height} - 2 * @{gap})";
@media(max-width: @container-width){ @media(max-width: @container-width){
right: 0; right: 0;
margin-right:0; margin-right:0;
@ -29,15 +28,32 @@
transform: translateX(-@side-width - 10px); transform: translateX(-@side-width - 10px);
} }
} }
.header{
border-top-left-radius: @border-radius-width;
border-top-right-radius: @border-radius-width;
@media(max-width: @on-phone) {
border-radius: 0;
}
background-color: fade(@theme-bg-header,90%);
color: @theme-text-in-header;
font-size: @base-font-size;
line-height: 1.8em;
padding: 8px @gap;
}
overflow: auto;
.content{
overflow: auto;
padding: @gap/2 0;
max-height: ~"calc(100% - @{header-height} + 0.5 * @{gap})";
}
width: @side-width; width: @side-width;
z-index:3; z-index:3;
&:extend(.z-depth-2); &:extend(.z-depth-2);
padding: @gap 0; background: @theme-bg-card;
background: white;
a { a {
padding-left: 8px; padding-left: 8px;
color: fade(@text-color, 60%); color: @theme-text-main;
font-size: @small-font-size; font-size: @small-font-size;
display: inline-block; display: inline-block;
border-left: 2px solid transparent; border-left: 2px solid transparent;
@ -51,18 +67,39 @@
} }
} }
ol{ ol{
.toc-item.toc-level-1 {
.toc-child a{
padding-left: 1*@gap;
font-weight: normal;
}
}
.toc-item.toc-level-2 {
.toc-child a{
padding-left: 2*@gap;
font-weight: normal;
}
}
.toc-item.toc-level-3 {
.toc-child a{
padding-left: 3*@gap;
font-weight: normal;
}
}
.toc-item.toc-level-4 {
.toc-child a{
padding-left: 4*@gap;
font-weight: normal;
}
}
li{ li{
a{ a{
padding-left: @gap; padding-left: 1*@gap;
font-weight: bold;
width: 100%; width: 100%;
} }
list-style: none; list-style: none;
width: auto; width: auto;
&:extend(.txt-ellipsis); // &:extend(.txt-ellipsis);
}
&.toc-child a{
padding-left: 2*@gap;
width: 100%;
} }
} }
&:empty{ &:empty{

4
source/less/_widget.less
Unescape View File

@ -43,12 +43,12 @@
.name{ .name{
flex:auto; flex:auto;
&:extend(.txt-ellipsis); &:extend(.txt-ellipsis);
color: fade(@text-color,70%); color: fade(@theme-text-main,70%);
} }
.badge{ .badge{
flex:none; flex:none;
font-size: @small-font-size; font-size: @small-font-size;
color: fade(@text-color, 50%); color: fade(@theme-text-main, 50%);
} }
&:hover{ &:hover{
border-left: 4px solid @theme-bg-quote; border-left: 4px solid @theme-bg-quote;

Write Preview
Loading…
Cancel
Save