1
0
Fork 0
blog/src/components/molecules/RelatedPosts.module.scss

67 lines
881 B
SCSS

@import 'variables';
@import 'mixins';
.title {
font-size: $font-size-h3;
margin-bottom: $spacer * $line-height;
}
.relatedPosts {
margin-top: -($spacer * 2);
margin-bottom: $spacer;
@media (min-width: $screen-md) {
@include breakoutviewport;
}
ul {
display: grid;
gap: $spacer;
grid-template-columns: repeat(2, 1fr);
padding: 0;
margin: 0;
@media (min-width: $screen-sm) {
grid-template-columns: repeat(3, 1fr);
}
}
li {
display: block;
margin: 0;
&::before {
display: none;
}
}
img {
margin-bottom: 0;
}
a {
display: block;
> div {
margin-bottom: 0;
}
h4 {
color: $text-color-light;
}
&:hover,
&:focus {
h4 {
color: $link-color;
}
}
}
}
.button {
margin: auto;
display: block;
margin-top: $spacer * 2;
}