mirrors/Hyperpipe
1
0
Fork 0
mirror of https://codeberg.org/Hyperpipe/Hyperpipe synced 2025-06-27 20:58:01 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

style: Improve responsiveness of Genre buttons grid

Browse source 
- Adjusted the grid template columns in the .btn-grid class for better responsiveness.
- Removed the max-width and grid-auto-rows properties to allow flexible sizing.
- Removed the media query for screens with a maximum width of 600px.
This commit is contained in:
Járedy Alves 2023-11-24 16:17:27 +00:00
parent 9fb1c3b2e1
commit 348bef5562
No known key found for this signature in database
1 changed files with 1 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/Genres.vue
View file

@ -124,10 +124,7 @@ onMounted(get);
}
.btn-grid {
display: grid;
align-self: center;
max-width: 100%;
grid-template-columns: repeat(auto-fill, 8rem);
grid-auto-rows: 1fr;
grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
gap: 0.125rem;
padding: 1rem 0;
}
@ -154,9 +151,4 @@ onMounted(get);
text-align: center;
text-transform: capitalize;
}
@media (max-width: 600px) {
.btn-grid {
grid-template-columns: repeat(3, 1fr);
}
}
</style>