distorsion.interhacker.space/themes/osprey/assets/sass/_base.scss

163 lines
2 KiB
SCSS
Raw Normal View History

2025-01-24 23:17:58 +01:00
// 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;
}