162 lines
2 KiB
SCSS
162 lines
2 KiB
SCSS
// Font styles
|
|
strong {
|
|
font-weight: 600;
|
|
}
|
|
|
|
del,
|
|
s {
|
|
text-decoration: line-through;
|
|
}
|
|
|
|
em,
|
|
dfn {
|
|
font-style: italic;
|
|
}
|
|
|
|
a {
|
|
transition: color .2s ease-out;
|
|
text-decoration: none;
|
|
|
|
img {
|
|
border: 0;
|
|
}
|
|
|
|
&:hover {
|
|
color: $accent;
|
|
}
|
|
}
|
|
|
|
|
|
// Code
|
|
pre {
|
|
margin-top: 0;
|
|
margin-bottom: $vertical-rhythm;
|
|
padding: 16px;
|
|
overflow: auto;
|
|
background-color: $smoke;
|
|
font: 12px "Consolas", "Liberation Mono", "Menlo", "Courier", monospace;
|
|
font-family: $font-code;
|
|
font-size: 85%;
|
|
line-height: 1.45;
|
|
word-wrap: normal;
|
|
|
|
& > code {
|
|
margin: 0;
|
|
padding: 0;
|
|
border: 0;
|
|
background: transparent;
|
|
font-size: 100%;
|
|
word-break: normal;
|
|
white-space: pre;
|
|
}
|
|
|
|
code {
|
|
display: inline;
|
|
margin: 0;
|
|
padding: 0;
|
|
overflow: visible;
|
|
border: 0;
|
|
background-color: transparent;
|
|
line-height: inherit;
|
|
word-wrap: normal;
|
|
|
|
&::before,
|
|
&::after {
|
|
content: normal;
|
|
}
|
|
}
|
|
}
|
|
|
|
code {
|
|
padding: 4px;
|
|
background-color: $smoke;
|
|
font-family: $font-code;
|
|
font-size: 90%;
|
|
}
|
|
|
|
.sans {
|
|
font-family: "Open Sans", "Myriad Pro", "Myriad", sans-serif;
|
|
}
|
|
|
|
.mono,
|
|
tt {
|
|
font-family: $font-code;
|
|
}
|
|
|
|
|
|
// Quotes
|
|
q {
|
|
@extend em;
|
|
|
|
&::before {
|
|
content: "\201C";
|
|
}
|
|
|
|
&::after {
|
|
content: "\201D";
|
|
}
|
|
}
|
|
|
|
%blockquote {
|
|
content: "\201C";
|
|
color: $accent;
|
|
font-family: $font-header;
|
|
font-size: 35px;
|
|
}
|
|
|
|
blockquote {
|
|
padding: 25px;
|
|
font-family: $font-header;
|
|
text-align: center;
|
|
|
|
p {
|
|
display: inline-block;
|
|
font-style: italic;
|
|
}
|
|
|
|
&::before {
|
|
@extend %blockquote;
|
|
}
|
|
|
|
&::after {
|
|
@extend %blockquote;
|
|
content: "\201D";
|
|
}
|
|
}
|
|
|
|
|
|
// Images
|
|
img {
|
|
display: inline-block;
|
|
max-width: 100%;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
|
|
// Lists
|
|
ul,
|
|
ol {
|
|
margin-bottom: $vertical-rhythm;
|
|
|
|
li {
|
|
margin-left: 1.25em;
|
|
|
|
code {
|
|
font-family: $font-code;
|
|
}
|
|
}
|
|
}
|
|
|
|
ul li {
|
|
list-style-type: disc;
|
|
}
|
|
|
|
|
|
// Show or hide elements
|
|
.show {
|
|
transition: opacity 600ms;
|
|
}
|
|
|
|
.hide {
|
|
opacity: 0;
|
|
}
|