This commit is contained in:
F4ilji
2026-04-10 10:51:42 +05:00
parent 9e35cf848d
commit 5eb5a7bc06
7 changed files with 174 additions and 39 deletions
@@ -1,5 +1,5 @@
<template>
<div class="relative">
<div v-if="items && items.length > 0" class="relative">
<div class="flex">
<div
v-for="(item, index) in items"
@@ -29,11 +29,11 @@
</button>
</div>
<figcaption class="mt-3 text-sm text-center text-gray-500 dark:text-neutral-500">
<figcaption v-if="block.data.alt" class="mt-3 text-sm text-center text-gray-500 dark:text-neutral-500">
{{ block.data.alt }}
</figcaption>
<FsLightbox class="" :slide="slide" :toggler="toggler" :sources="items.map(item => domainPath + '/storage/' + item)"/>
<FsLightbox v-if="items && items.length > 0" class="" :slide="slide" :toggler="toggler" :sources="items.map(item => domainPath + '/storage/' + item)"/>
</template>
<script>
@@ -45,7 +45,7 @@ export default {
data() {
return {
currentIndex: 0,
items: this.block.data.url,
items: this.block.data.url || [],
toggler: false,
domainPath: null,
slide: null,
@@ -1,25 +1,25 @@
<template>
<div class="relative rounded-md overflow-hidden">
<div v-if="block.data.url" class="relative rounded-md overflow-hidden">
<div
class="absolute inset-0 bg-cover bg-center blur-md brightness-75"
:style="`background-image: url('${'/storage/' + block.data.url}')`"
></div>
<div class="relative z-10 md:m-4"> <img
@click="toggler = !toggler"
loading="lazy"
class="mx-auto h-96 rounded-md object-cover md:object-contain hover:opacity-95 hover:duration-200 transition"
:src="'/storage/' + block.data.url"
alt=""
/>
<div class="relative z-10 md:m-4">
<img
@click="toggler = !toggler"
loading="lazy"
class="mx-auto h-96 rounded-md object-cover md:object-contain hover:opacity-95 hover:duration-200 transition"
:src="'/storage/' + block.data.url"
:alt="block.data.alt || ''"
/>
</div>
</div>
<div v-if="block.data.alt" class="mt-3 text-sm text-center text-gray-500 dark:text-neutral-500">
<div v-if="block.data.url && block.data.alt" class="mt-3 text-sm text-center text-gray-500 dark:text-neutral-500">
{{ block.data.alt }}
</div>
<FsLightbox class="" :toggler="toggler" :sources="[domainPath + '/storage/' + block.data.url]"/>
<FsLightbox v-if="block.data.url" class="" :toggler="toggler" :sources="[domainPath + '/storage/' + block.data.url]"/>
</template>
<script>