mirror of
https://github.com/HolgerHatGarKeineNode/einundzwanzig-nostr.git
synced 2026-01-27 06:33:18 +00:00
🛠️ Refactor Blade templates: improve formatting, streamline HTML structure, and update modal implementation for better maintainability.
This commit is contained in:
HolgerHatGarKeineNode
@@ -19,111 +19,109 @@
|
||||
|
||||
@if($shouldDisplay)
|
||||
|
||||
<article
|
||||
wire:key="project_{{ $project->id }}"
|
||||
wire:key="project_{{ $project->id }}"
|
||||
<flux:card class="flex overflow-hidden">
|
||||
@if(!$project->sats_paid)
|
||||
<a class="relative block w-24 sm:w-56 xl:sidebar-expanded:w-40 2xl:sidebar-expanded:w-56 shrink-0"
|
||||
href="{{ route('association.projectSupport.item', ['projectProposal' => $project]) }}">
|
||||
<img class="absolute object-cover object-center w-full h-full"
|
||||
src="{{ $project->getFirstMediaUrl('main') }}" alt="Meetup 01">
|
||||
<button class="absolute top-0 right-0 mt-4 mr-4">
|
||||
<img class="rounded-full h-8 w-8"
|
||||
src="{{ $project->einundzwanzigPleb->profile?->picture ?? asset('einundzwanzig-alpha.jpg') }}"
|
||||
alt="">
|
||||
</button>
|
||||
</a>
|
||||
@else
|
||||
<div
|
||||
class="relative block w-24 sm:w-56 xl:sidebar-expanded:w-40 2xl:sidebar-expanded:w-56 shrink-0"
|
||||
href="{{ route('association.projectSupport.item', ['projectProposal' => $project]) }}">
|
||||
<img class="absolute object-cover object-center w-full h-full"
|
||||
src="{{ $project->getFirstMediaUrl('main') }}" alt="Meetup 01">
|
||||
<button class="absolute top-0 right-0 mt-4 mr-4">
|
||||
<img class="rounded-full h-8 w-8"
|
||||
src="{{ $project->einundzwanzigPleb->profile?->picture ?? asset('einundzwanzig-alpha.jpg') }}"
|
||||
alt="">
|
||||
</button>
|
||||
</div>
|
||||
@endif
|
||||
<!-- Content -->
|
||||
<div class="grow p-5 flex flex-col">
|
||||
<div class="grow">
|
||||
<div class="text-sm font-semibold text-amber-500 uppercase mb-2">
|
||||
Eingereicht von: {{ $project->einundzwanzigPleb->profile?->name ?? str($project->einundzwanzigPleb->npub)->limit(32) }}
|
||||
</div>
|
||||
<div class="inline-flex mb-2">
|
||||
<h3 class="text-lg font-bold text-gray-800 dark:text-gray-100">
|
||||
{{ $project->name }}
|
||||
</h3>
|
||||
</div>
|
||||
<div class="text-sm line-clamp-1 sm:line-clamp-3">
|
||||
{!! strip_tags($project->description) !!}
|
||||
</div>
|
||||
</div>
|
||||
<!-- Footer -->
|
||||
<div class="flex justify-between items-center mt-3">
|
||||
<!-- Tag -->
|
||||
<flux:card class="flex overflow-hidden" wire:key="project_{{ $project->id }}">
|
||||
@if(!$project->sats_paid)
|
||||
<a class="relative block w-24 sm:w-56 xl:sidebar-expanded:w-40 2xl:sidebar-expanded:w-56 shrink-0"
|
||||
href="{{ route('association.projectSupport.item', ['projectProposal' => $project]) }}">
|
||||
<img class="absolute object-cover object-center w-full h-full"
|
||||
src="{{ $project->getFirstMediaUrl('main') }}" alt="Meetup 01">
|
||||
<button class="absolute top-0 right-0 mt-4 mr-4">
|
||||
<img class="rounded-full h-8 w-8"
|
||||
src="{{ $project->einundzwanzigPleb->profile?->picture ?? asset('einundzwanzig-alpha.jpg') }}"
|
||||
alt="">
|
||||
</button>
|
||||
</a>
|
||||
@else
|
||||
<div
|
||||
class="text-xs inline-flex items-center font-bold border border-gray-200 dark:border-gray-700/60 text-gray-600 dark:text-gray-200 rounded-full text-center px-2.5 py-1">
|
||||
<span>{{ number_format($project->support_in_sats, 0, ',', '.') }} Sats</span>
|
||||
class="relative block w-24 sm:w-56 xl:sidebar-expanded:w-40 2xl:sidebar-expanded:w-56 shrink-0"
|
||||
href="{{ route('association.projectSupport.item', ['projectProposal' => $project]) }}">
|
||||
<img class="absolute object-cover object-center w-full h-full"
|
||||
src="{{ $project->getFirstMediaUrl('main') }}" alt="Meetup 01">
|
||||
<button class="absolute top-0 right-0 mt-4 mr-4">
|
||||
<img class="rounded-full h-8 w-8"
|
||||
src="{{ $project->einundzwanzigPleb->profile?->picture ?? asset('einundzwanzig-alpha.jpg') }}"
|
||||
alt="">
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="text-xs inline-flex items-center font-bold border border-gray-200 dark:border-gray-700/60 text-gray-600 dark:text-gray-200 rounded-full text-center px-2.5 py-1">
|
||||
<a href="{{ $project->website }}" target="_blank">Webseite</a>
|
||||
</div>
|
||||
<!-- Avatars -->
|
||||
@if($project->votes->where('value', true)->count() > 0)
|
||||
<div class="hidden sm:flex items-center space-x-2">
|
||||
<div class="text-xs font-medium text-gray-400 dark:text-gray-300 italic">
|
||||
Anzahl der Unterstützer:
|
||||
+{{ $project->votes->where('value', true)->count() }}
|
||||
</div>
|
||||
@endif
|
||||
<!-- Content -->
|
||||
<div class="grow p-5 flex flex-col">
|
||||
<div class="grow">
|
||||
<div class="text-sm font-semibold text-amber-500 uppercase mb-2">
|
||||
Eingereicht
|
||||
von: {{ $project->einundzwanzigPleb->profile?->name ?? str($project->einundzwanzigPleb->npub)->limit(32) }}
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
<div
|
||||
class="flex flex-col sm:flex-row justify-between items-center mt-3 space-y-2 sm:space-y-0">
|
||||
@if(
|
||||
($currentPleb && $currentPleb->id === $project->einundzwanzig_pleb_id)
|
||||
|| ($currentPleb && in_array($currentPleb->npub, config('einundzwanzig.config.current_board'), true))
|
||||
)
|
||||
<flux:modal.trigger name="delete-project">
|
||||
<flux:button
|
||||
icon="trash"
|
||||
xs
|
||||
negative
|
||||
wire:loading.attr="disabled">
|
||||
Löschen
|
||||
</flux:button>
|
||||
</flux:modal.trigger>
|
||||
<flux:button
|
||||
icon="pencil"
|
||||
xs
|
||||
secondary
|
||||
:href="route('association.projectSupport.edit', ['projectProposal' => $project])">
|
||||
Editieren
|
||||
</flux:button>
|
||||
@endif
|
||||
@if(($currentPleb && $currentPleb->association_status->value > 2) || $project->accepted)
|
||||
<flux:button
|
||||
icon="folder-open"
|
||||
xs
|
||||
:href="route('association.projectSupport.item', ['projectProposal' => $project])">
|
||||
Öffnen
|
||||
</flux:button>
|
||||
@endif
|
||||
</div>
|
||||
<div class="py-2">
|
||||
@if($project->sats_paid)
|
||||
<div class="inline-flex mb-2">
|
||||
<h3 class="text-lg font-bold text-gray-800 dark:text-gray-100">
|
||||
{{ $project->name }}
|
||||
</h3>
|
||||
</div>
|
||||
<div class="text-sm line-clamp-1 sm:line-clamp-3">
|
||||
{!! strip_tags($project->description) !!}
|
||||
</div>
|
||||
</div>
|
||||
<!-- Footer -->
|
||||
<div class="flex justify-between items-center mt-3">
|
||||
<!-- Tag -->
|
||||
<div
|
||||
class="text-sm inline-flex font-medium bg-green-500/20 text-green-700 rounded-full text-center px-2.5 py-1">
|
||||
Wurde mit {{ number_format($project->sats_paid, 0, ',', '.') }} Sats
|
||||
unterstützt
|
||||
class="text-xs inline-flex items-center font-bold border border-gray-200 dark:border-gray-700/60 text-gray-600 dark:text-gray-200 rounded-full text-center px-2.5 py-1">
|
||||
<span>{{ number_format($project->support_in_sats, 0, ',', '.') }} Sats</span>
|
||||
</div>
|
||||
@endif
|
||||
<div
|
||||
class="text-xs inline-flex items-center font-bold border border-gray-200 dark:border-gray-700/60 text-gray-600 dark:text-gray-200 rounded-full text-center px-2.5 py-1">
|
||||
<a href="{{ $project->website }}" target="_blank">Webseite</a>
|
||||
</div>
|
||||
<!-- Avatars -->
|
||||
@if($project->votes->where('value', true)->count() > 0)
|
||||
<div class="hidden sm:flex items-center space-x-2">
|
||||
<div class="text-xs font-medium text-gray-400 dark:text-gray-300 italic">
|
||||
Anzahl der Unterstützer:
|
||||
+{{ $project->votes->where('value', true)->count() }}
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
<div
|
||||
class="flex flex-col sm:flex-row justify-between items-center mt-3 space-y-2 sm:space-y-0">
|
||||
@if(
|
||||
($currentPleb && $currentPleb->id === $project->einundzwanzig_pleb_id)
|
||||
|| ($currentPleb && in_array($currentPleb->npub, config('einundzwanzig.config.current_board'), true))
|
||||
)
|
||||
<flux:modal.trigger name="delete-project">
|
||||
<flux:button
|
||||
icon="trash"
|
||||
xs
|
||||
negative
|
||||
wire:loading.attr="disabled">
|
||||
Löschen
|
||||
</flux:button>
|
||||
</flux:modal.trigger>
|
||||
<flux:button
|
||||
icon="pencil"
|
||||
xs
|
||||
secondary
|
||||
:href="route('association.projectSupport.edit', ['projectProposal' => $project])">
|
||||
Editieren
|
||||
</flux:button>
|
||||
@endif
|
||||
@if(($currentPleb && $currentPleb->association_status->value > 2) || $project->accepted)
|
||||
<flux:button
|
||||
icon="folder-open"
|
||||
xs
|
||||
:href="route('association.projectSupport.item', ['projectProposal' => $project])">
|
||||
Öffnen
|
||||
</flux:button>
|
||||
@endif
|
||||
</div>
|
||||
<div class="py-2">
|
||||
@if($project->sats_paid)
|
||||
<div
|
||||
class="text-sm inline-flex font-medium bg-green-500/20 text-green-700 rounded-full text-center px-2.5 py-1">
|
||||
Wurde mit {{ number_format($project->sats_paid, 0, ',', '.') }} Sats
|
||||
unterstützt
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</flux:card>
|
||||
@endif
|
||||
|
||||
@@ -23,7 +23,7 @@
|
||||
<body class="min-h-screen bg-white dark:bg-zinc-800 antialiased"
|
||||
x-data="nostrLogin"
|
||||
>
|
||||
<flux:header container class="bg-zinc-50 dark:bg-zinc-900 border-b border-zinc-200 dark:border-zinc-700">
|
||||
<flux:header class="bg-zinc-50 dark:bg-zinc-900 border-b border-zinc-200 dark:border-zinc-700">
|
||||
<flux:sidebar.toggle class="lg:hidden" icon="bars-2" inset="left" />
|
||||
|
||||
<flux:brand href="/" name="Einundzwanzig" class="max-lg:hidden dark:hidden">
|
||||
@@ -116,7 +116,7 @@
|
||||
</flux:sidebar.nav>
|
||||
</flux:sidebar>
|
||||
|
||||
<flux:main container>
|
||||
<flux:main>
|
||||
{{ $slot }}
|
||||
</flux:main>
|
||||
|
||||
|
||||
@@ -166,24 +166,25 @@ new class extends Component {
|
||||
<x-project-card :project="$project" :currentPleb="$currentPleb" :section="$activeFilter"/>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
<!-- Confirmation modal -->
|
||||
<flux:modal name="delete-project" class="min-w-88">
|
||||
<div class="space-y-6">
|
||||
<div>
|
||||
<flux:heading size="lg">Projektunterstützung löschen</flux:heading>
|
||||
<flux:text class="mt-2">
|
||||
<p>Bist du sicher, dass du diese Projektunterstützung löschen möchtest?</p>
|
||||
<p>Diese Aktion kann nicht rückgängig gemacht werden.</p>
|
||||
</flux:text>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<flux:spacer/>
|
||||
<flux:modal.close>
|
||||
<flux:button variant="ghost">Abbrechen</flux:button>
|
||||
</flux:modal.close>
|
||||
<flux:button type="submit" wire:click="delete" variant="danger">Ja, löschen</flux:button>
|
||||
</div>
|
||||
</div>
|
||||
</flux:modal>
|
||||
</div>
|
||||
<!-- Confirmation modal -->
|
||||
<flux:modal name="delete-project" class="min-w-88">
|
||||
<div class="space-y-6">
|
||||
<div>
|
||||
<flux:heading size="lg">Projektunterstützung löschen</flux:heading>
|
||||
<flux:text class="mt-2">
|
||||
<p>Bist du sicher, dass du diese Projektunterstützung löschen möchtest?</p>
|
||||
<p>Diese Aktion kann nicht rückgängig gemacht werden.</p>
|
||||
</flux:text>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<flux:spacer/>
|
||||
<flux:modal.close>
|
||||
<flux:button variant="ghost">Abbrechen</flux:button>
|
||||
</flux:modal.close>
|
||||
<flux:button type="submit" wire:click="delete" variant="danger">Ja, löschen</flux:button>
|
||||
</div>
|
||||
</div>
|
||||
</flux:modal>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user