src/components/_post.scss
// =====================================================
// Post
// =====================================================
// "We style it because the built-in is suck"
$post-prefix: "post" !default;
$theme-post-enable: false !default;
@if ($theme-post-enable == true) {
.#{$post-prefix} {
display: block;
background: map-get($theme-color-post, background);
color: map-get($theme-color-post, foreground);
margin-bottom: $theme-post-margin;
&__title {
display: block;
font-size: map-get($theme-post-font-size, x-large);
line-height: map-get($theme-post-line-height, x-large);
font-weight: map-get($theme-font-weight, super-bold);
color: map-get($theme-color-post, title);
margin-bottom: $theme-post-title-margin;
}
&__body {
display: block;
font-size: map-get($theme-post-font-size, medium);
line-height: map-get($theme-post-line-height, medium);
font-weight: map-get($theme-font-weight, light);
// exception to throw element selector here
h2 {
font-size: map-get($theme-post-font-size, large);
line-height: map-get($theme-post-line-height, large);
font-weight: map-get($theme-font-weight, bold);
color: map-get($theme-color-post, title);
margin-top: map-get($theme-post-font-size, large);
margin-bottom: $theme-post-subtitle-margin;
}
h2:first-child {
margin-top: 0;
}
p {
text-align: $theme-post-paragraph-text-align;
margin-bottom: map-get($theme-post-font-size, medium);
}
a {
color: map-get($theme-color-post, link-default);
}
a:hover {
color: map-get($theme-color-post, link-hover);
}
blockquote {
margin-left: 0;
border-left: $theme-post-blockquote-border-width solid map-get($theme-color-post, blockquote);
padding-left: $theme-post-blockquote-padding-left;
}
}
}
}