diff --git a/src/style/components/Article.scss b/src/style/components/Article.scss index 7753082d..775f0c53 100644 --- a/src/style/components/Article.scss +++ b/src/style/components/Article.scss @@ -28,6 +28,8 @@ } &-Body{ + --text-margin: 10px; + img { max-width: 100%; max-height: 35em; @@ -36,7 +38,6 @@ ul, ol{ margin-left: $half-margin; margin-bottom: $single-margin; - padding-left: $single-margin; } ul{ @@ -44,14 +45,15 @@ } p { - --margin: 10px; - - margin-left: var(--margin); - margin-right: var(--margin); margin-bottom: var(--article-line-height); line-height: var(--article-line-height); } + p, h2, h3 { + margin-left: var(--text-margin); + margin-right: var(--text-margin); + } + blockquote { background-color: hsl(215, 10%, 96%); padding: var(--article-quote-padding); @@ -61,6 +63,8 @@ font-weight: normal; font-size: var(--article-quote-font-size); + border-radius: var(--block-border-radius); + cite { margin-top: $single-margin; display: block; @@ -88,13 +92,11 @@ --article-quote-font-size: 1em; &-Body { + --text-margin: 0; + img { max-height: 20em; } - - p { - --margin: 0; - } } } } diff --git a/src/style/variables.scss b/src/style/variables.scss index 9922f162..1f3e2600 100644 --- a/src/style/variables.scss +++ b/src/style/variables.scss @@ -93,6 +93,9 @@ $short-duration: 0.3s; --single-margin: $single-margin; --double-margin: $double-margin; --post-margin: $post-margin; + + //OTHER + --block-border-radius: 3px; } @media (max-width: $mobile-width) {