mirror of
https://github.com/HolgerHatGarKeineNode/einundzwanzig-app.git
synced 2025-12-14 12:06:46 +00:00
✨ Improve UI consistency across components
This commit is contained in:
HolgerHatGarKeineNode
@@ -75,13 +75,13 @@ new class extends Component {
|
||||
</flux:table.cell>
|
||||
<flux:table.cell>
|
||||
@if($city->createdBy)
|
||||
{{ $city->createdBy->name }}
|
||||
{{ Str::limit($city->createdBy->name, 30) }}
|
||||
@endif
|
||||
</flux:table.cell>
|
||||
<flux:table.cell>
|
||||
<div class="flex gap-2">
|
||||
@auth
|
||||
<flux:button size="sm" :href="route('cities.edit',['city' => $city, 'country' => $country])" icon="pencil">
|
||||
<flux:button size="xs" :href="route('cities.edit',['city' => $city, 'country' => $country])" icon="pencil">
|
||||
{{ __('Edit') }}
|
||||
</flux:button>
|
||||
@endauth
|
||||
|
||||
@@ -64,19 +64,23 @@ new class extends Component {
|
||||
<flux:table.rows>
|
||||
@foreach ($courses as $course)
|
||||
<flux:table.row :key="$course->id">
|
||||
<flux:table.cell variant="strong" class="flex items-center gap-3">
|
||||
<flux:avatar :href="route('courses.landingpage', ['course' => $course, 'country' => $country])"
|
||||
src="{{ $course->getFirstMedia('logo') ? $course->getFirstMediaUrl('logo', 'thumb') : asset('android-chrome-512x512.png') }}"/>
|
||||
<div>
|
||||
<a href="{{ route('courses.landingpage', ['course' => $course, 'country' => $country]) }}">
|
||||
<span>{{ $course->name }}</span>
|
||||
@if($course->description)
|
||||
<div class="text-xs text-zinc-500">
|
||||
{{ Str::limit($course->description, 60) }}
|
||||
</div>
|
||||
@endif
|
||||
</a>
|
||||
</div>
|
||||
<flux:table.cell variant="strong">
|
||||
<flux:tooltip content="{{ $course->name }}">
|
||||
<div class="flex items-center gap-3">
|
||||
<flux:avatar :href="route('courses.landingpage', ['course' => $course, 'country' => $country])"
|
||||
src="{{ $course->getFirstMedia('logo') ? $course->getFirstMediaUrl('logo', 'thumb') : asset('android-chrome-512x512.png') }}"/>
|
||||
<div>
|
||||
<a href="{{ route('courses.landingpage', ['course' => $course, 'country' => $country]) }}">
|
||||
<span>{{ Str::limit($course->name, 30) }}</span>
|
||||
@if($course->description)
|
||||
<div class="text-xs text-zinc-500">
|
||||
{{ Str::limit($course->description, 60) }}
|
||||
</div>
|
||||
@endif
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</flux:tooltip>
|
||||
</flux:table.cell>
|
||||
|
||||
<flux:table.cell>
|
||||
@@ -104,22 +108,28 @@ new class extends Component {
|
||||
</flux:table.cell>
|
||||
|
||||
<flux:table.cell>
|
||||
<flux:button
|
||||
:disabled="$course->created_by !== auth()->id()"
|
||||
:href="$course->created_by === auth()->id() ? route_with_country('courses.edit', ['course' => $course]) : null"
|
||||
size="xs"
|
||||
variant="filled"
|
||||
icon="pencil">
|
||||
{{ __('Bearbeiten') }}
|
||||
</flux:button>
|
||||
<flux:button
|
||||
:disabled="$course->created_by !== auth()->id()"
|
||||
:href="$course->created_by === auth()->id() ? route_with_country('courses.events.create', ['course' => $course]) : null"
|
||||
size="xs"
|
||||
variant="filled"
|
||||
icon="calendar">
|
||||
{{ __('Neues Event erstellen') }}
|
||||
</flux:button>
|
||||
<div class="flex flex-col space-y-2">
|
||||
<div>
|
||||
<flux:button
|
||||
:disabled="$course->created_by !== auth()->id()"
|
||||
:href="$course->created_by === auth()->id() ? route_with_country('courses.edit', ['course' => $course]) : null"
|
||||
size="xs"
|
||||
variant="filled"
|
||||
icon="pencil">
|
||||
{{ __('Bearbeiten') }}
|
||||
</flux:button>
|
||||
</div>
|
||||
<div>
|
||||
<flux:button
|
||||
:disabled="$course->created_by !== auth()->id()"
|
||||
:href="$course->created_by === auth()->id() ? route_with_country('courses.events.create', ['course' => $course]) : null"
|
||||
size="xs"
|
||||
variant="filled"
|
||||
icon="calendar">
|
||||
{{ __('Neues Event erstellen') }}
|
||||
</flux:button>
|
||||
</div>
|
||||
</div>
|
||||
</flux:table.cell>
|
||||
</flux:table.row>
|
||||
@endforeach
|
||||
|
||||
@@ -65,7 +65,7 @@ new class extends Component {
|
||||
}; ?>
|
||||
|
||||
<div class="flex h-full w-full flex-1 flex-col gap-4 rounded-xl">
|
||||
<div class="grid auto-rows-min gap-4 md:grid-cols-3">
|
||||
<div class="grid auto-rows-min gap-4 grid-cols-1 md:grid-cols-2 2xl:grid-cols-3">
|
||||
<div class="relative overflow-hidden rounded-xl border border-neutral-200 dark:border-neutral-700">
|
||||
<div class="p-6">
|
||||
<flux:heading size="lg" class="mb-4">{{ __('Meine nächsten Meetup Termine') }}</flux:heading>
|
||||
@@ -93,7 +93,7 @@ new class extends Component {
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative overflow-hidden rounded-xl border border-neutral-200 dark:border-neutral-700">
|
||||
<div class="2xl:col-span-2 relative overflow-hidden rounded-xl border border-neutral-200 dark:border-neutral-700">
|
||||
<div class="p-6">
|
||||
<flux:heading size="lg" class="mb-4">{{ __('Meine Meetups') }}</flux:heading>
|
||||
|
||||
@@ -170,7 +170,4 @@ new class extends Component {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{--<div class="relative h-full flex-1 overflow-hidden rounded-xl border border-neutral-200 dark:border-neutral-700">
|
||||
<x-placeholder-pattern class="absolute inset-0 size-full stroke-gray-900/20 dark:stroke-neutral-100/20" />
|
||||
</div>--}}
|
||||
</div>
|
||||
|
||||
@@ -70,7 +70,9 @@ new class extends Component {
|
||||
@foreach ($meetups as $meetup)
|
||||
<flux:table.row :key="$meetup->id">
|
||||
<flux:table.cell variant="strong" class="flex items-center gap-3">
|
||||
<flux:avatar :href="route('meetups.landingpage', ['meetup' => $meetup, 'country' => $country])" src="{{ $meetup->getFirstMedia('logo') ? $meetup->getFirstMediaUrl('logo', 'thumb') : asset('android-chrome-512x512.png') }}"/>
|
||||
<flux:avatar
|
||||
class="[:where(&)]:size-24 [:where(&)]:text-base" size="xl"
|
||||
:href="route('meetups.landingpage', ['meetup' => $meetup, 'country' => $country])" src="{{ $meetup->getFirstMedia('logo') ? $meetup->getFirstMediaUrl('logo', 'thumb') : asset('android-chrome-512x512.png') }}"/>
|
||||
<div>
|
||||
@if($meetup->city)
|
||||
<a href="{{ route('meetups.landingpage', ['meetup' => $meetup, 'country' => $country]) }}">
|
||||
@@ -145,15 +147,21 @@ new class extends Component {
|
||||
</flux:table.cell>
|
||||
|
||||
<flux:table.cell>
|
||||
<flux:button
|
||||
:disabled="!$meetup->belongsToMe"
|
||||
:href="$meetup->belongsToMe ? route_with_country('meetups.edit', ['meetup' => $meetup]) : null" size="xs"
|
||||
variant="filled" icon="pencil">
|
||||
{{ __('Bearbeiten') }}
|
||||
</flux:button>
|
||||
<flux:button :href="route_with_country('meetups.events.create', ['meetup' => $meetup])" size="xs" variant="filled" icon="calendar">
|
||||
{{ __('Neues Event erstellen') }}
|
||||
</flux:button>
|
||||
<div class="flex flex-col space-y-2">
|
||||
<div>
|
||||
<flux:button
|
||||
:disabled="!$meetup->belongsToMe"
|
||||
:href="$meetup->belongsToMe ? route_with_country('meetups.edit', ['meetup' => $meetup]) : null" size="xs"
|
||||
variant="filled" icon="pencil">
|
||||
{{ __('Bearbeiten') }}
|
||||
</flux:button>
|
||||
</div>
|
||||
<div>
|
||||
<flux:button :href="route_with_country('meetups.events.create', ['meetup' => $meetup])" size="xs" variant="filled" icon="calendar">
|
||||
{{ __('Neues Event erstellen') }}
|
||||
</flux:button>
|
||||
</div>
|
||||
</div>
|
||||
</flux:table.cell>
|
||||
</flux:table.row>
|
||||
@endforeach
|
||||
|
||||
@@ -69,13 +69,13 @@ new class extends Component {
|
||||
</flux:table.cell>
|
||||
<flux:table.cell>
|
||||
@if($venue->createdBy)
|
||||
{{ $venue->createdBy->name }}
|
||||
{{ Str::limit($venue->createdBy->name, 30) }}
|
||||
@endif
|
||||
</flux:table.cell>
|
||||
<flux:table.cell>
|
||||
<div class="flex gap-2">
|
||||
@auth
|
||||
<flux:button size="sm" :href="route('venues.edit', ['venue' => $venue, 'country' => $country])" icon="pencil">
|
||||
<flux:button size="xs" :href="route('venues.edit', ['venue' => $venue, 'country' => $country])" icon="pencil">
|
||||
{{ __('Edit') }}
|
||||
</flux:button>
|
||||
@endauth
|
||||
|
||||
Reference in New Issue
Block a user