STEMMechanics/Website
1
0
Fork 0
Code Issues 4 Pull Requests 1 Actions Packages Projects Releases 3 Wiki Activity

download and close buttons in gallery

Browse Source
This commit is contained in:
James Collins
2024-05-07 08:24:17 +10:00
parent 742da4bf17
commit 391b17c1e7
1 changed files with 4 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
resources/views/components/ui/gallery.blade.php
View File

@@ -23,6 +23,10 @@
<ul class="flex flex-wrap justify-center px-14 mt-2"> <ul class="flex flex-wrap justify-center px-14 mt-2">
<template x-for="(file,index) in $store.gallery" :key="file.name"> <template x-for="(file,index) in $store.gallery" :key="file.name">
<li x-show="$store.modelIndex==index" class="flex items-center justify-center relative"> <li x-show="$store.modelIndex==index" class="flex items-center justify-center relative">
<div class="flex gap-4 px-4 py-1 cursor-pointer z-10 fixed top-4 right-14 transition bg-opacity-0 hover:bg-opacity-80 bg-black rounded items-center">
<a :href="file.url + '?download'" target="_blank" class="cursor-pointer transition text-white text-opacity-80 hover:text-opacity-100 text-2xl" x-on:click.stop><i class="fa-solid fa-download"></i></a>
<div class="cursor-pointer transition text-white text-opacity-80 hover:text-opacity-100 text-3xl" x-on:click.prevent.stop="$store.modelIndex=-1"><i class="fa-solid fa-xmark"></i></div>
</div>
<img class="rounded" :src="file.url + '?scaled'" /> <img class="rounded" :src="file.url + '?scaled'" />
</li> </li>
</template> </template>