frontend: lazy load posts images

Signed-off-by: Nicolas Froger <nicolas@kektus.xyz>
This commit is contained in:
Nicolas Froger 2024-07-25 12:48:01 +02:00
commit 3da3b6491b
No known key found for this signature in database

View file

@ -59,7 +59,7 @@ function postDataToggle() {
<template>
<div class="section relative overflow-hidden" ref="section" :data-anchor="'post-' + post.id">
<div class="slide relative overflow-hidden" v-for="asset in post.assets" :key="asset">
<img class="absolute top-0 left-0 w-full h-full object-cover -z-10" :src="asset" />
<img class="absolute top-0 left-0 w-full h-full object-cover -z-10" :data-src="asset" />
<div class="grid grid-cols-3 grid-rows-5 absolute w-full h-full top-0 left-0 pointer-events-none">
<div ref="postData" class="col-start-1 col-span-3 lg:col-span-1 row-start-4 row-span-2 self-end place-self-stretch m-6 p-2 bg-gray-400/10 backdrop-blur-sm rounded-lg pointer-events-auto transition-colors duration-500">
<div class="absolute top-0 right-0 m-2 p-2 backdrop-blur-sm rounded-sm bg-black/10 hover:bg-black/20 cursor-pointer transition-colors duration-200 opacity-100" ref="postActionBtn" @click="postDataToggle">