Compare commits
2 Commits
b4f8a42e05
...
a25500bb91
| Author | SHA1 | Date | |
|---|---|---|---|
| a25500bb91 | |||
| c3e05b44ea |
@@ -6,13 +6,13 @@ const pb = await authPB()
|
|||||||
|
|
||||||
<div class="swiper-slide flex flex-col md:flex-row items-center justify-center">
|
<div class="swiper-slide flex flex-col md:flex-row items-center justify-center">
|
||||||
<a class="b1-no-underline" href={`/albums/${encodeURI(a.title)}`}>
|
<a class="b1-no-underline" href={`/albums/${encodeURI(a.title)}`}>
|
||||||
<h1 class="flex-2 text-center pb-0 md:flex-1">{a.title}</h1>
|
<h1 class="text-center pb-0 md:flex-1">{a.title}</h1>
|
||||||
<p class="flex-2 text-center md:flex-1">{a.date}</p>
|
<p class="text-center">{a.date}</p>
|
||||||
<img
|
<img
|
||||||
src={pb.files.getURL(a, a.images[0])}
|
src={pb.files.getURL(a, a.images[0])}
|
||||||
class="flex-1 md:flex-2 w-full h-full object-contain"
|
class="w-full h-full object-contain"
|
||||||
loading="lazy"
|
loading="lazy"
|
||||||
alt={a.title}
|
alt={a.title}
|
||||||
/>
|
/>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
@@ -4,10 +4,10 @@ const links = [
|
|||||||
txt: 'now',
|
txt: 'now',
|
||||||
lnk: '/now'
|
lnk: '/now'
|
||||||
},
|
},
|
||||||
{
|
// {
|
||||||
txt: 'photos',
|
// txt: 'photos',
|
||||||
lnk: '/photos'
|
// lnk: '/photos'
|
||||||
},
|
// },
|
||||||
{
|
{
|
||||||
txt: 'albums',
|
txt: 'albums',
|
||||||
lnk: '/albums'
|
lnk: '/albums'
|
||||||
|
|||||||
@@ -38,15 +38,6 @@ const photoLinks = await Promise.all(
|
|||||||
currentPosIndicator.innerText = '1';
|
currentPosIndicator.innerText = '1';
|
||||||
}
|
}
|
||||||
|
|
||||||
function preloadImages() {
|
|
||||||
photoLinks.forEach((url: string) => {
|
|
||||||
const preloadImg = new Image();
|
|
||||||
preloadImg.src = url;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Call preload on page load
|
|
||||||
preloadImages();
|
|
||||||
|
|
||||||
const swiper = new Swiper('.swiper', {
|
const swiper = new Swiper('.swiper', {
|
||||||
modules: [Navigation, Keyboard, EffectFade],
|
modules: [Navigation, Keyboard, EffectFade],
|
||||||
|
|||||||
@@ -11,7 +11,7 @@ const images = await Promise.all(
|
|||||||
)
|
)
|
||||||
---
|
---
|
||||||
|
|
||||||
<Base>
|
<Base meta={{title: "album", description: album.title, ogImage: images[0]}}>
|
||||||
|
|
||||||
<div slot="sidebar">
|
<div slot="sidebar">
|
||||||
<h1>{album.title}</h1>
|
<h1>{album.title}</h1>
|
||||||
|
|||||||
@@ -31,14 +31,16 @@ const albums = await pb.collection('albums').getFullList({
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<Base>
|
<Base meta={{title: "albums"}}>
|
||||||
<div slot="sidebar" class="text-left">
|
<div slot="sidebar">
|
||||||
More focused photo albums. These are more single-purpose collections of photos compared to the general images of <a href="/photos">photos.</a> Best viewed on a large screen!
|
<p class="text-left"> More focused, themed collections of photos compared to the more miscellaneous images of the (now defunct) <a href="/photos">photos page.</a> Best viewed on a large screen!</p>
|
||||||
|
<!-- <br>
|
||||||
|
← / → -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div slot="content">
|
<div slot="content">
|
||||||
<div class="swiper-album w-full h-[90vh] overflow-hidden">
|
<div class=" w-full">
|
||||||
<div class="swiper-wrapper">
|
<div class="">
|
||||||
{ albums.map(a => <AlbumCard a={a}/> ) }
|
{ albums.map(a => <AlbumCard a={a}/> ) }
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user