technoduck/hugo-theme-stack-stars
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

refactor(article): use var(--content-side-padding) in more places

Browse source
This commit is contained in:
Jimmy Cai 2020-08-24 12:17:43 +02:00
parent a1250ee75f
commit 36f53f592b
2 changed files with 15 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
assets/scss/partials/article.scss
View file

@ -120,10 +120,6 @@
} }
.article-tags { .article-tags {
& + .article-copyright {
margin-top: 30px;
}
a { a {
color: var(--accent-color-text); color: var(--accent-color-text);
background-color: var(--accent-color); background-color: var(--accent-color);

33
assets/scss/partials/layout/article.scss
View file

@ -1,5 +1,15 @@
@import "variables.scss"; @import "variables.scss";
:root {
--content-side-padding: 30px;
--blockquote-border-size: 4px;
--heading-border-size: 4px;
@media (max-width: $on-tablet) {
--content-side-padding: 20px;
}
}
.article-page { .article-page {
.left-sidebar { .left-sidebar {
@media (max-width: $on-tablet) { @media (max-width: $on-tablet) {
@ -53,15 +63,13 @@
} }
.article-details { .article-details {
padding: 30px 30px 0 30px; padding: var(--content-side-padding);
@media (max-width: $on-tablet) { padding-bottom: 0;
padding: 20px 20px 0 20px;
}
} }
} }
.article-content { .article-content {
margin: 30px 0; margin: var(--content-side-padding) 0;
line-height: 1.75; line-height: 1.75;
color: var(--card-text-color-main); color: var(--card-text-color-main);
@ -76,13 +84,10 @@
} }
.article-footer { .article-footer {
padding: 30px; padding: var(--content-side-padding);
@media (max-width: $on-phone) {
padding: 20px;
}
.article-copyright { .article-copyright {
margin-top: var(--content-side-padding);
color: var(--card-text-color-tertiary); color: var(--card-text-color-tertiary);
text-transform: uppercase; text-transform: uppercase;
display: flex; display: flex;
@ -202,14 +207,6 @@
} }
.article-content { .article-content {
--content-side-padding: 30px;
--blockquote-border-size: 4px;
--heading-border-size: 4px;
@media (max-width: $on-tablet) {
--content-side-padding: 20px;
}
font-family: var(--article-font-family); font-family: var(--article-font-family);
p { p {