Files
Atomcms-edit/resources/themes/atom/views/community/staff.blade.php
T
root c53a5a8a2c Complete Hubbly theme conversion: all pages rewritten with CSS variable theming
- 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
2026-06-27 17:01:02 +02:00

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">&gt;&gt;</span>
</a>
</div>
</div>
</div>
</div>
</x-app-layout>