remco/Atomcms-edit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Complete Hubbly theme conversion: all pages rewritten with CSS variable theming

Browse Source 
- 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
This commit is contained in:
root
2026-06-27 17:01:02 +02:00
parent 61bb70ac1d
commit c53a5a8a2c
68 changed files with 4708 additions and 4608 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/themes/atom/views/rules.blade.php
+37 -23
View File
@@ -1,29 +1,43 @@
<x-app-layout>
@push('title', __('Rules'))
<div class="col-span-12 flex flex-col gap-y-3">
<div class="mb-4 w-full rounded bg-red-600 p-4 text-[var(--color-text)]">
{{ __('Rules and regulations are subject to change without notice. As a member of the :hotel community, you hereby agree to and understand the following terms and conditions above. Failure to comply with these rules and regulations will result in the necessary sanctions implemented upon your account. If you have any questions or concerns in regards to The :hotel Way, please do not hesitate to ask a member of the Hotel Staff.', ['hotel' => setting('hotel_name')]) }}
</div>
<div class="col-span-12 flex flex-col gap-y-4">
<div class="rounded-lg overflow-hidden" style="background-color: var(--color-surface); 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, var(--color-primary) 0%, color-mix(in srgb, var(--color-primary) 80%, black) 100%);">
<div class="flex items-center h-full px-4 gap-3">
<h1 class="text-white font-bold text-xl">{{ __('Website Rules') }}</h1>
</div>
</div>
<div class="p-4">
<div class="rounded-lg p-4 text-sm" style="background-color: color-mix(in srgb, var(--color-primary) 10%, var(--color-surface)); color: var(--color-text); border: 1px solid color-mix(in srgb, var(--color-primary) 30%, transparent);">
<p>{{ __('Rules and regulations are subject to change without notice. As a member of the :hotel community, you hereby agree to and understand the following terms and conditions above. Failure to comply with these rules and regulations will result in the necessary sanctions implemented upon your account. If you have any questions or concerns in regards to The :hotel Way, please do not hesitate to ask a member of the Hotel Staff.', ['hotel' => setting('hotel_name')]) }}</p>
</div>
</div>
</div>
<div class="flex flex-col gap-y-6">
@foreach ($categories as $category)
<x-content.content-card icon="{{ $category->badge }}" classes="border dark:border-[var(--color-text-muted)]">
<x-slot:title>
{{ $category->name }}
</x-slot:title>
<x-slot:under-title>
{{ $category->description }}
</x-slot:under-title>
<ul class="rounded bg-[var(--color-surface)] p-2 dark:bg-[var(--color-background)] dark:text-[var(--color-text-muted)]">
@foreach ($category->rules as $rule)
<li><strong>{{ $rule->paragraph }}.</strong> {{ $rule->rule }}</li>
@endforeach
</ul>
</x-content.content-card>
@endforeach
</div>
<div class="flex flex-col gap-y-4">
@foreach ($categories as $category)
<div class="rounded-lg overflow-hidden" style="background-color: var(--color-surface); 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, var(--color-primary) 0%, color-mix(in srgb, var(--color-primary) 80%, black) 100%);">
<div class="flex items-center h-full px-4 gap-3">
<img src="{{ asset($category->badge) }}" class="flex items-center justify-center" style="image-rendering: pixelated;">
<div class="flex flex-col">
<h2 class="text-white font-bold text-lg">{{ $category->name }}</h2>
<p class="text-white/80 text-xs">{{ $category->description }}</p>
</div>
</div>
</div>
<div class="p-4">
<ul class="space-y-2">
@foreach ($category->rules as $rule)
<li class="rounded-lg p-3 text-sm" style="background-color: var(--color-background); color: var(--color-text); border: 1px solid color-mix(in srgb, var(--color-text-muted) 15%, transparent);">
<strong>{{ $rule->paragraph }}.</strong> {{ $rule->rule }}
</li>
@endforeach
</ul>
</div>
</div>
@endforeach
</div>
</div>
</x-app-layout>