lianglianglee
/
hexo-theme-keep
mirror of https://github.com/liangliangle/hexo-theme-keep.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

style: optimize article copyright info

This commit is contained in:
XPoet 2020-11-19 15:14:53 +08:00
parent 84f2d20372
commit 3b46d456f7
3 changed files with 20 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
layout/_partial/article-copyright-info.ejs
View File

@ -7,7 +7,8 @@
<%- __('copyright.link') %>：<%= getPostUrl((theme.base_info.url || config.url), page.path) %> <%- __('copyright.link') %>：<%= getPostUrl((theme.base_info.url || config.url), page.path) %>
</li> </li>
<li> <li>
<%- __('copyright.license_title') %>：<%- __('copyright.license_content', '<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh">BY-NC-SA</a>') %> <%- __('copyright.license_title') %>：
<%- __('copyright.license_content', '<a class="license" href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh">BY-NC-SA</a>') %>
</li> </li>
</ul> </ul>
</div> </div>

18
source/css/layout/_partial/article-copyright-info.styl
View File

@ -3,27 +3,35 @@
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
background: var(--second-background-color); background: var(--second-background-color);
padding: 6px 6px 6px 16px; //border: 1px solid var(--border-color);
font-size: 0.98em; //border-left: none;
padding: 10px 6px;
font-size: 1em;
&::after { &::after {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
content: ''; content: '';
width: 6px; width: 8px;
height: 100%; height: 100%;
background: #dd0c0c; background: var(--copyright-info-color);
} }
ul { ul {
margin-left: 10px;
li { li {
margin-bottom: 3px; margin-bottom: 5px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
.license {
font-weight: bold;
}
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 0;
} }

7
source/css/layout/common/variables.styl
View File

@ -66,11 +66,12 @@ $shadow-hover-color = rgba(0, 0, 0, 0.28);
$scroll-bar-color = lighten($default-text-color, 20%); $scroll-bar-color = lighten($default-text-color, 20%);
$scroll-bar-bg-color = darken($background-color, 10%); $scroll-bar-bg-color = darken($background-color, 10%);
$link-color = darken($default-text-color, 10%); $link-color = darken($default-text-color, 10%);
$copyright-info-color = #CC0033;
// ====================== dark mode color ====================== // ====================== dark mode color ======================
$dark-primary-color = $primary-color; $dark-primary-color = $primary-color;
$dark-background-color = #2f2f2f; $dark-background-color = #363636;
$dark-second-background-color = darken($dark-background-color, 3%); $dark-second-background-color = darken($dark-background-color, 10%);
$dark-default-text-color = #b9b5c2; $dark-default-text-color = #b9b5c2;
$dark-first-text-color = lighten($dark-default-text-color, 30%); $dark-first-text-color = lighten($dark-default-text-color, 30%);
$dark-second-text-color = lighten($dark-default-text-color, 20%); $dark-second-text-color = lighten($dark-default-text-color, 20%);
@ -83,6 +84,7 @@ $dark-shadow-hover-color = rgba(128, 128, 128, 0.28);
$dark-scroll-bar-color = darken($dark-default-text-color, 30%); $dark-scroll-bar-color = darken($dark-default-text-color, 30%);
$dark-scroll-bar-bg-color = lighten($dark-background-color, 10%); $dark-scroll-bar-bg-color = lighten($dark-background-color, 10%);
$dark-link-color = lighten($dark-default-text-color, 10%); $dark-link-color = lighten($dark-default-text-color, 10%);
$dark-copyright-info-color = darken($copyright-info-color, 20%);
// ======================================================================== // ========================================================================
// font // font
@ -112,6 +114,7 @@ root-color(mode) {
--scroll-bar-color: mode == 'light' ? $scroll-bar-color : $dark-scroll-bar-color; --scroll-bar-color: mode == 'light' ? $scroll-bar-color : $dark-scroll-bar-color;
--scroll-bar-bg-color: mode == 'light' ? $scroll-bar-bg-color : $dark-scroll-bar-bg-color; --scroll-bar-bg-color: mode == 'light' ? $scroll-bar-bg-color : $dark-scroll-bar-bg-color;
--link-color: mode == 'light' ? $link-color : $dark-link-color; --link-color: mode == 'light' ? $link-color : $dark-link-color;
--copyright-info-color: mode == 'light' ? $copyright-info-color : $dark-copyright-info-color;
} }