saul365/LoveIt
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: refactor code style

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

1
assets/css/_core/_base.scss
View File

@@ -60,7 +60,6 @@ body {
a {
color: $global-link-color;
text-decoration: none;
word-break: break-all;
transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease;
&:hover {

8
assets/css/_core/_media.scss
View File

@@ -32,8 +32,8 @@
}
@media only screen and (max-width: 960px) {
.navbar {
.navbar-container {
header.desktop {
.header-wrapper {
margin: 0 1rem;
}
}
@@ -52,11 +52,11 @@
}
@media only screen and (max-width: 560px) {
.navbar {
header.desktop {
display: none;
}
.navbar-mobile {
header.mobile {
display: block;
}

2
assets/css/_page/_404.scss
View File

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

9
assets/css/_page/_archive.scss Normal file
View File

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

105
assets/css/_page/_home.scss
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);

23
assets/css/_page/_index.scss
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;
}
}

143
assets/css/_page/_posts.scss
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;
}
}
}
}
}
}

55
assets/css/_page/_post.scss → assets/css/_page/_single.scss
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";
}

6
assets/css/_page/_special.scss Normal file
View File

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

0
assets/css/_page/_tags.scss → assets/css/_partial/_archive/_tags.scss
View File

0
assets/css/_page/_terms.scss → assets/css/_partial/_archive/_terms.scss
View File

46
assets/css/_partial/_navbar.scss → assets/css/_partial/_header.scss
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 {

134
assets/css/_partial/_home/_summary.scss Normal file
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;
}
}
}
}
}
}
}

2
assets/css/_partial/_pagination.scss
View File

@@ -1,4 +1,4 @@
/** pagination **/
/** pagination **/
.pagination {
display: flex;
flex-direction: row;

0
assets/css/_partial/_post/_admonition.scss → assets/css/_partial/_single/_admonition.scss
View File

0
assets/css/_partial/_post/_code.scss → assets/css/_partial/_single/_code.scss
View File

2
assets/css/_partial/_post/_comment.scss → assets/css/_partial/_single/_comment.scss
View File

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

8
assets/css/_partial/_post/_footer.scss → assets/css/_partial/_single/_footer.scss
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;
}
}
}

12
assets/css/_partial/_post/_toc.scss → assets/css/_partial/_single/_toc.scss
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;
}
}
}

32
assets/css/_variables.scss
View File

@@ -47,24 +47,24 @@ $selection-color: rgba(38, 139, 211, 0.2) !default;
$selection-color-dark: rgba(38, 139, 211, 0.3) !default;
// ========== Selection ========== //
// ========== Navbar ========== //
// Color of the navbar background
$navbar-background-color: #fafafa !default;
$navbar-background-color-dark: #252627 !default;
// ========== Header ========== //
// Color of the header background
$header-background-color: #fafafa !default;
$header-background-color-dark: #252627 !default;
// Color of the hover navbar item
$navbar-hover-color: #161209 !default;
$navbar-hover-color-dark: #fff !default;
// ========== Navbar ========== //
// Color of the hover header item
$header-hover-color: #161209 !default;
$header-hover-color-dark: #fff !default;
// ========== Header ========== //
// ========== Post Content ========== //
// Color of the post link
$post-link-color: #2d96bd !default;
$post-link-color-dark: #eee !default;
// ========== Single Content ========== //
// Color of the single link
$single-link-color: #2d96bd !default;
$single-link-color-dark: #eee !default;
// Color of the hover post link
$post-link-hover-color: #ef3982 !default;
$post-link-hover-color-dark: #2d96bd !default;
// Color of the hover single link
$single-link-hover-color: #ef3982 !default;
$single-link-hover-color-dark: #2d96bd !default;
// Color of the table background
$table-background-color: #fff !default;
@@ -73,7 +73,7 @@ $table-background-color-dark: #272c34 !default;
// Color of the table thead
$table-thead-color: #ededed !default;
$table-thead-color-dark: #20252b !default;
// ========== Post Content ========== //
// ========== Single Content ========== //
// ========== Pagination ========== //
// Color of the link in pagination

16
assets/css/custom-style.scss
View File

@@ -1,16 +0,0 @@
@import "_variables";
@import "_custom";
@import "_core/normalize";
@import "_core/base";
@import "_core/layout";
@import "_page/index";
@import "_partial/navbar";
@import "_partial/footer";
@import "_partial/pagination";
@import "_core/media";
@import "_custom";

13
assets/css/style.scss
View File

@@ -1,13 +0,0 @@
@import "_variables";
@import "_core/normalize";
@import "_core/base";
@import "_core/layout";
@import "_page/index";
@import "_partial/navbar";
@import "_partial/footer";
@import "_partial/pagination";
@import "_core/media";

29
assets/css/style.template.scss Normal file
View File

@@ -0,0 +1,29 @@
{{- if eq .Site.Params.home_mode "post" -}}
$home-profile: true;
$home-posts: true;
{{- else -}}
$home-profile: true;
$home-posts: false;
{{- end -}}
@import "_variables";
{{- if fileExists "config/css/_custom.scss" -}}
@import "_custom";
{{- end -}}
@import "_core/normalize";
@import "_core/base";
@import "_core/layout";
@import "_page/index";
@import "_partial/header";
@import "_partial/footer";
@import "_partial/pagination";
@import "_core/media";
{{- if fileExists "config/css/_custom.scss" -}}
@import "_custom";
{{- end -}}