mirror of
https://github.com/HolgerHatGarKeineNode/einundzwanzig-nostr.git
synced 2026-01-28 07:43:18 +00:00
🎨 Update color palette: replace gray with zinc across Blade templates for improved design consistency and accessibility.
🛠 Refactor forms: rename NostrAuth method for clarity and enhance Flux button usage for cleaner and reusable components.
✨ Add `WithNostrAuth` trait: refactor `show` template logic, streamline project-support handling, and improve layout readability.
This commit is contained in:
HolgerHatGarKeineNode
@@ -69,7 +69,7 @@ class extends Component
|
||||
<div
|
||||
class="flex flex-col md:flex-row items-center mb-6 space-y-4 md:space-y-0 md:space-x-4">
|
||||
<div class="flex items-center justify-between w-full">
|
||||
<h1 class="text-2xl md:text-3xl text-gray-800 dark:text-gray-100 font-bold">
|
||||
<h1 class="text-2xl md:text-3xl text-zinc-800 dark:text-zinc-100 font-bold">
|
||||
Projektförderung anlegen
|
||||
</h1>
|
||||
</div>
|
||||
@@ -102,7 +102,7 @@ class extends Component
|
||||
|
||||
@if($isAdmin)
|
||||
<flux:separator />
|
||||
<flux:heading level="3" class="text-sm font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400">Admin Felder</flux:heading>
|
||||
<flux:heading level="3" class="text-sm font-semibold uppercase tracking-wide text-zinc-500 dark:text-zinc-400">Admin Felder</flux:heading>
|
||||
<div class="space-y-3 mt-3">
|
||||
<flux:field>
|
||||
<flux:label>Akzeptiert</flux:label>
|
||||
@@ -127,7 +127,7 @@ class extends Component
|
||||
<div>
|
||||
<flux:card>
|
||||
<flux:heading level="2">Information</flux:heading>
|
||||
<p class="text-sm text-gray-800 dark:text-gray-100 mt-4">
|
||||
<p class="text-sm text-zinc-800 dark:text-zinc-100 mt-4">
|
||||
Fülle das Formular aus, um eine neue Projektförderung anzulegen.
|
||||
</p>
|
||||
</flux:card>
|
||||
|
||||
@@ -87,7 +87,7 @@ class extends Component
|
||||
<div
|
||||
class="flex flex-col md:flex-row items-center mb-6 space-y-4 md:space-y-0 md:space-x-4">
|
||||
<div class="flex items-center justify-between w-full">
|
||||
<h1 class="text-2xl md:text-3xl text-gray-800 dark:text-gray-100 font-bold">
|
||||
<h1 class="text-2xl md:text-3xl text-zinc-800 dark:text-zinc-100 font-bold">
|
||||
Projektförderung bearbeiten
|
||||
</h1>
|
||||
</div>
|
||||
@@ -128,7 +128,7 @@ class extends Component
|
||||
|
||||
@if($isAdmin)
|
||||
<flux:separator />
|
||||
<flux:heading level="3" class="text-sm font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400">Admin Felder</flux:heading>
|
||||
<flux:heading level="3" class="text-sm font-semibold uppercase tracking-wide text-zinc-500 dark:text-zinc-400">Admin Felder</flux:heading>
|
||||
<div class="space-y-3 mt-3">
|
||||
<flux:field>
|
||||
<flux:label>Akzeptiert</flux:label>
|
||||
@@ -153,7 +153,7 @@ class extends Component
|
||||
<div>
|
||||
<flux:card>
|
||||
<flux:heading level="2">Information</flux:heading>
|
||||
<p class="text-sm text-gray-800 dark:text-gray-100 mt-4">
|
||||
<p class="text-sm text-zinc-800 dark:text-zinc-100 mt-4">
|
||||
Bearbeite die Projektförderung und speichere deine Änderungen.
|
||||
</p>
|
||||
</flux:card>
|
||||
|
||||
@@ -96,7 +96,7 @@ new class extends Component {
|
||||
|
||||
<!-- Left: Title -->
|
||||
<div class="mb-4 sm:mb-0">
|
||||
<h1 class="text-2xl md:text-3xl text-gray-800 dark:text-gray-100 font-bold">
|
||||
<h1 class="text-2xl md:text-3xl text-zinc-800 dark:text-zinc-100 font-bold">
|
||||
Einundzwanzig Projektunterstützungen
|
||||
</h1>
|
||||
</div>
|
||||
@@ -124,32 +124,28 @@ new class extends Component {
|
||||
<div class="mb-5">
|
||||
<ul class="flex flex-wrap -m-1">
|
||||
<li class="m-1">
|
||||
<button wire:click="setFilter('all')"
|
||||
class="inline-flex items-center justify-center text-sm font-medium leading-5 rounded-full px-3 py-1 border @if($activeFilter === 'all') border-transparent shadow-sm bg-gray-900 dark:bg-gray-100 text-white dark:text-gray-800 @else border-gray-200 dark:border-gray-700/60 hover:border-gray-300 dark:hover:border-gray-600 shadow-sm bg-white dark:bg-gray-800 text-gray-500 dark:text-gray-400 @endif transition">
|
||||
<flux:button wire:click="setFilter('all')" :variant="$activeFilter === 'all' ? 'primary' : 'ghost'">
|
||||
Alle
|
||||
</button>
|
||||
</flux:button>
|
||||
</li>
|
||||
<li class="m-1">
|
||||
<button wire:click="setFilter('new')"
|
||||
class="inline-flex items-center justify-center text-sm font-medium leading-5 rounded-full px-3 py-1 border @if($activeFilter === 'new') border-transparent shadow-sm bg-gray-900 dark:bg-gray-100 text-white dark:text-gray-800 @else border-gray-200 dark:border-gray-700/60 hover:border-gray-300 dark:hover:border-gray-600 shadow-sm bg-white dark:bg-gray-800 text-gray-500 dark:text-gray-400 @endif transition">
|
||||
<flux:button wire:click="setFilter('new')" :variant="$activeFilter === 'new' ? 'primary' : 'ghost'">
|
||||
Neu
|
||||
</button>
|
||||
</flux:button>
|
||||
</li>
|
||||
<li class="m-1">
|
||||
<button wire:click="setFilter('supported')"
|
||||
class="inline-flex items-center justify-center text-sm font-medium leading-5 rounded-full px-3 py-1 border @if($activeFilter === 'supported') border-transparent shadow-sm bg-gray-900 dark:bg-gray-100 text-white dark:text-gray-800 @else border-gray-200 dark:border-gray-700/60 hover:border-gray-300 dark:hover:border-gray-600 shadow-sm bg-white dark:bg-gray-800 text-gray-500 dark:text-gray-400 @endif transition">
|
||||
<flux:button wire:click="setFilter('supported')" :variant="$activeFilter === 'supported' ? 'primary' : 'ghost'">
|
||||
Unterstützt
|
||||
</button>
|
||||
</flux:button>
|
||||
</li>
|
||||
<li class="m-1">
|
||||
<button wire:click="setFilter('rejected')"
|
||||
class="inline-flex items-center justify-center text-sm font-medium leading-5 rounded-full px-3 py-1 border @if($activeFilter === 'rejected') border-transparent shadow-sm bg-gray-900 dark:bg-gray-100 text-white dark:text-gray-800 @else border-gray-200 dark:border-gray-700/60 hover:border-gray-300 dark:hover:border-gray-600 shadow-sm bg-white dark:bg-gray-800 text-gray-500 dark:text-gray-400 @endif transition">
|
||||
<flux:button wire:click="setFilter('rejected')" :variant="$activeFilter === 'rejected' ? 'primary' : 'ghost'">
|
||||
Abgelehnt
|
||||
</button>
|
||||
</flux:button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="text-sm text-gray-500 dark:text-gray-400 italic mb-4">{{ $projects->count() }} Projekte</div>
|
||||
<div class="text-sm text-zinc-500 dark:text-zinc-400 italic mb-4">{{ $projects->count() }} Projekte</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="grid xl:grid-cols-2 gap-6 mb-8">
|
||||
|
||||
@@ -1,11 +1,13 @@
|
||||
<?php
|
||||
|
||||
use App\Livewire\Forms\VoteForm;
|
||||
use App\Livewire\Traits\WithNostrAuth;
|
||||
use App\Models\Vote;
|
||||
use App\Support\NostrAuth;
|
||||
use Livewire\Component;
|
||||
|
||||
new class extends Component {
|
||||
use WithNostrAuth;
|
||||
|
||||
public $projectProposal;
|
||||
|
||||
public bool $isAllowed = false;
|
||||
@@ -67,120 +69,104 @@ new class extends Component {
|
||||
?>
|
||||
|
||||
<div>
|
||||
@if($projectProposal->accepted || $isAllowed)
|
||||
<div class="px-4 sm:px-6 lg:px-8 py-8 w-full">
|
||||
<div class="mx-auto flex flex-col lg:flex-row lg:space-x-8 xl:space-x-12">
|
||||
<div class="flex-1">
|
||||
<div class="mb-6">
|
||||
<flux:button :href="route('association.projectSupport')" variant="primary" size="sm" icon="chevron-left">
|
||||
Zurück zur Übersicht
|
||||
</flux:button>
|
||||
</div>
|
||||
<div class="text-sm font-semibold text-violet-500 uppercase mb-2">
|
||||
{{ $projectProposal->created_at->translatedFormat('d.m.Y') }}
|
||||
</div>
|
||||
<header class="mb-4">
|
||||
<h1 class="text-2xl md:text-3xl text-gray-800 dark:text-gray-100 font-bold mb-2">
|
||||
{{ $projectProposal->name }}
|
||||
</h1>
|
||||
<x-markdown>
|
||||
{!! $projectProposal->description !!}
|
||||
</x-markdown>
|
||||
</header>
|
||||
<div class="px-4 sm:px-6 lg:px-8 py-8 w-full">
|
||||
<div class="mx-auto flex flex-col lg:flex-row lg:space-x-8 xl:space-x-12">
|
||||
<div class="flex-1">
|
||||
<div class="mb-6">
|
||||
<flux:button :href="route('association.projectSupport')" variant="primary" size="sm"
|
||||
icon="chevron-left">
|
||||
Zurück zur Übersicht
|
||||
</flux:button>
|
||||
</div>
|
||||
<div class="text-sm font-semibold text-violet-500 uppercase mb-2">
|
||||
{{ $projectProposal->created_at->translatedFormat('d.m.Y') }}
|
||||
</div>
|
||||
<header class="mb-4">
|
||||
<h1 class="text-2xl md:text-3xl text-zinc-800 dark:text-zinc-100 font-bold mb-2">
|
||||
{{ $projectProposal->name }}
|
||||
</h1>
|
||||
<x-markdown>
|
||||
{!! $projectProposal->description !!}
|
||||
</x-markdown>
|
||||
</header>
|
||||
|
||||
<div class="space-y-3 sm:flex sm:items-center sm:justify-between sm:space-y-0 mb-6">
|
||||
<div class="flex items-center sm:mr-4">
|
||||
<a class="block mr-2 shrink-0" href="#0">
|
||||
<img class="rounded-full"
|
||||
src="{{ $projectProposal->einundzwanzigPleb->profile?->picture ?? asset('einundzwanzig-alpha.jpg') }}"
|
||||
width="32" height="32" alt="User">
|
||||
</a>
|
||||
<div class="text-sm whitespace-nowrap">Eingereicht von
|
||||
<div class="font-semibold text-gray-800 dark:text-gray-100">
|
||||
{{ $projectProposal->einundzwanzigPleb?->profile->name ?? str($projectProposal->einundzwanzigPleb->npub)->limit(32) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-wrap items-center sm:justify-end space-x-2">
|
||||
<div
|
||||
class="text-xs inline-flex items-center font-medium border border-gray-200 dark:border-gray-700/60 text-gray-600 dark:text-gray-400 rounded-full text-center px-2.5 py-1">
|
||||
<a target="_blank" href="{{ $projectProposal->website }}">Webseite</a>
|
||||
</div>
|
||||
<div
|
||||
class="text-xs inline-flex font-medium uppercase bg-green-500/20 text-green-700 rounded-full text-center px-2.5 py-1">
|
||||
{{ number_format($projectProposal->support_in_sats, 0, ',', '.') }} Sats
|
||||
<div class="space-y-3 sm:flex sm:items-center sm:justify-between sm:space-y-0 mb-6">
|
||||
<div class="flex items-center sm:mr-4">
|
||||
<a class="block mr-2 shrink-0" href="#0">
|
||||
<img class="rounded-full"
|
||||
src="{{ $projectProposal->einundzwanzigPleb->profile?->picture ?? asset('einundzwanzig-alpha.jpg') }}"
|
||||
width="32" height="32" alt="User">
|
||||
</a>
|
||||
<div class="text-sm whitespace-nowrap">Eingereicht von
|
||||
<div class="font-semibold text-zinc-800 dark:text-zinc-100">
|
||||
{{ $projectProposal->einundzwanzigPleb?->profile->name ?? str($projectProposal->einundzwanzigPleb->npub)->limit(32) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<figure class="mb-6">
|
||||
<img class="rounded-sm h-48" src="{{ $projectProposal->getFirstMediaUrl('main') }}"
|
||||
alt="Picture">
|
||||
</figure>
|
||||
|
||||
<hr class="my-6 border-t border-gray-100 dark:border-gray-700/60">
|
||||
<div class="flex flex-wrap items-center sm:justify-end space-x-2">
|
||||
<div
|
||||
class="text-xs inline-flex items-center font-medium border border-zinc-200 dark:border-zinc-700/60 text-zinc-600 dark:text-zinc-400 rounded-full text-center px-2.5 py-1">
|
||||
<a target="_blank" href="{{ $projectProposal->website }}">Webseite</a>
|
||||
</div>
|
||||
<div
|
||||
class="text-xs inline-flex font-medium uppercase bg-green-500/20 text-green-700 rounded-full text-center px-2.5 py-1">
|
||||
{{ number_format($projectProposal->support_in_sats, 0, ',', '.') }} Sats
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if($isAllowed && !$projectProposal->accepted)
|
||||
<div class="lg:w-80 xl:w-96 shrink-0 space-y-4">
|
||||
<div class="bg-white dark:bg-gray-800 p-5 shadow-sm rounded-xl">
|
||||
@if(!$ownVoteExists)
|
||||
<div class="space-y-2">
|
||||
<flux:button wire:click="handleApprove" class="w-full">
|
||||
<i class="fill-current shrink-0 fa-sharp-duotone fa-solid fa-thumbs-up mr-2"></i>
|
||||
Zustimmen
|
||||
</flux:button>
|
||||
<flux:button wire:click="handleNotApprove" variant="danger" class="w-full">
|
||||
<i class="fill-current shrink-0 fa-sharp-duotone fa-solid fa-thumbs-down mr-2"></i>
|
||||
Ablehnen
|
||||
</flux:button>
|
||||
</div>
|
||||
@else
|
||||
<p class="text-sm text-gray-700 dark:text-gray-300">Du hast bereits abgestimmt.</p>
|
||||
@endif
|
||||
</div>
|
||||
<figure class="mb-6">
|
||||
<img class="rounded-sm h-48" src="{{ $projectProposal->getFirstMediaUrl('main') }}"
|
||||
alt="Picture">
|
||||
</figure>
|
||||
|
||||
<div class="bg-white dark:bg-gray-800 p-5 shadow-sm rounded-xl">
|
||||
<div class="text-sm font-semibold text-gray-800 dark:text-gray-100 mb-2">
|
||||
Zustimmungen des Vorstands ({{ count($this->boardVotes->where('value', 1)) }})
|
||||
</div>
|
||||
</div>
|
||||
<hr class="my-6 border-t border-zinc-100 dark:border-zinc-700/60">
|
||||
</div>
|
||||
|
||||
<div class="bg-white dark:bg-gray-800 p-5 shadow-sm rounded-xl">
|
||||
<div class="text-sm font-semibold text-gray-800 dark:text-gray-100 mb-2">
|
||||
Ablehnungen des Vorstands ({{ count($this->boardVotes->where('value', 0)) }})
|
||||
</div>
|
||||
<div class="lg:w-80 xl:w-96 shrink-0 space-y-4">
|
||||
<div class="bg-white dark:bg-zinc-800 p-5 shadow-sm rounded-xl">
|
||||
@if(!$ownVoteExists)
|
||||
<div class="space-y-2">
|
||||
<flux:button wire:click="handleApprove" class="w-full">
|
||||
<i class="fill-current shrink-0 fa-sharp-duotone fa-solid fa-thumbs-up mr-2"></i>
|
||||
Zustimmen
|
||||
</flux:button>
|
||||
<flux:button wire:click="handleNotApprove" variant="danger" class="w-full">
|
||||
<i class="fill-current shrink-0 fa-sharp-duotone fa-solid fa-thumbs-down mr-2"></i>
|
||||
Ablehnen
|
||||
</flux:button>
|
||||
</div>
|
||||
@else
|
||||
<p class="text-sm text-zinc-700 dark:text-zinc-300">Du hast bereits abgestimmt.</p>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="bg-white dark:bg-gray-800 p-5 shadow-sm rounded-xl">
|
||||
<div class="text-sm font-semibold text-gray-800 dark:text-gray-100 mb-2">
|
||||
Zustimmungen der übrigen Mitglieder
|
||||
({{ count($this->otherVotes->where('value', 1)) }})
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white dark:bg-gray-800 p-5 shadow-sm rounded-xl">
|
||||
<div class="text-sm font-semibold text-gray-800 dark:text-gray-100 mb-2">
|
||||
Ablehnungen der übrigen Mitglieder
|
||||
({{ count($this->otherVotes->where('value', 0)) }})
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white dark:bg-zinc-800 p-5 shadow-sm rounded-xl">
|
||||
<div class="text-sm font-semibold text-zinc-800 dark:text-zinc-100 mb-2">
|
||||
Zustimmungen des Vorstands ({{ count($this->boardVotes->where('value', 1)) }})
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="bg-white dark:bg-zinc-800 p-5 shadow-sm rounded-xl">
|
||||
<div class="text-sm font-semibold text-zinc-800 dark:text-zinc-100 mb-2">
|
||||
Ablehnungen des Vorstands ({{ count($this->boardVotes->where('value', 0)) }})
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white dark:bg-zinc-800 p-5 shadow-sm rounded-xl">
|
||||
<div class="text-sm font-semibold text-zinc-800 dark:text-zinc-100 mb-2">
|
||||
Zustimmungen der übrigen Mitglieder
|
||||
({{ count($this->otherVotes->where('value', 1)) }})
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white dark:bg-zinc-800 p-5 shadow-sm rounded-xl">
|
||||
<div class="text-sm font-semibold text-zinc-800 dark:text-zinc-100 mb-2">
|
||||
Ablehnungen der übrigen Mitglieder
|
||||
({{ count($this->otherVotes->where('value', 0)) }})
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
<div class="px-4 sm:px-6 lg:px-8 py-8 w-full mx-auto">
|
||||
<flux:callout variant="warning" icon="exclamation-circle">
|
||||
<flux:heading>Zugriff auf Projektförderung nicht möglich</flux:heading>
|
||||
<p>
|
||||
@if(!NostrAuth::check())
|
||||
Bitte melde dich zunächst mit Nostr an, um Zugriff auf die Projektförderung zu erhalten.
|
||||
@else
|
||||
Du benötigst eine gültige Nostr-Authentifizierung, um diese Projektförderung einzusehen.
|
||||
@endif
|
||||
</p>
|
||||
</flux:callout>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user