homepage: fix black box below cards on certain screen sizes
This commit is contained in:
parent
0481fdcf66
commit
c1acb631ff
|
@ -33,5 +33,7 @@
|
||||||
<div class="mi-card--text">{{ card.text }}</div>
|
<div class="mi-card--text">{{ card.text }}</div>
|
||||||
</a>
|
</a>
|
||||||
{{ /for }}
|
{{ /for }}
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
|
<div class="mi-page-filler"></div>
|
||||||
{{ /layout }}
|
{{ /layout }}
|
||||||
|
|
10
styles.css
10
styles.css
|
@ -69,6 +69,13 @@ h4 {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mi-page-filler {
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
flex-basis: 0;
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
|
||||||
.mi-border {
|
.mi-border {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
|
@ -317,7 +324,7 @@ h4 {
|
||||||
.mi-main {
|
.mi-main {
|
||||||
background: var(--background);
|
background: var(--background);
|
||||||
margin: 0 var(--box-padding);
|
margin: 0 var(--box-padding);
|
||||||
flex-grow: 1;
|
flex-grow: 0;
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-bottom: var(--box-padding);
|
margin-bottom: var(--box-padding);
|
||||||
}
|
}
|
||||||
|
@ -346,6 +353,7 @@ h4 {
|
||||||
background: var(--foreground);
|
background: var(--foreground);
|
||||||
grid-gap: 1px;
|
grid-gap: 1px;
|
||||||
grid-template-columns: 1fr;
|
grid-template-columns: 1fr;
|
||||||
|
padding-bottom: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (min-width: 800px) {
|
@media screen and (min-width: 800px) {
|
||||||
|
|
Loading…
Reference in a new issue