chore: refactor code style

This commit is contained in:
Dillon
2020-02-14 01:30:33 +08:00
parent 917cf4a427
commit 12bd1e1935
45 changed files with 422 additions and 423 deletions

View File

@@ -1,4 +1,4 @@
.notfound {
#content-404 {
font-size: 1.8rem;
line-height: 3rem;
transform: translateY(30vh);

View File

@@ -0,0 +1,9 @@
.archive {
.single-title {
text-align: right;
padding-bottom: 2rem;
}
@import "../_partial/_archive/terms";
@import "../_partial/_archive/tags";
}

View File

@@ -1,55 +1,70 @@
/** Home **/
.home-intro {
transform: translateY(25vh);
text-align: center;
@import "../_partial/_home/summary";
.home-avatar {
padding: 0.6rem;
@mixin page-home($profile, $posts) {
.home {
@if $profile {
.home-profile {
transform: translateY(if($posts, 0, 16vh));
padding: if($posts, 2rem, 0) 0;
text-align: center;
img {
width: 8rem;
height: auto;
display: inline-block;
-webkit-border-radius: 100%;
border-radius: 100%;
-webkit-box-shadow: 0 0 0 0.3618em rgba(0, 0, 0, 0.05);
box-shadow: 0 0 0 0.3618em rgba(0, 0, 0, 0.05);
margin: 0 auto;
-webkit-transition: all ease 0.4s;
-moz-transition: all ease 0.4s;
-o-transition: all ease 0.4s;
transition: all ease 0.4s;
cursor: pointer;
.home-avatar {
padding: 0.6rem;
&:hover {
position: relative;
-webkit-transform: translateY(-0.75rem);
-moz-transform: translateY(-0.75rem);
-ms-transform: translateY(-0.75rem);
-o-transform: translateY(-0.75rem);
transform: translateY(-0.75rem);
cursor: pointer;
img {
width: if($posts, 6rem, 8rem);
height: auto;
display: inline-block;
-webkit-border-radius: 100%;
border-radius: 100%;
-webkit-box-shadow: 0 0 0 0.3618em rgba(0, 0, 0, 0.05);
box-shadow: 0 0 0 0.3618em rgba(0, 0, 0, 0.05);
margin: 0 auto;
-webkit-transition: all ease 0.4s;
-moz-transition: all ease 0.4s;
-o-transition: all ease 0.4s;
transition: all ease 0.4s;
cursor: pointer;
&:hover {
position: relative;
-webkit-transform: translateY(-0.75rem);
-moz-transform: translateY(-0.75rem);
-ms-transform: translateY(-0.75rem);
-o-transform: translateY(-0.75rem);
transform: translateY(-0.75rem);
cursor: pointer;
}
}
}
.home-description {
font-size: 1rem;
font-weight: normal;
margin: 0;
padding: .4rem;
}
.home-social-links {
padding-top: .6rem;
i {
font-size: 1.45rem;
}
img {
width: 1.5rem;
height: 1.5rem;
}
}
}
}
}
.home-description {
font-size: 1rem;
font-weight: normal;
margin: 0;
padding: .4rem;
}
.home-social-links {
padding-top: .6rem;
i {
font-size: 1.45rem;
}
img {
width: 1.5rem;
height: 1.5rem;
@if $posts {
@include summary;
}
}
}
@include page-home($home-profile, $home-posts);

View File

@@ -6,25 +6,8 @@
padding-top: 6rem;
}
@import "_single";
@import "_special";
@import "_archive";
@import "_home";
@import "_404";
@import "_post";
@import "_posts";
.archive {
.post-title {
text-align: right;
padding-bottom: 2rem;
}
@import "_terms";
@import "_tags";
}
.single {
.post-title {
text-align: right;
padding-bottom: 2rem;
}
}

View File

@@ -1,143 +0,0 @@
.home-intro {
transform: translateY(0);
padding: 2rem 0 2rem 0;
.home-avatar {
img {
width: 6rem;
}
}
}
.summary {
padding-top: 1rem;
padding-bottom: .8rem;
color: $global-font-color;
border-bottom: 1px dashed $global-border-color;
.dark-theme & {
color: $global-font-color-dark;
border-bottom: 1px dashed $global-border-color-dark;
}
.post-featured-image-preview {
width: 100%;
padding: 30% 0 0;
position: relative;
margin: 0.6rem auto;
img {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
object-fit: cover;
}
}
.post-title {
font-size: 1.6rem;
}
.post-meta {
font-size: .875rem !important;
a {
color: $global-font-secondary-color !important;
.dark-theme & {
color: $global-font-secondary-color-dark !important;
}
&:hover {
color: $global-link-hover-color !important;
.dark-theme & {
color: $global-link-hover-color-dark !important;
}
}
}
}
.post-content {
display: -moz-box;
display: -webkit-box;
-moz-box-orient: vertical;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
margin-top: .3rem;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
overflow-wrap: break-word;
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
font-size: 1rem;
display: inline;
&::after {
content: "\A";
white-space: pre;
}
}
h1,
h2,
h3,
h4,
h5,
h6 {
line-height: 2;
}
.post-footer {
margin-top: .5rem;
display: flex;
justify-content: space-between;
align-items: center;
font-size: .875rem !important;
a {
color: $post-link-color !important;
.dark-theme & {
color: $post-link-color-dark !important;
}
&:hover {
color: $post-link-hover-color !important;
.dark-theme & {
color: $post-link-hover-color-dark !important;
}
}
}
.post-tags {
padding: 0;
a {
color: $global-link-color !important;
.dark-theme & {
color: $global-link-color-dark !important;
}
&:hover {
color: $global-link-hover-color !important;
.dark-theme & {
color: $global-link-hover-color-dark !important;
}
}
}
}
}
}

View File

@@ -1,12 +1,12 @@
/** Post **/
.post {
.post-title {
/** Single **/
.single {
.single-title {
margin: 0;
font-size: 1.8rem;
line-height: 3rem;
}
.post-meta {
.meta {
font-size: .88rem;
color: $global-font-secondary-color;
@@ -19,17 +19,17 @@
}
a {
color: $post-link-color;
color: $single-link-color;
.dark-theme & {
color: $post-link-color-dark;
color: $single-link-color-dark;
}
&:hover {
color: $post-link-hover-color;
color: $single-link-hover-color;
.dark-theme & {
color: $post-link-hover-color-dark;
color: $single-link-hover-color-dark;
}
}
}
@@ -39,7 +39,7 @@
}
}
.post-featured-image {
.featured-image {
padding-top: .6rem;
img {
@@ -51,9 +51,9 @@
}
}
@import "../_partial/_post/toc";
@import "../_partial/_single/toc";
.post-content {
.content {
.post-dummy-target:target {
display: inline-block;
position: relative;
@@ -86,10 +86,10 @@
h2::before {
content: "#";
margin-right: .3125rem;
color: $post-link-color;
color: $single-link-color;
.dark-theme & {
color: $post-link-color-dark;
color: $single-link-color-dark;
}
}
@@ -99,10 +99,10 @@
h6::before {
content: "|";
margin-right: .3125rem;
color: $post-link-color;
color: $single-link-color;
.dark-theme & {
color: $post-link-color-dark;
color: $single-link-color-dark;
}
}
@@ -112,18 +112,19 @@
}
a {
color: $post-link-color;
word-break: break-all;
color: $single-link-color;
.dark-theme & {
color: $post-link-color-dark;
color: $single-link-color-dark;
}
}
a:hover {
color: $post-link-hover-color;
color: $single-link-hover-color;
.dark-theme &:hover {
color: $post-link-hover-color-dark;
color: $single-link-hover-color-dark;
font-weight: bold;
}
}
@@ -233,11 +234,11 @@
width: 3rem;
height: 2rem;
font: 6em/1.08em 'PT Sans', sans-serif;
color: $post-link-color;
color: $single-link-color;
text-align: center;
.dark-theme & {
color: $post-link-color-dark;
color: $single-link-color-dark;
}
}
@@ -246,10 +247,10 @@
display: block;
text-align: right;
font-size: 0.875em;
color: $post-link-color;
color: $single-link-color;
.dark-theme & {
color: $post-link-color-dark;
color: $single-link-color-dark;
}
}
@@ -266,8 +267,8 @@
}
}
@import "../_partial/_post/code";
@import "../_partial/_post/admonition";
@import "../_partial/_single/code";
@import "../_partial/_single/admonition";
.mermaid {
width: 100%;
@@ -372,6 +373,6 @@
}
}
@import "../_partial/_post/footer";
@import "../_partial/_post/comment";
@import "../_partial/_single/footer";
@import "../_partial/_single/comment";
}

View File

@@ -0,0 +1,6 @@
.special {
.single-title {
text-align: right;
padding-bottom: 2rem;
}
}

View File

@@ -1,32 +0,0 @@
.tag-cloud-tags {
margin: 10px 0;
a {
display: inline-block;
position: relative;
margin: 5px 10px;
overflow-wrap: break-word;
transition-duration: .3s;
transition-property: transform;
transition-timing-function: ease-out;
&:active,
&:focus,
&:hover {
color: $global-link-hover-color;
transform: scale(1.1);
.dark-theme & {
color: $global-link-hover-color-dark;
}
}
small {
color: $global-font-secondary-color;
.dark-theme & {
color: $global-link-hover-color-dark;
}
}
}
}

View File

@@ -1,83 +0,0 @@
.archive-item {
margin-left: 2rem;
}
.categories-card {
margin: 0 auto;
margin-top: 3rem;
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: row;
flex-wrap: wrap;
padding: 0 2.5rem;
line-height: 1.6rem;
.card-item {
font-size: .875rem;
text-align: left;
width: 45%;
display: flex;
align-items: flex-start;
margin-top: 2rem;
min-height: 10rem;
padding: 0 2%;
position: relative;
.card-item-wrapper {
width: 100%;
overflow: hidden;
.card-item-title {
font-size: 1.2rem;
font-weight: bold;
display: inline-block;
}
span {
float: right;
padding-right: 1rem;
}
}
}
}
.archive-item-link {
display: inline-block;
text-decoration: none;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 95%;
&:hover {
color: $global-link-hover-color;
background-color: transparent;
}
.dark-theme & {
color: $global-link-color-dark;
text-decoration: none;
transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease;
&:hover {
color: $global-link-hover-color-dark;
text-decoration: none;
transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease;
}
}
}
.archive-item-date {
float: right;
text-align: right;
color: $global-font-secondary-color;
.dark-theme & {
color: $global-font-secondary-color-dark;
}
}
.more-post {
text-align: right;
}