DebaucheryLibrarian/traxxx
2
1
Fork 1
Code Issues 39 Pull Requests 1 Releases Wiki Activity

Preserving aspect ratio on release tiles.

Browse Source
This commit is contained in:
ThePendulum
2020-04-27 04:00:16 +02:00
parent f684923a8a
commit 79c7847f1c
5 changed files with 147 additions and 141 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
assets/components/releases/releases.vue
View File

@@ -76,7 +76,7 @@ export default {
.tiles {
width: 100%;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(20rem, .25fr));
grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr));
grid-gap: 1rem;
}
@@ -85,21 +85,15 @@ export default {
font-weight: bold;
}
@media(max-width: $breakpoint4) {
.tiles {
grid-template-columns: repeat(auto-fit, minmax(20rem, .33fr));
}
}
@media(max-width: $breakpoint3) {
.tiles {
grid-template-columns: repeat(auto-fit, minmax(20rem, .5fr));
grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
}
}
@media(max-width: $breakpoint) {
@media(max-width: $breakpoint2) {
.tiles {
grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
}
}
</style>