You've already forked Atomcms-edit
c53a5a8a2c
- Converted all views from Dusk components (x-content.content-card, x-form.*) to inline Hubbly style - All pages use consistent card pattern: rounded-lg, gradient headers, color-mix borders - Added Hubbly-style homepage with 2-column layout, login card, swiper news carousel - Rewrote navigation with Alpine.js dropdowns, CSS variable colors, Hubbly assets - Updated profile page with Hubbly cards, fixed data bugs (friend/guild relationships) - Rewrote register page to match Hubbly layout: banner header, avatar preview with Frank GIF, 2-column form, avatar carousel selector, border-4 inputs - Rewrote login, settings, help center, radio, applications, utility pages - All colors use CSS variables controlled by Filament theme editor - Added Hubbly assets: banner, Frank GIF, navigation icons, online badge - Removed all dependencies on x-content.* and x-form.* components
80 lines
3.9 KiB
PHP
Executable File
80 lines
3.9 KiB
PHP
Executable File
<x-app-layout>
|
|
@push('title', __('Staff'))
|
|
|
|
<div class="col-span-12 lg:col-span-9">
|
|
<div class="flex flex-wrap gap-4">
|
|
@foreach ($employees as $employee)
|
|
@php
|
|
$sectionColor = $employee->staff_color ?? '#eeb425';
|
|
@endphp
|
|
<div class="rounded-lg overflow-hidden w-full"
|
|
style="background-color: var(--color-surface, #ffffff); border: 1px solid color-mix(in srgb, var(--color-text-muted) 15%, transparent);">
|
|
<div class="relative w-full overflow-hidden">
|
|
<div class="rank-header">
|
|
<div class="relative w-full"
|
|
style="background: linear-gradient(140deg, {{ $sectionColor }} 0%, color-mix(in srgb, {{ $sectionColor }} 80%, black) 100%);">
|
|
<div class="flex items-center justify-start h-full relative">
|
|
<h2 class="text-white font-bold text-xl" style="padding: 2% 3%;">{{ $employee->rank_name }}</h2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@if(count($employee->users) > 0)
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 p-4">
|
|
@foreach ($employee->users as $staff)
|
|
<x-community.staff-card :user="$staff" />
|
|
@endforeach
|
|
</div>
|
|
@else
|
|
<div class="text-center py-16">
|
|
<p class="text-lg font-medium" style="color: var(--color-text-muted);">{{ __('No staff members in this position') }}</p>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-span-12 lg:col-span-3 space-y-4">
|
|
<div class="rounded-lg overflow-hidden"
|
|
style="background-color: var(--color-surface, #ffffff); border: 1px solid color-mix(in srgb, var(--color-text-muted) 15%, transparent);">
|
|
<div class="relative w-full h-12"
|
|
style="background: linear-gradient(140deg, #3A2068 0%, #3F2673 15%, #493085 30%, #523A97 45%, #5B44A9 60%, #654EBB 75%, #7068D0 90%, #786ED8 100%);">
|
|
<div class="flex items-center justify-center h-full">
|
|
<h2 class="text-white font-bold text-xl">{{ setting('hotel_name') }} {{ __('Staff') }}</h2>
|
|
</div>
|
|
</div>
|
|
<div class="p-4">
|
|
<p class="text-sm mb-4" style="color: var(--color-text-muted);">{{ __('About our team') }}</p>
|
|
<div class="space-y-3 text-sm" style="color: var(--color-text);">
|
|
<p>{{ __('The :hotel staff team is one big happy family, each staff member has a different role and duties to fulfill.', ['hotel' => setting('hotel_name')]) }}</p>
|
|
<p>{{ __('Most of our team usually consists of players that have been around :hotel for quite a while, but this does not mean we only recruit old & known players, we recruit those who shine out to us!', ['hotel' => setting('hotel_name')]) }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-lg overflow-hidden"
|
|
style="background-color: var(--color-surface, #ffffff); border: 1px solid color-mix(in srgb, var(--color-text-muted) 15%, transparent);">
|
|
<div class="relative w-full h-12"
|
|
style="background: linear-gradient(140deg, #1a5c3a 0%, #1e6e42 20%, #2a8050 40%, #3a9060 60%, #4aa070 75%, #3a9060 90%, #2a8050 100%);">
|
|
<div class="flex items-center justify-center h-full">
|
|
<h2 class="text-white font-bold text-xl">{{ __('Join the Team') }}</h2>
|
|
</div>
|
|
</div>
|
|
<div class="p-4">
|
|
<p class="text-sm mb-4" style="color: var(--color-text-muted);">{{ __('Become a staff member') }}</p>
|
|
<div class="space-y-3 text-sm" style="color: var(--color-text);">
|
|
<p>{{ __('Every now and then staff applications may open up. Once they do we always make sure to post a news article explaining the process - So make sure you keep an eye out for those in you are interested in joining the :hotel staff team.', ['hotel' => setting('hotel_name')]) }}</p>
|
|
<a href="{{ route('staff-applications.index') }}"
|
|
class="inline-flex items-center gap-2 mt-2 px-4 py-2 rounded-lg font-semibold text-sm transition-all hover:scale-105"
|
|
style="background: var(--color-primary); color: var(--button-text-color);">
|
|
{{ __('View Open Positions') }}
|
|
<span class="text-lg">>></span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</x-app-layout>
|