hmn/src/rawdata/scss/_content.scss

188 lines
2.4 KiB
SCSS

strong {
font-weight: 500;
}
.text {
@include usevar(background-color, text-background);
}
.underline {
text-decoration:underline;
}
.monospace {
font-family: $monospace-fonts;
background-color: rgba(0, 0, 0, 0.1);
padding: 0.2em 0 0.05em;
border-radius: 3px;
&::before, &::after {
content: "\00a0";
letter-spacing: -0.2em;
}
}
.center {
text-align: center;
}
.right {
text-align: right;
}
.left {
text-align: left;
}
.justify {
text-align:justify;
-webkit-hyphens:manual;
-moz-hyphens:manual;
-ms-hyphens:manual;
hyphens:manual;
}
.spoiler {
@include usevar(border-color, spoiler-border);
border-width: 1px;
border-style: dashed;
color: transparent;
&::selection {
color: white;
background-color: black;
}
}
blockquote {
@extend .b--dimmest;
@extend .ml2, .pl2, .mr0;
@extend .bl;
.quotewho {
line-height: 2em;
&::after {
content: " said:";
}
}
}
pre {
font-family: $monospace-fonts;
}
.post-content {
* {
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
}
h1 {
font-size: 2rem;
}
h2 {
font-size: 1.5rem;
}
h3 {
font-size: 1.25rem;
}
h4 {
font-size: 1rem;
}
h5 {
font-size: 0.8rem;
}
h1, h2, h3, h4, h5 {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
li:not(:last-child) {
margin-bottom: 0.2em;
}
img {
max-width: 100%;
}
hr {
@extend .mh3;
}
div.code {
@extend .b--dimmer;
max-width: 100%;
max-height: 20em;
max-height: 80vh;
overflow: auto;
-moz-tab-size: 4;
tab-size: 4;
border-width: 1px;
border-style: solid;
}
div + br,
blockquote + br,
ul + br,
ol + br,
{
display: none;
}
table {
@extend .mv2;
}
th, td {
@extend .ph2, .pv1;
@extend .ba, .b--dimmest;
}
code {
@extend .bg--dim;
@extend .br2;
padding: .2em 0;
white-space: nowrap;
&::before, &::after {
content: "\00a0";
letter-spacing: -0.2em;
display: inline-block;
}
}
pre > code, pre.hmn-code {
@extend .bg--dim;
@extend .br2;
padding: 0.7em;
overflow-x: auto;
}
}
figure {
@extend .bg--dim, .br3;
display: flex;
flex-direction: column;
margin: $spacing-medium 0;
padding: $spacing-medium $spacing-medium 0;
figcaption {
padding: $spacing-small 0;
}
}