mirror/advplyr.audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2025-08-03 17:54:54 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

Add responsive limit for displayed items on personalized shelves on home page

Browse source
This commit is contained in:
Greg Lorenzen 2024-07-14 05:25:56 +00:00 • committed by Greg Lorenzen
parent 43b7ccd61a
commit 618e69775c
1 changed files with 12 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

13
client/components/app/BookShelfCategorized.vue
View file

@ -167,8 +167,19 @@ export default {
this.loaded = true
},
async fetchCategories() {
// Sets the limit for the number of items to be displayed based on the viewport width.
const viewportWidth = window.innerWidth
let limit
if (viewportWidth >= 3240 && viewportWidth <= 3440) {
limit = 15
} else if (viewportWidth >= 2880 && viewportWidth < 3240) {
limit = 12
}
const limitQuery = limit ? `&limit=${limit}` : ''
const categories = await this.$axios
.$get(`/api/libraries/${this.currentLibraryId}/personalized?include=rssfeed,numEpisodesIncomplete,share`)
.$get(`/api/libraries/${this.currentLibraryId}/personalized?include=rssfeed,numEpisodesIncomplete,share${limitQuery}`)
.then((data) => {
return data
})