breadone/BreadnetV3
Archived
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix images looking weird on mobile

Browse Source
This commit is contained in:
June
2025-11-18 12:54:27 +13:00
parent b2657962e1
commit bad4457ad7
1 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/src/components/photos/carousel.astro
View File

@@ -73,13 +73,13 @@ const photos = await pb.collection('photos').getFullList({
<!-- Hidden element to pass server data to client --> <!-- Hidden element to pass server data to client -->
<div class="hidden" id="carousel-data">{JSON.stringify(photos)}</div> <div class="hidden" id="carousel-data">{JSON.stringify(photos)}</div>
<div class="swiper w-full md:h-[calc(100vh-7rem)]"> <div class="swiper w-full h-[60vh] md:h-[calc(100vh-7rem)]">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
{photos.map((photo) => ( {photos.map((photo) => (
<div class="swiper-slide flex items-center justify-center"> <div class="swiper-slide flex items-center justify-center">
<img <img
src={pb.files.getURL(photo, photo.image)} src={pb.files.getURL(photo, photo.image)}
class="w-full md:h-[calc(100vh-7rem)] object-contain" class="w-full h-full object-contain"
alt={photo.title || 'Photo'} alt={photo.title || 'Photo'}
/> />
</div> </div>