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

@@ -0,0 +1,32 @@
.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

@@ -0,0 +1,83 @@
.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;
}

View File

@@ -1,78 +1,78 @@
.navbar {
header.desktop {
display: block;
position: fixed;
width: 100%;
z-index: 100;
height: 4rem;
line-height: 4rem;
background-color: $navbar-background-color;
background-color: $header-background-color;
.dark-theme & {
background-color: $navbar-background-color-dark;
background-color: $header-background-color-dark;
}
.navbar-container {
.header-wrapper {
width: auto;
text-align: center;
margin: 0 4rem;
display: flex;
justify-content: space-between;
.navbar-header a {
.header-title a {
padding: 0 8px;
font-size: 20px;
font-size: 1.25rem;
i {
line-height: 2em;
line-height: 2rem;
}
}
.navbar-menu a {
.menu a {
padding: 0 8px;
&.active {
font-weight: 900;
color: $navbar-hover-color;
color: $header-hover-color;
.dark-theme & {
color: $navbar-hover-color-dark;
color: $header-hover-color-dark;
}
}
}
}
}
.navbar-mobile {
header.mobile {
display: none;
position: fixed;
width: 100%;
z-index: 100;
transition: all 0.3s ease 0s;
.navbar-container {
.header-wrapper {
padding: 0;
margin: 0;
height: 4.5em;
line-height: 4.5em;
height: 4.5rem;
line-height: 4.5rem;
background: $global-background-color;
.navbar-header {
.header-container {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
font-size: 18px;
padding-right: 1em;
padding-left: 1em;
font-size: 1.125rem;
padding-right: 1rem;
padding-left: 1rem;
box-sizing: border-box;
.navbar-header-title {
font-size: 20px;
.header-title {
font-size: 1.25rem;
}
.menu-toggle {
cursor: pointer;
line-height: 4.5em;
line-height: 4.5rem;
span {
display: block;
@@ -127,7 +127,7 @@
}
}
.navbar-menu {
.menu {
text-align: center;
background: $global-background-color;
border-top: 2px solid $global-font-color;
@@ -136,7 +136,7 @@
a {
display: block;
line-height: 2.5em;
line-height: 2.5rem;
}
&.active {

View File

@@ -0,0 +1,134 @@
@mixin summary {
.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;
}
.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;
}
}
.single-title {
font-size: 1.6rem;
}
.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;
}
}
}
}
.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: $single-link-color !important;
.dark-theme & {
color: $single-link-color-dark !important;
}
&:hover {
color: $single-link-hover-color !important;
.dark-theme & {
color: $single-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,4 +1,4 @@
/** pagination **/
/** pagination **/
.pagination {
display: flex;
flex-direction: row;

View File

@@ -1,3 +1,3 @@
.post-comment {
.comment {
padding: 4rem 0;
}

View File

@@ -34,17 +34,17 @@
.post-info-md
a {
font-size: 0.8em;
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;
}
}
}

View File

@@ -37,10 +37,10 @@
content: "|";
font-weight: bolder;
margin-right: .5rem;
color: $post-link-color;
color: $single-link-color;
.dark-theme & {
color: $post-link-color-dark;
color: $single-link-color-dark;
}
}
@@ -56,18 +56,18 @@
.toc-link.active {
font-weight: bold;
color: $post-link-hover-color;
color: $single-link-hover-color;
.dark-theme & {
color: $post-link-hover-color-dark;
color: $single-link-hover-color-dark;
}
&::before {
font-weight: bolder;
color: $post-link-hover-color;
color: $single-link-hover-color;
.dark-theme & {
color: $post-link-hover-color-dark;
color: $single-link-hover-color-dark;
}
}
}