162 lines
2.7 KiB
SCSS
162 lines
2.7 KiB
SCSS
// HTML
|
|
html {
|
|
background-color: #f5f5f5;
|
|
color: #1f1f1f;
|
|
}
|
|
|
|
// 滚动条
|
|
html::-webkit-scrollbar-thumb {
|
|
background-color: #0000000d;
|
|
}
|
|
|
|
html::-webkit-scrollbar-thumb:hover {
|
|
background-color: #00000026;
|
|
}
|
|
|
|
::selection {
|
|
background: #0095ff1a;
|
|
}
|
|
|
|
// Body
|
|
body {
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
// Header 头部
|
|
.header {
|
|
|
|
// 站点标题
|
|
.title {
|
|
|
|
a {
|
|
span {
|
|
color: rgb(0, 0, 0);
|
|
|
|
&:hover {
|
|
color: rgba(0, 0, 0, 0.65);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 二级标题
|
|
.description {
|
|
color: rgba(0, 0, 0, 0.65);
|
|
|
|
.socials {
|
|
a {
|
|
color: rgba(0, 0, 0, 0.65);
|
|
|
|
&:hover {
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
// main 主体
|
|
main {
|
|
background: #ffffff;
|
|
box-shadow: 0 0.375rem 1rem -0.5rem rgba(0, 0, 0, 0.08);
|
|
// 首页
|
|
.post {
|
|
h1 {
|
|
a {
|
|
color: rgba(0, 0, 0, 1);
|
|
|
|
}
|
|
}
|
|
|
|
p {
|
|
color: rgba(0, 0, 0, 0.85);
|
|
}
|
|
|
|
.info {
|
|
border-bottom: 1px solid #f3f3f3;
|
|
|
|
span {
|
|
color: rgb(0, 0, 0, 0.65);
|
|
}
|
|
|
|
a {
|
|
color: rgb(0, 0, 0, 0.65);
|
|
}
|
|
|
|
.date,
|
|
.tag {
|
|
i {
|
|
color: rgb(0, 0, 0, 0.85);
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
// 文章分页
|
|
.pagenav {
|
|
border-bottom: 1px solid #f2f2f2;
|
|
|
|
a {
|
|
color: rgb(0, 0, 0);
|
|
|
|
&:hover {
|
|
color: rgb(0, 0, 0, 0.65);
|
|
}
|
|
}
|
|
}
|
|
// 归档页面,类别页面
|
|
.archives,.category{
|
|
.list {
|
|
.post-title{
|
|
a {
|
|
color: rgb(0, 0, 0.85);
|
|
|
|
&:hover {
|
|
color: rgb(0, 0, 0, 0.65);
|
|
}
|
|
}
|
|
.time {
|
|
color: #c5c5c5;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
// 标记页面
|
|
.tags {
|
|
ul {
|
|
li{
|
|
a{
|
|
color: rgb(0, 0, 0.85);
|
|
|
|
&:hover {
|
|
color: rgb(0, 0, 0, 0.65);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.count {
|
|
color: #c5c5c5;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 脚注
|
|
|
|
footer {
|
|
.copyright {
|
|
a {
|
|
color: rgb(0, 0, 0, 0.25);
|
|
&:hover {
|
|
color: rgb(0, 0, 0, 0.85);
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|