mirror of https://github.com/IoTcat/ushio-img.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
843 lines
18 KiB
843 lines
18 KiB
@charset "UTF-8"; |
|
|
|
/* ---- |
|
|
|
# Single Theme |
|
# By: Dreamer-Paul |
|
# Last Update: 2019.3.2 |
|
|
|
一个简洁大气,含夜间模式的 Typecho 博客模板。 |
|
|
|
本代码为奇趣保罗原创,并遵守 MIT 开源协议。欢迎访问我的博客:https://paugram.com |
|
|
|
---- */ |
|
|
|
/* 0 - 全局 |
|
-------------------------------- */ |
|
body{ |
|
color: #555; |
|
background: #fafafa; |
|
font-weight: lighter; |
|
transition: margin .3s, background .3s; |
|
} |
|
|
|
body:before{ |
|
top: 0; |
|
left: 0; |
|
right: 0; |
|
bottom: 0; |
|
opacity: .1; |
|
z-index: -1; |
|
display: block; |
|
position: fixed; |
|
background: center/cover no-repeat; |
|
} |
|
|
|
::-webkit-scrollbar{ |
|
width: 8px; |
|
height: 8px; |
|
} |
|
::-webkit-scrollbar-thumb{ background: #6f9fc7 } |
|
::-webkit-scrollbar-thumb:hover{ background: #9fcff7 } |
|
|
|
body::-webkit-scrollbar{ |
|
border-left: 1px solid #eee; |
|
background: rgba(255, 255, 255, .6); |
|
} |
|
|
|
a{ color: #6f9fc7 } |
|
a:hover{ color: #9fcff7 } |
|
|
|
h1, h2, h3, h4, h5, h6{ font-weight: normal } |
|
|
|
hr{ border-color: #eee } |
|
|
|
em{ background: #6f9fc7 } |
|
|
|
.btn{ |
|
color: #fff; |
|
background: #6f9fc7; |
|
} |
|
.btn:hover{ |
|
color: #fff; |
|
background: #9fcff7; |
|
} |
|
|
|
pre code{ |
|
color: inherit; |
|
border: 1px solid #ddd; |
|
background: linear-gradient(rgba(18, 18, 18, .05) 50%, transparent 0); |
|
background-size: auto 3em; |
|
background-origin: content-box; |
|
} |
|
|
|
blockquote{ |
|
background: #ecf1f5; |
|
border-color: #6f9fc7; |
|
} |
|
|
|
input, textarea{ background: #fff } |
|
input, textarea, code, hr, blockquote{ |
|
transition: border .3s, background .3s; |
|
} |
|
|
|
.auto-border{ |
|
border-color: #ccc !important; |
|
transition: color .3s, border-color .3s; |
|
} |
|
|
|
body.neon .auto-border{ |
|
color: #aaa; |
|
border-color: #555 !important; |
|
} |
|
|
|
/* - 夜间风格 */ |
|
body.neon{ |
|
color: #999; |
|
background: #333; |
|
} |
|
|
|
body.neon::-webkit-scrollbar{ |
|
border-color: transparent; |
|
background: rgba(255, 255, 255, .2); |
|
} |
|
|
|
body.neon a{ color: #c9861d } |
|
body.neon a:hover{ color: #eb9c26 } |
|
|
|
body.neon img{ |
|
filter: brightness(60%); |
|
-webkit-filter: brightness(60%); |
|
} |
|
|
|
body.neon blockquote{ |
|
color: #c9861d; |
|
border-color: #eb9c26; |
|
background: rgba(255, 255, 255, .05); |
|
} |
|
|
|
/* -- 边框 */ |
|
body.neon header, body.neon .head-menu .sub-menu, body.neon main .article-list, |
|
body.neon .post-item h2 a, body.neon .post-title, body.neon .page-title, body.neon .post-author, |
|
body.neon tr, body.neon hr, body.neon pre code, body.neon input, body.neon textarea, body.neon .btn, body.neon .toggle-list, |
|
body.neon footer, body.neon .to-top{ border-color: #555 } |
|
|
|
/* -- 透明 */ |
|
body.neon iframe, body.neon em{ opacity: .6 } |
|
|
|
/* -- 颜色 */ |
|
body.neon .btn{ color: inherit } |
|
|
|
/* -- 背景 */ |
|
body.neon input, body.neon textarea, body.neon .btn, body.neon .to-top, body.neon .toggle-list{ background: #444 } |
|
|
|
/* -- 头部 */ |
|
body.neon header, body.neon .head-menu .sub-menu, body.neon .head-menu .sub-menu:before{ |
|
color: #aaa; |
|
background: #444; |
|
} |
|
body.neon .head-menu .sub-menu:before{ |
|
border-color: #555 #555 transparent transparent; |
|
} |
|
|
|
body.neon :not(pre) > code{ |
|
color: #ffa5a5; |
|
background: rgba(255, 255, 255, .2); |
|
} |
|
|
|
body.neon .head-search input{ |
|
background: #666; |
|
border-color: transparent; |
|
} |
|
body.neon .head-search input::-webkit-input-placeholder{ color: #bbb } |
|
|
|
body.neon header a{ color: #aaa } |
|
body.neon header a:hover{ color: #ddd } |
|
|
|
@media screen and (max-width: 600px){ |
|
body.neon .head-menu .sub-menu{ background: none } |
|
} |
|
|
|
/* 1 - 页眉 |
|
-------------------------------- */ |
|
header{ |
|
top: 0; |
|
left: 0; |
|
right: 0; |
|
z-index: 2; |
|
color: #666; |
|
position: fixed; |
|
line-height: 1em; |
|
background: #fff; |
|
border-bottom: 1px solid #ddd; |
|
transition: border-color .3s, background .3s; |
|
} |
|
|
|
/* - 头部标题 */ |
|
.head-title{ |
|
left: 0; |
|
right: 0; |
|
line-height: 3.2em; |
|
position: absolute; |
|
text-align: center; |
|
} |
|
@media screen and (min-width: 600px){ |
|
.head-title{ display: none } |
|
} |
|
|
|
/* - 头部菜单 */ |
|
.head-menu{ |
|
display: flex; |
|
list-style: none; |
|
user-select: none; |
|
justify-content: center; |
|
} |
|
|
|
.head-menu a{ |
|
color: inherit; |
|
display: block; |
|
cursor: pointer; |
|
position: relative; |
|
line-height: 2.25em; |
|
} |
|
.head-menu a:hover{ color: #ffa628 } |
|
|
|
.head-menu .has-child > a:after{ |
|
float: right; |
|
content: "\f107"; |
|
margin-left: .3em; |
|
font-family: "FontAwesome"; |
|
} |
|
|
|
/* -- 手机版 */ |
|
@media screen and (max-width: 600px){ |
|
.head-menu{ |
|
max-height: 0; |
|
padding: 0 1em; |
|
display: block; |
|
overflow-y: auto; |
|
border-right: .5em solid transparent; |
|
transition: margin .3s, max-height .3s; |
|
} |
|
.head-menu.active{ |
|
margin: 1em 0; |
|
max-height: 18rem; |
|
} |
|
.head-menu .sub-menu{ margin-left: 1.5em } |
|
.head-menu .sub-menu a{ |
|
display: list-item; |
|
list-style-type: circle; |
|
} |
|
|
|
.head-menu::-webkit-scrollbar{ |
|
width: 8px; |
|
height: 8px; |
|
} |
|
.head-menu::-webkit-scrollbar-thumb{ |
|
border-radius: 5px; |
|
background: rgba(0, 0, 0, .1); |
|
} |
|
} |
|
|
|
/* -- 电脑版 */ |
|
@media screen and (min-width: 599px){ |
|
.head-menu{ |
|
left: 0; |
|
right: 0; |
|
position: absolute; |
|
} |
|
|
|
.head-menu > a, .has-child > a{ |
|
padding: .6em 0; |
|
line-height: 2em; |
|
margin-right: 1em; |
|
} |
|
.head-menu > a:last-child{ margin-right: 0 } |
|
} |
|
|
|
/* - 子菜单 */ |
|
.head-menu .sub-menu a{ |
|
line-height: 2em; |
|
margin-right: .05em; |
|
} |
|
|
|
/* -- 电脑版 */ |
|
@media screen and (min-width: 599px){ |
|
.head-menu .has-child{ |
|
position: relative; |
|
} |
|
.head-menu .has-child:hover > .sub-menu{ |
|
opacity: 1; |
|
visibility: visible; |
|
} |
|
|
|
.head-menu .sub-menu{ |
|
opacity: 0; |
|
top: 3.2em; |
|
left: -1em; |
|
background: #fff; |
|
padding: .5em 1em; |
|
visibility: hidden; |
|
position: absolute; |
|
white-space: nowrap; |
|
border: 1px solid #ddd; |
|
border-radius: 0 0 .25em .25em; |
|
transition: opacity .15s, visibility .15s; |
|
} |
|
|
|
.head-menu .sub-menu:before{ |
|
left: 2em; |
|
top: -.5em; |
|
width: 1em; |
|
height: 1em; |
|
content: ''; |
|
display: block; |
|
background: #fff; |
|
border: 1px solid; |
|
position: absolute; |
|
transform: rotate(-45deg); |
|
border-color: #ccc #ccc transparent transparent; |
|
} |
|
|
|
.toggle-btn{ display: none } |
|
} |
|
|
|
.toggle-btn, .light-btn, .search-btn{ |
|
z-index: 1; |
|
float: left; |
|
width: 2em; |
|
margin: .6em; |
|
cursor: pointer; |
|
position: relative; |
|
border-radius: 4px; |
|
transition: color 0.3s, background 0.3s; |
|
} |
|
|
|
.toggle-btn{ margin-right: 0 } |
|
.search-btn{ float: right } |
|
|
|
.toggle-btn:hover, .light-btn:hover, .search-btn:hover{ |
|
background: rgba(0, 0, 0, .05); |
|
} |
|
|
|
.toggle-btn:before, .light-btn:before, .search-btn:before{ |
|
display: block; |
|
text-align: center; |
|
font: 1em/2em "FontAwesome"; |
|
} |
|
|
|
.toggle-btn:before{ content: "\f0c9" } |
|
.light-btn:before{ content: "\f0eb" } |
|
.search-btn:before{ content: "\f002" } |
|
|
|
.head-search{ |
|
z-index: 1; |
|
opacity: 0; |
|
float: right; |
|
margin: .6em 0; |
|
line-height: 1.5em; |
|
position: relative; |
|
pointer-events: none; |
|
transition: opacity 0.3s; |
|
} |
|
.head-search.active{ |
|
opacity: 1; |
|
pointer-events: inherit; |
|
} |
|
|
|
.head-search input{ |
|
height: 2em; |
|
width: 10em; |
|
border-radius: 50px; |
|
padding: .25em .75em; |
|
} |
|
|
|
@media screen and (max-width: 600px){ |
|
.head-search{ |
|
float: none; |
|
margin-left: 6.5em; |
|
margin-right: 3.5em; |
|
} |
|
|
|
.head-search input{ width: 100% } |
|
} |
|
|
|
/* 2 - 正文 |
|
-------------------------------- */ |
|
main{ |
|
padding: 3.5em 0; |
|
margin-top: 3.2em; |
|
} |
|
|
|
main img { |
|
height: auto; |
|
transition: filter .3s; |
|
} |
|
|
|
/* - 首页大标题 */ |
|
.home-title{ |
|
text-align: center; |
|
margin-bottom: 3em; |
|
animation: fade-in-bottom .3s both; -webkit-animation: fade-in-bottom .3s both; |
|
} |
|
|
|
.home-title h1{ color: #6e8aad } |
|
|
|
.home-title span{ |
|
display: block; |
|
margin-bottom: 1em; |
|
font-style: oblique; |
|
} |
|
|
|
/* - 社交链接 */ |
|
.home-social{ |
|
cursor: default; |
|
user-select: none; |
|
} |
|
|
|
.home-social a{ |
|
color: inherit; |
|
display: inline-block; |
|
} |
|
|
|
.home-social i{ padding: .5em } |
|
|
|
/* - 文章简要 */ |
|
.post-item{ |
|
margin-bottom: 3em; |
|
word-break: break-all; |
|
} |
|
.post-item:last-child{ margin-bottom: 0 } |
|
|
|
/* -- 动画 */ |
|
.post-item:nth-child(1){ animation: fade-in-top .3s .2s backwards; -webkit-animation: fade-in-top .3s .2s backwards; } |
|
.post-item:nth-child(2){ animation: fade-in-top .3s .3s backwards; -webkit-animation: fade-in-top .3s .3s backwards; } |
|
.post-item:nth-child(3){ animation: fade-in-top .3s .4s backwards; -webkit-animation: fade-in-top .3s .4s backwards; } |
|
.post-item:nth-child(4){ animation: fade-in-top .3s .5s backwards; -webkit-animation: fade-in-top .3s .5s backwards; } |
|
.post-item:nth-child(5){ animation: fade-in-top .3s .6s backwards; -webkit-animation: fade-in-top .3s .6s backwards; } |
|
.post-item:nth-child(6){ animation: fade-in-top .3s .7s backwards; -webkit-animation: fade-in-top .3s .7s backwards; } |
|
|
|
.post-item h2{ margin-bottom: .5em } |
|
|
|
.post-item h2 a{ |
|
line-height: 2em; |
|
padding-bottom: .3rem; |
|
border-bottom: 2px solid #eee; |
|
transition: color .3s, border .3s; |
|
} |
|
|
|
.post-item .edit-link{ |
|
font-size: 1rem; |
|
line-height: inherit; |
|
} |
|
|
|
/* - 文章属性 */ |
|
.post-meta{ |
|
overflow: auto; |
|
white-space: nowrap; |
|
} |
|
.post-meta::-webkit-scrollbar{ height: 0 } |
|
|
|
.post-meta a{ color: inherit } |
|
|
|
.post-meta span, .post-meta time{ |
|
margin-right: .8em; |
|
display: inline-block; |
|
} |
|
|
|
.post-meta span:last-child{ margin-right: 0 } |
|
|
|
.post-meta span:before, .post-meta time:before{ |
|
font-size: inherit; |
|
margin-right: .4em; |
|
display: inline-block; |
|
font-family: "FontAwesome"; |
|
} |
|
|
|
.post-meta .date:before{ content: "\f017" } |
|
.post-meta .category:before{ content: "\f07b" } |
|
.post-meta .tags:before{ content: "\f02c" } |
|
.post-meta .comments:before{ content: "\f086" } |
|
.post-meta .view:before{ content: "\f080" } |
|
|
|
/* - 换页 */ |
|
.page-navigator{ |
|
margin-left: 0; |
|
cursor: default; |
|
margin-top: 60px; |
|
font-size: 1.25em; |
|
text-align: center; |
|
animation: fade-in-top .3s .7s both; -webkit-animation: fade-in-top .3s .7s both; |
|
} |
|
|
|
.page-navigator li{ |
|
font-weight: normal; |
|
display: inline-block; |
|
} |
|
|
|
.page-navigator li.current a{ color: inherit } |
|
.page-navigator li a{ |
|
display: block; |
|
padding: .25em .3em; |
|
} |
|
|
|
/* - 阅读页标题 */ |
|
.post-title, .page-title{ |
|
margin-bottom: 1em; |
|
padding-bottom: 1em; |
|
transition: border 0.3s; |
|
border-bottom: 1px solid #ddd; |
|
animation: fade-in-bottom .3s both; -webkit-animation: fade-in-bottom .3s both; |
|
} |
|
|
|
.post-title h2, .page-title h2{ |
|
color: #6e8aad; |
|
margin-right: .25rem; |
|
display: inline-block; |
|
} |
|
|
|
.page-title h2{ margin-bottom: 0 } |
|
|
|
/* - 编辑文章 */ |
|
.post-item .edit-link, .page-title .edit-link, .post-title .edit-link{ |
|
display: inline-block; |
|
} |
|
|
|
/* - 阅读页正文 */ |
|
article a{ border-bottom: 1px dashed currentColor } |
|
|
|
.post-content, .page-content{ animation: fade-in-top .3s .2s backwards; -webkit-animation: fade-in-top .3s .2s backwards; } |
|
.post-content, .page-content, .post-near, .post-author{ margin-bottom: 3em } |
|
|
|
article h1, article h2, article h3{ margin-top: 3rem } |
|
|
|
article h2{ font-size: 1.15em } |
|
article h3{ font-size: 1.10em } |
|
article h4{ font-size: 1.05em } |
|
article h5{ font-size: 1em } |
|
article h6{ font-size: .9em } |
|
|
|
article h1:before, |
|
article h2:before, |
|
article h3:before{ |
|
content: "#"; |
|
color: #6f9fc7; |
|
margin-right: .5em; |
|
} |
|
|
|
article h1:before{ font-weight: bold } |
|
|
|
.post-near{ animation: fade-in-top .3s .3s backwards; -webkit-animation: fade-in-top .3s .3s backwards; } |
|
|
|
/* - 阅读页作者信息 */ |
|
.post-author{ |
|
display: table; |
|
padding: 1.5em 0; |
|
border-top: 1px solid #ddd; |
|
border-bottom: 1px solid #ddd; |
|
transition: border .3s, filter .3s; |
|
animation: fade-in-top .3s .4s backwards; -webkit-animation: fade-in-top .3s .4s backwards; |
|
} |
|
|
|
.post-author .author-avatar{ |
|
width: 5em; |
|
display: table-cell; |
|
vertical-align: middle; |
|
} |
|
|
|
.post-author img{ border-radius: 66% } |
|
|
|
.post-author .author-info{ margin-left: 1.5em } |
|
|
|
.post-author h4{ |
|
font-weight: bold; |
|
margin-bottom: .5em; |
|
} |
|
|
|
/* - 阅读页评论 */ |
|
.post-comments{ animation: fade-in-top .3s .5s backwards; -webkit-animation: fade-in-top .3s .5s backwards; } |
|
|
|
.post-comments input, .post-comments textarea{ |
|
-webkit-appearance: none; |
|
-moz-appearance: none; |
|
} |
|
|
|
/* -- 评论结构 */ |
|
.post-comments{ word-break: break-all } |
|
|
|
.comment-form{ margin-bottom: 2em } |
|
|
|
.comment-list .comment-single{ |
|
position: relative; |
|
padding-left: 3.75em; |
|
margin-bottom: 1.5em; |
|
transform-origin: left; |
|
transition: transform .3s; |
|
} |
|
.comment-list .comment-single:after{ |
|
content: ""; |
|
clear: both; |
|
display: block; |
|
} |
|
.comment-list .comment-single.active{ transform: scale(1.05) } |
|
|
|
.comment-list .comment-child{ margin-left: 2em } |
|
|
|
/* --- 评论头像 */ |
|
.comment-list .avatar{ |
|
top: 0; |
|
left: 0; |
|
min-width: 45px; |
|
max-width: 45px; |
|
position: absolute; |
|
border-radius: 100%; |
|
transition: transform .3s ease-in-out; |
|
} |
|
|
|
.comment-list .comment-single:hover .avatar{ |
|
transform: rotate(1turn); |
|
-webkit-transform: rotate(1turn); |
|
} |
|
|
|
/* --- 评论信息 */ |
|
.comment-list .comment-meta{ |
|
margin-bottom: .25em; |
|
} |
|
|
|
.comment-list .comment-time:before{ |
|
content: "\f017"; |
|
margin-right: .4em; |
|
display: inline-block; |
|
font-family: "FontAwesome"; |
|
} |
|
|
|
.comment-list .comment-author, |
|
.comment-list .comment-time{ |
|
margin-right: .8em; |
|
} |
|
|
|
/* --- 评论内容 */ |
|
.comment-single .comment-reply{ |
|
opacity: 0; |
|
float: right; |
|
line-height: 1.8; |
|
transition: opacity .3s; |
|
} |
|
.comment-single:hover .comment-reply{ opacity: 1 } |
|
|
|
.comment-reply a, .cancel-comment-reply a{ color: #aaa } |
|
.comment-reply a:hover, .cancel-comment-reply a:hover{ color: #555 } |
|
|
|
.cancel-comment-reply{ |
|
display: block; |
|
margin: .5em 0; |
|
text-align: right; |
|
} |
|
|
|
@media screen and (max-width: 600px){ |
|
.comment-form button{ width: 100% } |
|
} |
|
|
|
/* -- 文章目录 */ |
|
.article-list{ |
|
right: 0; |
|
bottom: 0; |
|
opacity: 0; |
|
z-index: 1; |
|
width: 15em; |
|
padding: 1em; |
|
overflow: auto; |
|
position: fixed; |
|
transform: translateY(0%); |
|
background: rgba(255, 255, 255, .5); |
|
transition: transform .3s, border .3s, opacity .3s, background .3s; |
|
} |
|
.article-list.active{ |
|
opacity: 1; |
|
background: #fff; |
|
transform: translateY(0%); |
|
} |
|
.article-list::-webkit-scrollbar{ width: 0; height: 0 } |
|
|
|
.article-list h4{ text-align: center } |
|
|
|
.article-list .title{ |
|
color: #555; |
|
padding: .25em 1em; |
|
border-top: 1px solid; |
|
border-bottom: 1px solid; |
|
display: inline-block; |
|
} |
|
|
|
.article-list a{ |
|
display: block; |
|
margin-bottom: .5em; |
|
} |
|
|
|
.article-list a.item-2:before, |
|
.article-list a.item-3:before, |
|
.article-list a.item-4:before, |
|
.article-list a.item-5:before, |
|
.article-list a.item-6:before{ |
|
margin-right: .5em; |
|
} |
|
|
|
.article-list a.item-2:before{ content: "-" } |
|
.article-list a.item-3:before{ content: "--" } |
|
.article-list a.item-4:before{ content: "---" } |
|
.article-list a.item-5:before{ content: "----" } |
|
.article-list a.item-6:before{ content: "-----" } |
|
|
|
@media screen and (min-width: 800px){ |
|
body.has-trees{ margin-right: 15em } |
|
|
|
body.neon .article-list{ background: rgba(0, 0, 0, .1) } |
|
|
|
.article-list{ |
|
top: 3.2em; |
|
opacity: 1; |
|
visibility: visible; |
|
border-left: 1px solid #ccc; |
|
} |
|
} |
|
@media screen and (max-width: 799px){ |
|
body.neon .article-list{ background: #444 } |
|
|
|
.article-list{ |
|
left: 0; |
|
width: 100%; |
|
min-height: 40%; |
|
max-height: 80%; |
|
transform: translateY(100%); |
|
border-top: 1px solid #ccc; |
|
} |
|
} |
|
|
|
/* - 错误页面 */ |
|
.error-page{ |
|
text-align: center; |
|
animation: fade-in-bottom .3s backwards; -webkit-animation: fade-in-bottom .3s backwards; |
|
} |
|
|
|
.error-page h1{ |
|
font-size: 5em; |
|
line-height: 1em; |
|
} |
|
|
|
.error-page img{ width: 400px } |
|
|
|
/* 3 - 页尾 |
|
-------------------------------- */ |
|
footer{ |
|
border-top: 1px solid #eee; |
|
transition: border 0.3s, background 0.3s; |
|
} |
|
|
|
footer .buttons{ |
|
right: 1em; |
|
bottom: 5em; |
|
z-index: 1; |
|
position: fixed; |
|
} |
|
|
|
footer .to-top, footer .toggle-list{ |
|
padding: .5em; |
|
display: block; |
|
cursor: pointer; |
|
background: #fff; |
|
border-radius: 4px; |
|
border: 1px solid #eee; |
|
transform: translateX(5em); |
|
transition: color .3s, border .3s, background .3s, transform .3s; |
|
} |
|
footer .to-top.active{ transform: translateX(0) } |
|
footer .to-top:before, footer .toggle-list:before{ |
|
width: 1.5em; |
|
display: block; |
|
content: "\f062"; |
|
text-align: center; |
|
font-family: "FontAwesome"; |
|
} |
|
footer .toggle-list{ |
|
display: none; |
|
margin-top: .5em; |
|
} |
|
footer .toggle-list:before{ content: '\f00b' } |
|
|
|
@media screen and (max-width: 800px){ |
|
footer .toggle-list{ |
|
display: block; |
|
transform: translateX(0); |
|
} |
|
} |
|
|
|
footer .widget{ padding: 2em 0 } |
|
|
|
footer .title-comments:after, |
|
footer .title-recent:after, |
|
footer .title-date:after{ |
|
float: right; |
|
margin-right: .75em; |
|
font-family: "FontAwesome"; |
|
} |
|
|
|
footer .title-comments:after{ content: "\f0e6" } |
|
footer .title-recent:after{ content: "\f040" } |
|
footer .title-date:after{ content: "\f017" } |
|
|
|
footer .widget ul{ |
|
margin: 0; |
|
list-style: none; |
|
} |
|
|
|
footer .widget ul li{ |
|
overflow: hidden; |
|
margin-bottom: .5em; |
|
white-space: nowrap; |
|
text-overflow: ellipsis; |
|
} |
|
footer .widget ul li:before{ |
|
content: "\f105"; |
|
margin-right: .75em; |
|
font-family: "FontAwesome"; |
|
} |
|
|
|
footer .sub-footer{ |
|
padding: 1em 0; |
|
text-align: center; |
|
} |
|
|
|
footer .sub-footer p{ font-size: .875em } |
|
|
|
/* 4 - 附加 |
|
-------------------------------- */ |
|
:not(pre) > code[class*="language-"]{ |
|
position: relative; |
|
padding: .2em; |
|
border-radius: 0.3em; |
|
color: #c92c2c; |
|
border: 1px solid rgba(0, 0, 0, 0.1); |
|
display: inline; |
|
white-space: normal; |
|
} |
|
|
|
.token.comment, .token.block-comment, .token.prolog, .token.doctype, .token.cdata{ color: #7D8B99 } |
|
.token.punctuation{ color: #5F6364 } |
|
.token.property, .token.tag, .token.boolean, .token.number, .token.function-name, .token.constant, .token.symbol, .token.deleted{ color: #c92c2c } |
|
.token.selector, .token.attr-name, .token.string, .token.char, .token.function, .token.builtin, .token.inserted{ color: #2f9c0a } |
|
|
|
.token.operator, .token.entity, .token.url, .token.variable{ color: #a67f59 } |
|
.token.atrule, .token.attr-value, .token.keyword, .token.class-name{ color: #1990b8 } |
|
.token.regex, .token.important{ color: #e90 } |
|
|
|
.language-css .token.string, .style .token.string { |
|
color: #a67f59; |
|
background: rgba(255, 255, 255, 0.5); |
|
} |
|
|
|
.token.bold { font-weight: bold } |
|
.token.italic { font-style: italic } |
|
.token.entity { cursor: help } |
|
.token.important { font-weight: normal } |
|
|
|
.namespace { opacity: .7 } |