refactor(article): add default padding

closes https://github.com/CaiJimmy/hugo-theme-stack/issues/165
This commit is contained in:
Jimmy Cai 2021-03-07 00:10:41 +01:00
parent 38eb9c4eaf
commit b10a0ab002
No known key found for this signature in database
GPG Key ID: 3EA408E527F37B18

View File

@ -187,12 +187,11 @@
.article-content { .article-content {
font-family: var(--article-font-family); font-family: var(--article-font-family);
font-size: var(--article-font-size); font-size: var(--article-font-size);
padding: 0 var(--card-padding);
line-height: var(--article-line-height); line-height: var(--article-line-height);
& > p, & > p {
& > div {
margin: 1.5em 0; margin: 1.5em 0;
padding: 0 var(--card-padding);
} }
h1, h1,
@ -201,12 +200,12 @@
h4, h4,
h5, h5,
h6 { h6 {
padding: 0 calc(var(--card-padding) - var(--heading-border-size)); margin-left: calc((var(--card-padding)) * -1);
padding-left: calc(var(--card-padding) - var(--heading-border-size));
border-left: var(--heading-border-size) solid var(--accent-color); border-left: var(--heading-border-size) solid var(--accent-color);
} }
figure { figure {
margin: 0 auto;
text-align: center; text-align: center;
figcaption { figcaption {
@ -217,17 +216,12 @@
blockquote { blockquote {
position: relative; position: relative;
margin: 10px 0; margin: 1.5em 0;
border-left: var(--blockquote-border-size) solid var(--card-separator-color); border-left: var(--blockquote-border-size) solid var(--card-separator-color);
padding: 15px calc(var(--card-padding) - var(--blockquote-border-size)); padding: 15px calc(var(--card-padding) - var(--blockquote-border-size));
background-color: var(--blockquote-background-color); background-color: var(--blockquote-background-color);
} }
& > ul,
& > ol {
margin: 1em var(--card-padding);
}
hr { hr {
width: 100px; width: 100px;
margin: 40px auto; margin: 40px auto;
@ -250,7 +244,7 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
margin: 20px 0; margin: 1.5em 0;
figure { figure {
margin: 0; margin: 0;
@ -280,9 +274,7 @@
} }
table { table {
margin: 0 var(--card-padding);
width: 100%; width: 100%;
max-width: calc(100% - var(--card-padding) * 2);
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; border-spacing: 0;
margin-bottom: 1.5em; margin-bottom: 1.5em;
@ -307,4 +299,13 @@
.twitter-tweet { .twitter-tweet {
color: var(--card-text-color-main); color: var(--card-text-color-main);
} }
/// Negative margins
blockquote,
figure,
.gallery,
pre {
margin-left: calc((var(--card-padding)) * -1);
margin-right: calc((var(--card-padding)) * -1);
}
} }