Finish share button and added gallery buttons

This commit is contained in:
2026-07-02 11:40:38 +02:00
parent 9f7104fcf3
commit ca7799d1f3
6 changed files with 219 additions and 27 deletions

View File

@@ -123,6 +123,8 @@
</a>
@endauth
<x-share-rhpz-url :entry="$news" />
</div>
</div>
</div>
@@ -134,25 +136,57 @@
{!! $news->description_html !!}
</div>
@endif
@if( $news->gallery->isNotEmpty() )
<div x-data="{ open: false, currentImage: ''}" x-cloak>
<x-entry-section-title label="Gallery" icon="images"/>
<div class="entry-gallery">
@foreach( $news->gallery as $galleryItem )
<div class="entry-gallery-item"
@click="currentImage = '{{ Storage::url($galleryItem->image) }}'; open = true; "><img
src="{{ Storage::url($galleryItem->image) }}"></div>
@endforeach
</div>
<div class="gallery-modal" x-show="open" x-transition.opacity.duration.300ms @click="open = false"
@keydown.escape.window="open = false">
<span class="gallery-modal-close" @click="open = false;"><i data-lucide="x"></i></span>
<div class="gallery-modal-content" @click.stop>
<img :src="currentImage">
{{-- Gallery --}}
@if( $news->gallery->isNotEmpty() )
<div x-data="{
images: [
@foreach( $news->gallery as $galleryItem )
'{{ Storage::url($galleryItem->image) }}',
@endforeach
],
currentIndex: 0,
open: false,
get currentImage() { return this.images[this.currentIndex]; },
get hasPrev() { return this.currentIndex > 0; },
get hasNext() { return this.currentIndex < this.images.length - 1; },
openAt(index) { this.currentIndex = index; this.open = true; },
prev() { if (this.hasPrev) this.currentIndex--; },
next() { if (this.hasNext) this.currentIndex++; }
}" x-cloak>
<x-entry-section-title label="Gallery" icon="images"/>
<div class="entry-gallery">
@foreach( $news->gallery as $galleryItem )
<div class="entry-gallery-item" @click="openAt({{ $loop->index }})">
<img src="{{ Storage::url($galleryItem->image) }}">
</div>
@endforeach
</div>
<div class="gallery-modal" x-show="open" x-transition.opacity.duration.300ms @click="open = false"
@keydown.escape.window="open = false"
@keydown.arrow-left.window="prev()"
@keydown.arrow-right.window="next()"
x-cloak>
<span class="gallery-modal-close" @click="open = false;"><i data-lucide="x"></i></span>
<span class="gallery-modal-arrow gallery-modal-arrow-prev" x-show="hasPrev" @click.stop="prev()">
<i data-lucide="chevron-left"></i>
</span>
<div class="gallery-modal-content" @click.stop>
<img :src="currentImage">
</div>
<span class="gallery-modal-arrow gallery-modal-arrow-next" x-show="hasNext" @click.stop="next()">
<i data-lucide="chevron-right"></i>
</span>
</div>
</div>
</div>
@endif
@endif
{{-- End gallery --}}
</div>
@if( $news->entry()->exists() || $news->relevant_link || $news->youtube_link )
<aside class="news-sidebar">