mirror_html/filegator
1
0
Fork 0
mirror of https://github.com/filegator/filegator.git synced 2025-08-08 01:06:31 +02:00
Code Issues Projects Releases Wiki Activity

Fix lazy loading images all being loaded when opening gallery (#534)

Browse Source 
* Fix lazy loading images all being loaded when opening gallery

Because the lazy loaded image didn't have a limited height. Many
images would load anyway because they all fit in the parent box.
Giving them a minimal height with object-cover keeps them looking
good while limiting the amount that is lazy loaded.

* reduce the height to make the minimal images square
This commit is contained in:
Robert-Jan de Dreu
2025-02-25 09:24:58 +01:00
committed by GitHub
parent 58a594dc80
commit ee556f46e9
2 changed files with 6 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/assets/scss/custom.scss
View File

@@ -36,6 +36,11 @@ html, body, #wrapper, #inner, .container {
justify-content: flex-end; justify-content: flex-end;
} }
.image-lazy {
min-height: 150px;
object-fit: cover;
}
@media all and (max-width: 1088px) { @media all and (max-width: 1088px) {
.container { .container {
padding: 20px; padding: 20px;

2
frontend/views/partials/Gallery.vue
View File

@@ -10,7 +10,7 @@
<div v-if="images.length > 1" class="column is-one-fifth sidebox"> <div v-if="images.length > 1" class="column is-one-fifth sidebox">
<ul> <ul>
<li v-for="(image, index) in images" :key="index"> <li v-for="(image, index) in images" :key="index">
<img v-lazy="imageSrc(image.path)" @click="currentItem = image"> <img v-lazy="imageSrc(image.path)" @click="currentItem = image" class="image-lazy">
</li> </li>
</ul> </ul>
</div> </div>