einundzwanzig/einundzwanzig-portal
1
0
Fork 0
mirror of https://github.com/Einundzwanzig-Podcast/einundzwanzig-portal.git synced 2025-12-11 06:46:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

meetup landing page

Browse Source
This commit is contained in:
Benjamin Takats
2023-01-16 16:00:49 +01:00
parent 5a0428fe61
commit 6dd898e6d2
11 changed files with 283 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

106
resources/views/livewire/meetup/landing-page.blade.php
View File

@@ -16,13 +16,34 @@
</x-markdown>
</div>
<x-button
target="_blank"
:href="$meetup->link"
primary lg class="mt-4 whitespace-nowrap">
<i class="fa fa-thin fa-external-link mr-2"></i>
{{ __('Link') }}
</x-button>
@if($meetup->telegram_link)
<x-button
target="_blank"
:href="$meetup->telegram_link"
primary lg class="mt-4 whitespace-nowrap">
<i class="fa fa-thin fa-external-link mr-2"></i>
{{ __('Telegram-Link') }}
</x-button>
@endif
@if($meetup->webpage)
<x-button
target="_blank"
:href="$meetup->webpage"
primary lg class="mt-4 whitespace-nowrap">
<i class="fa fa-thin fa-external-link mr-2"></i>
{{ __('Website') }}
</x-button>
@endif
@if($meetup->twitter_username)
<x-button
target="_blank"
:href="'https://twitter.com/'.$meetup->twitter_username"
primary lg class="mt-4 whitespace-nowrap">
<i class="fa fa-thin fa-external-link mr-2"></i>
{{ __('Twitter') }}
</x-button>
@endif
</div>
<div class="sm:w-2/12 p-4">
@@ -31,6 +52,71 @@
</div>
</div>
<section class="h-auto px-10 py-16">
<div class="max-w-3xl mx-auto space-y-4 sm:text-center">
<h2 class="text-4xl sm:text-5xl font-semibold text-white">
{{ __('Events') }}
</h2>
</div>
</section>
<ul role="list" class="grid grid-cols-1 gap-6 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4">
@foreach($meetupEvents as $meetupEvent)
@php
$activeClass = $activeEvent === $meetupEvent->id ? 'bg-gradient-to-r from-amber-800 via-amber-600 to-amber-500' : 'bg-amber-500';
@endphp
<li id="courseEventId_{{ $meetupEvent->id }}" class="{{ $activeClass }} col-span-1 flex flex-col divide-y divide-gray-200 rounded-lg text-center shadow-2xl">
<div class="flex flex-1 flex-col p-8">
{{--<img class="mx-auto h-32 w-32 object-contain flex-shrink-0 rounded"
src="{{ $meetupEvent->meetup->getFirstMediaUrl('logo') }}"
alt="{{ $meetupEvent->meetup->name }}">--}}
<h3 class="mt-1 text-xl font-medium text-gray-900 truncate">{{ $meetupEvent->start->asDate() }}</h3>
<h3 class="mt-1 text-xl font-medium text-gray-900 truncate">{{ $meetupEvent->location }}</h3>
<dl class="mt-1 flex flex-grow flex-col justify-between">
<div x-data="{ active: 2 }" class="mx-auto max-w-3xl w-full space-y-4">
<div x-data="{
id: 1,
get expanded() {
return this.active === this.id
},
set expanded(value) {
this.active = value ? this.id : null
},
}"
role="region" class="rounded-lg bg-white shadow">
<h2>
<button
x-on:click="expanded = !expanded"
:aria-expanded="expanded"
class="flex w-full items-center justify-between px-6 py-4 text-xl font-bold"
>
<span>{{ __('Description') }}</span>
<span x-show="expanded" aria-hidden="true" class="ml-4">&minus;</span>
<span x-show="!expanded" aria-hidden="true" class="ml-4">&plus;</span>
</button>
</h2>
<div x-show="expanded" x-collapse>
<div class="px-6 pb-4 text-left">{!! nl2br($meetupEvent->description) !!}</div>
</div>
</div>
</div>
</dl>
</div>
<div>
<div class="-mt-px flex divide-x divide-gray-200">
<div class="-ml-px flex w-0 flex-1">
<a target="_blank" href="{{ $meetupEvent->link }}"
class="relative inline-flex w-0 flex-1 items-center justify-center rounded-br-lg border border-transparent py-4 text-sm font-medium text-gray-700 hover:text-gray-500">
<i class="text-gray-100 text-2xl fa-thin fa-right-to-bracket"></i>
<span class="ml-3 text-gray-100 text-2xl">{{ __('Link') }}</span>
</a>
</div>
</div>
</div>
</li>
@endforeach
</ul>
<div class="w-full mt-8">
@php
@@ -83,6 +169,12 @@
yearChanged: function(e) {
@this.set('year', e.currentYear);
},
clickDay: function(e) {
if(e.events.length > 0) {
$wire.call('showEvent', e.events[0].id);
document.getElementById('courseEventId_'+e.events[0].id).scrollIntoView();
}
},
});
},
}"