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

View File

@ -7,7 +7,8 @@
<%- __('copyright.link') %><%= getPostUrl((theme.base_info.url || config.url), page.path) %>
</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>
</ul>
</div>

View File

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

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-bg-color = darken($background-color, 10%);
$link-color = darken($default-text-color, 10%);
$copyright-info-color = #CC0033;
// ====================== dark mode color ======================
$dark-primary-color = $primary-color;
$dark-background-color = #2f2f2f;
$dark-second-background-color = darken($dark-background-color, 3%);
$dark-background-color = #363636;
$dark-second-background-color = darken($dark-background-color, 10%);
$dark-default-text-color = #b9b5c2;
$dark-first-text-color = lighten($dark-default-text-color, 30%);
$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-bg-color = lighten($dark-background-color, 10%);
$dark-link-color = lighten($dark-default-text-color, 10%);
$dark-copyright-info-color = darken($copyright-info-color, 20%);
// ========================================================================
// font
@ -112,6 +114,7 @@ root-color(mode) {
--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;
--link-color: mode == 'light' ? $link-color : $dark-link-color;
--copyright-info-color: mode == 'light' ? $copyright-info-color : $dark-copyright-info-color;
}