Make grids reflow on narrow displays
All checks were successful
continuous-integration/drone/pr Build is passing
All checks were successful
continuous-integration/drone/pr Build is passing
This commit is contained in:
parent
68f4f97271
commit
1b638ab7ad
|
@ -234,6 +234,11 @@ aside > footer img:hover {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: max-content 1fr;
|
grid-template-columns: max-content 1fr;
|
||||||
|
|
||||||
|
@media(max-width: 700px) {
|
||||||
|
grid-template-columns: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
align-items: start;
|
align-items: start;
|
||||||
gap: 20px;
|
gap: 20px;
|
||||||
dt {
|
dt {
|
||||||
|
@ -293,6 +298,23 @@ dl.dl-services,
|
||||||
.badge-status {
|
.badge-status {
|
||||||
margin-bottom: 40px;
|
margin-bottom: 40px;
|
||||||
}
|
}
|
||||||
|
@media(max-width: 700px) {
|
||||||
|
grid-template-columns: min-content auto;
|
||||||
|
.badge-icon {
|
||||||
|
grid-column-start : 1;
|
||||||
|
grid-column-end : 2;
|
||||||
|
}
|
||||||
|
.badge-name {
|
||||||
|
grid-column-start : 2;
|
||||||
|
grid-column-end : 3;
|
||||||
|
|
||||||
|
}
|
||||||
|
.badge-description {
|
||||||
|
grid-column-start : 1;
|
||||||
|
grid-column-end : 3;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -317,6 +339,22 @@ dl.dl-services,
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media(max-width: 700px) {
|
||||||
|
grid-template-columns: min-content auto;
|
||||||
|
.badge-icon {
|
||||||
|
grid-column-start : 1;
|
||||||
|
grid-column-end : 2;
|
||||||
|
}
|
||||||
|
.badge-name {
|
||||||
|
grid-column-start : 2;
|
||||||
|
grid-column-end : 3;
|
||||||
|
|
||||||
|
}
|
||||||
|
.badge-description {
|
||||||
|
grid-column-start : 1;
|
||||||
|
grid-column-end : 3;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.badge-status {
|
.badge-status {
|
||||||
|
|
Loading…
Reference in a new issue