lbry.tech/app/sass/pages/_documentation.scss

107 lines
1.6 KiB
SCSS
Raw Normal View History

.documentation {
2018-05-22 08:04:46 +02:00
ol + h1,
ul + h1 {
padding-top: 2rem;
}
2018-05-22 21:57:34 +02:00
h4 + h2 {
padding-top: 2rem;
}
2018-05-22 08:04:46 +02:00
2018-06-06 22:05:18 +02:00
.blog-posts {
list-style-type: none;
}
.blog-post {
position: relative;
2018-05-22 08:04:46 +02:00
2018-06-06 22:05:18 +02:00
&::before {
background-color: $black;
border-radius: 50%;
content: "";
2018-06-06 22:05:18 +02:00
line-height: 0;
position: absolute;
@media (min-width: 901px) {
width: 7px; height: 7px;
top: 14px; left: -1.05rem;
}
@media (max-width: 900px) {
width: 6px; height: 6px;
top: 11px; left: -0.95rem;
}
2018-06-06 22:05:18 +02:00
}
}
.blog-post__title {
line-height: 1.33;
&::after {
content: "";
display: block;
2018-05-22 08:04:46 +02:00
}
}
.blog-post__meta {
font-size: 80%;
line-height: 1;
margin-bottom: 1rem;
}
.blog-post__meta__author {
&::before {
content: "by";
2018-06-06 22:05:18 +02:00
@media (min-width: 901px) {
left: -1.2rem;
}
@media (max-width: 900px) {
left: -1rem;
}
}
}
.blog-post__meta__date {
2018-06-06 22:05:18 +02:00
@media (min-width: 901px) {
margin-right: 1.4rem;
margin-left: 3.1rem;
}
@media (max-width: 900px) {
margin-right: 1.2rem;
margin-left: 2.6rem;
}
&::before {
content: "posted";
2018-06-06 22:05:18 +02:00
@media (min-width: 901px) {
left: -3.1rem;
}
@media (max-width: 900px) {
left: -2.6rem;
}
}
}
.blog-post__meta__author,
.blog-post__meta__date {
display: inline-block;
position: relative;
&::before {
color: rgba($black, 0.5);
font-style: italic;
position: absolute;
vertical-align: bottom;
}
}
}