angestoepselt/homepage
5
0
Fork 0
mirror of https://codeberg.org/angestoepselt/homepage.git synced 2025-05-24 14:46:16 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix mobile view for post list

Browse source
This commit is contained in:
Yannik Rödel 2022-06-15 15:45:29 +02:00
parent a3724e60a3
commit 8711307216
1 changed files with 17 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
styles/components/_markup.scss
View file

@ -208,21 +208,27 @@ ul.link-grid {
.post-list { .post-list {
@extend %content-gutter; @extend %content-gutter;
display: grid;
grid-template-columns: 1fr 1fr;
gap: layout.$normal-gap;
margin-top: layout.$huge-gap; margin-top: layout.$huge-gap;
margin-bottom: layout.$huge-gap; margin-bottom: layout.$huge-gap;
@media screen and (min-width: layout.$breakpoint) {
display: grid;
grid-template-columns: 1fr 1fr;
gap: layout.$normal-gap;
}
} }
:any-link.post-card { :any-link.post-card {
display: inline-block; display: inline-block;
padding-left: layout.$normal-gap;
padding-right: layout.$normal-gap;
text-decoration: none; text-decoration: none;
transition: background-color motion.$subtle, color motion.$subtle, transition: background-color motion.$subtle, color motion.$subtle,
box-shadow motion.$subtle; box-shadow motion.$subtle;
@media screen and (min-width: layout.$breakpoint) {
padding-left: layout.$normal-gap;
padding-right: layout.$normal-gap;
}
&:hover { &:hover {
@include colors.card-shadow; @include colors.card-shadow;
background-color: colors.$yellow-300; background-color: colors.$yellow-300;
@ -233,6 +239,12 @@ ul.link-grid {
} }
} }
> h2,
> p {
margin-left: 0;
margin-right: 0;
}
> h2 { > h2 {
@extend %subheading; @extend %subheading;