naser/libra
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

complete story 10.2

Browse Source
This commit is contained in:
Naser Mansour
2026-01-03 03:29:51 +02:00
parent e758458df1
commit 44f291fbc3
19 changed files with 157 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/components/footer.blade.php
+9 -9
View File
@@ -1,18 +1,18 @@
<footer class="bg-navy mt-auto" data-test="main-footer">
<footer class="bg-charcoal mt-auto" data-test="main-footer">
<div class="max-w-[1200px] mx-auto px-4 sm:px-6 lg:px-8 py-6 sm:py-8">
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6 sm:gap-8">
<!-- Logo & Description -->
<div class="text-center sm:text-start">
<x-logo size="small" />
<p class="mt-3 text-gold-light text-sm">
<p class="mt-3 text-warm-gray text-sm">
{{ __('footer.description') }}
</p>
</div>
<!-- Contact Information -->
<div class="text-center sm:text-start">
<h3 class="text-gold font-semibold mb-3">{{ __('footer.contact') }}</h3>
<address class="text-gold-light text-sm not-italic space-y-1">
<h3 class="text-off-white font-semibold mb-3">{{ __('footer.contact') }}</h3>
<address class="text-warm-gray text-sm not-italic space-y-1">
<p>{{ __('footer.address') }}</p>
<p class="ltr-content">{{ __('footer.phone') }}</p>
<p class="ltr-content">{{ __('footer.email') }}</p>
@@ -21,12 +21,12 @@
<!-- Legal Links -->
<div class="text-center sm:text-start sm:col-span-2 lg:col-span-1">
<h3 class="text-gold font-semibold mb-3">{{ __('footer.legal') }}</h3>
<h3 class="text-off-white font-semibold mb-3">{{ __('footer.legal') }}</h3>
<ul class="space-y-2 flex flex-row sm:flex-col gap-4 sm:gap-0 justify-center sm:justify-start">
<li>
<a
href="{{ route('terms') }}"
class="text-gold-light hover:text-gold transition-colors text-sm min-h-[44px] inline-flex items-center"
class="text-warm-gray hover:text-off-white transition-colors text-sm min-h-[44px] inline-flex items-center"
data-test="footer-terms"
>
{{ __('footer.terms') }}
@@ -35,7 +35,7 @@
<li>
<a
href="{{ route('privacy') }}"
class="text-gold-light hover:text-gold transition-colors text-sm min-h-[44px] inline-flex items-center"
class="text-warm-gray hover:text-off-white transition-colors text-sm min-h-[44px] inline-flex items-center"
data-test="footer-privacy"
>
{{ __('footer.privacy') }}
@@ -46,8 +46,8 @@
</div>
<!-- Copyright -->
<div class="mt-6 sm:mt-8 pt-4 sm:pt-6 border-t border-gold/20 text-center">
<p class="text-gold-light text-xs sm:text-sm" data-test="footer-copyright">
<div class="mt-6 sm:mt-8 pt-4 sm:pt-6 border-t border-warm-gray/20 text-center">
<p class="text-warm-gray text-xs sm:text-sm" data-test="footer-copyright">
&copy; {{ date('Y') }} {{ __('footer.copyright') }}
</p>
</div>
resources/views/components/language-toggle.blade.php
+5 -5
View File
@@ -3,20 +3,20 @@
href="{{ route('language.switch', 'ar') }}"
@class([
'text-sm px-2 py-1 rounded transition-colors min-h-[32px] flex items-center',
'bg-gold text-navy font-bold' => app()->getLocale() === 'ar',
'text-gold hover:text-gold-light' => app()->getLocale() !== 'ar',
'bg-warm-gray text-charcoal font-bold' => app()->getLocale() === 'ar',
'text-off-white hover:text-warm-gray' => app()->getLocale() !== 'ar',
])
data-test="language-switch-ar"
>
العربية
</a>
<span class="text-gold/50">|</span>
<span class="text-warm-gray/50">|</span>
<a
href="{{ route('language.switch', 'en') }}"
@class([
'text-sm px-2 py-1 rounded transition-colors min-h-[32px] flex items-center',
'bg-gold text-navy font-bold' => app()->getLocale() === 'en',
'text-gold hover:text-gold-light' => app()->getLocale() !== 'en',
'bg-warm-gray text-charcoal font-bold' => app()->getLocale() === 'en',
'text-off-white hover:text-warm-gray' => app()->getLocale() !== 'en',
])
data-test="language-switch-en"
>
resources/views/components/layouts/public.blade.php
+1 -1
View File
@@ -3,7 +3,7 @@
<head>
@include('partials.head')
</head>
<body class="min-h-screen flex flex-col bg-cream" style="font-family: var(--font-{{ app()->getLocale() === 'ar' ? 'arabic' : 'english' }})">
<body class="min-h-screen flex flex-col bg-off-white" style="font-family: var(--font-{{ app()->getLocale() === 'ar' ? 'arabic' : 'english' }})">
<!-- Skip to content link for keyboard accessibility -->
<a href="#main-content" class="skip-link" data-test="skip-to-content">
{{ __('accessibility.skip_to_content') }}
resources/views/components/logo.blade.php
+1 -1
View File
@@ -12,7 +12,7 @@
/>
@else
<span @class([
'font-bold text-gold',
'font-bold text-off-white',
'text-lg' => $size === 'small',
'text-2xl' => $size === 'default',
'text-3xl' => $size === 'large',
resources/views/components/navigation.blade.php
+25 -25
View File
@@ -1,6 +1,6 @@
<nav
x-data="{ mobileMenuOpen: false }"
class="fixed top-0 inset-x-0 z-50 bg-navy"
class="fixed top-0 inset-x-0 z-50 bg-charcoal"
data-test="main-navigation"
>
<div class="max-w-[1200px] mx-auto px-4">
@@ -17,7 +17,7 @@
<!-- Hamburger Button -->
<button
@click="mobileMenuOpen = !mobileMenuOpen"
class="p-2 text-gold hover:text-gold-light focus:outline-none min-h-[44px] min-w-[44px] flex items-center justify-center"
class="p-2 text-off-white hover:text-warm-gray focus:outline-none min-h-[44px] min-w-[44px] flex items-center justify-center"
:aria-expanded="mobileMenuOpen"
aria-label="{{ __('Toggle navigation menu') }}"
data-test="mobile-menu-button"
@@ -46,8 +46,8 @@
<a
href="{{ route('home') }}"
@class([
'text-gold hover:text-gold-light transition-colors py-2',
'border-b-2 border-gold' => request()->routeIs('home'),
'text-off-white hover:text-warm-gray transition-colors py-2',
'border-b-2 border-warm-gray' => request()->routeIs('home'),
])
wire:navigate
data-test="nav-home"
@@ -57,8 +57,8 @@
<a
href="{{ route('booking') }}"
@class([
'text-gold hover:text-gold-light transition-colors py-2',
'border-b-2 border-gold' => request()->routeIs('booking*'),
'text-off-white hover:text-warm-gray transition-colors py-2',
'border-b-2 border-warm-gray' => request()->routeIs('booking*'),
])
wire:navigate
data-test="nav-booking"
@@ -68,8 +68,8 @@
<a
href="{{ route('posts.index') }}"
@class([
'text-gold hover:text-gold-light transition-colors py-2',
'border-b-2 border-gold' => request()->routeIs('posts*'),
'text-off-white hover:text-warm-gray transition-colors py-2',
'border-b-2 border-warm-gray' => request()->routeIs('posts*'),
])
wire:navigate
data-test="nav-posts"
@@ -84,8 +84,8 @@
<a
href="{{ $dashboardRoute }}"
@class([
'text-gold hover:text-gold-light transition-colors py-2',
'border-b-2 border-gold' => request()->routeIs('*.dashboard'),
'text-off-white hover:text-warm-gray transition-colors py-2',
'border-b-2 border-warm-gray' => request()->routeIs('*.dashboard'),
])
wire:navigate
data-test="nav-dashboard"
@@ -96,7 +96,7 @@
@csrf
<button
type="submit"
class="text-gold hover:text-gold-light transition-colors py-2"
class="text-off-white hover:text-warm-gray transition-colors py-2"
data-test="nav-logout"
>
{{ __('navigation.logout') }}
@@ -106,8 +106,8 @@
<a
href="{{ route('login') }}"
@class([
'text-gold hover:text-gold-light transition-colors py-2',
'border-b-2 border-gold' => request()->routeIs('login'),
'text-off-white hover:text-warm-gray transition-colors py-2',
'border-b-2 border-warm-gray' => request()->routeIs('login'),
])
wire:navigate
data-test="nav-login"
@@ -137,7 +137,7 @@
x-cloak
@click.away="mobileMenuOpen = false"
@keydown.escape.window="mobileMenuOpen = false"
class="md:hidden bg-navy border-t border-gold/20"
class="md:hidden bg-charcoal border-t border-warm-gray/20"
role="dialog"
aria-modal="true"
aria-label="{{ __('Mobile navigation menu') }}"
@@ -147,8 +147,8 @@
<a
href="{{ route('home') }}"
@class([
'block px-3 py-3 text-gold hover:text-gold-light hover:bg-navy/80 rounded-md min-h-[44px] flex items-center',
'bg-navy/50 border-s-2 border-gold' => request()->routeIs('home'),
'block px-3 py-3 text-off-white hover:text-warm-gray hover:bg-charcoal/80 rounded-md min-h-[44px] flex items-center',
'bg-charcoal/50 border-s-2 border-warm-gray' => request()->routeIs('home'),
])
wire:navigate
@click="mobileMenuOpen = false"
@@ -159,8 +159,8 @@
<a
href="{{ route('booking') }}"
@class([
'block px-3 py-3 text-gold hover:text-gold-light hover:bg-navy/80 rounded-md min-h-[44px] flex items-center',
'bg-navy/50 border-s-2 border-gold' => request()->routeIs('booking*'),
'block px-3 py-3 text-off-white hover:text-warm-gray hover:bg-charcoal/80 rounded-md min-h-[44px] flex items-center',
'bg-charcoal/50 border-s-2 border-warm-gray' => request()->routeIs('booking*'),
])
wire:navigate
@click="mobileMenuOpen = false"
@@ -171,8 +171,8 @@
<a
href="{{ route('posts.index') }}"
@class([
'block px-3 py-3 text-gold hover:text-gold-light hover:bg-navy/80 rounded-md min-h-[44px] flex items-center',
'bg-navy/50 border-s-2 border-gold' => request()->routeIs('posts*'),
'block px-3 py-3 text-off-white hover:text-warm-gray hover:bg-charcoal/80 rounded-md min-h-[44px] flex items-center',
'bg-charcoal/50 border-s-2 border-warm-gray' => request()->routeIs('posts*'),
])
wire:navigate
@click="mobileMenuOpen = false"
@@ -188,8 +188,8 @@
<a
href="{{ $dashboardRoute }}"
@class([
'block px-3 py-3 text-gold hover:text-gold-light hover:bg-navy/80 rounded-md min-h-[44px] flex items-center',
'bg-navy/50 border-s-2 border-gold' => request()->routeIs('*.dashboard'),
'block px-3 py-3 text-off-white hover:text-warm-gray hover:bg-charcoal/80 rounded-md min-h-[44px] flex items-center',
'bg-charcoal/50 border-s-2 border-warm-gray' => request()->routeIs('*.dashboard'),
])
wire:navigate
@click="mobileMenuOpen = false"
@@ -201,7 +201,7 @@
@csrf
<button
type="submit"
class="w-full text-start px-3 py-3 text-gold hover:text-gold-light hover:bg-navy/80 rounded-md min-h-[44px] flex items-center"
class="w-full text-start px-3 py-3 text-off-white hover:text-warm-gray hover:bg-charcoal/80 rounded-md min-h-[44px] flex items-center"
data-test="mobile-nav-logout"
>
{{ __('navigation.logout') }}
@@ -211,8 +211,8 @@
<a
href="{{ route('login') }}"
@class([
'block px-3 py-3 text-gold hover:text-gold-light hover:bg-navy/80 rounded-md min-h-[44px] flex items-center',
'bg-navy/50 border-s-2 border-gold' => request()->routeIs('login'),
'block px-3 py-3 text-off-white hover:text-warm-gray hover:bg-charcoal/80 rounded-md min-h-[44px] flex items-center',
'bg-charcoal/50 border-s-2 border-warm-gray' => request()->routeIs('login'),
])
wire:navigate
@click="mobileMenuOpen = false"
resources/views/components/spinner.blade.php
+1 -1
View File
@@ -15,7 +15,7 @@
<div {{ $attributes->merge(['class' => $inline ? 'inline-flex items-center gap-2' : 'flex items-center gap-2']) }}>
<svg
class="animate-spin {{ $sizeClass }} text-gold"
class="animate-spin {{ $sizeClass }} text-charcoal"
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
resources/views/components/toast.blade.php
+2 -2
View File
@@ -42,8 +42,8 @@
:class="{
'bg-success text-white': toast.type === 'success',
'bg-danger text-white': toast.type === 'error',
'bg-warning text-navy': toast.type === 'warning',
'bg-navy text-white': toast.type === 'info' || !toast.type
'bg-warning text-charcoal': toast.type === 'warning',
'bg-charcoal text-white': toast.type === 'info' || !toast.type
}"
role="alert"
>
resources/views/components/ui/card.blade.php
+3 -3
View File
@@ -5,7 +5,7 @@
])
@php
$classes = 'bg-cream rounded-lg p-6';
$classes = 'bg-off-white rounded-lg p-6';
// Variant-based shadow (default uses custom shadow from specs: 0 2px 8px rgba(0,0,0,0.1))
$classes .= match($variant) {
@@ -18,9 +18,9 @@
$classes .= ' hover:shadow-card-hover hover:-translate-y-0.5 transition-all duration-200 cursor-pointer';
}
// Gold highlight border (uses border-s for RTL support)
// Warm gray highlight border (uses border-s for RTL support)
if ($highlight) {
$classes .= ' border-s-4 border-gold';
$classes .= ' border-s-4 border-warm-gray';
}
@endphp
resources/views/components/ui/stat-card.blade.php
+3 -3
View File
@@ -8,12 +8,12 @@
<x-ui.card>
<div class="flex items-center gap-4">
@if($icon)
<div class="p-3 bg-gold/10 rounded-lg">
<flux:icon :name="$icon" class="w-6 h-6 text-gold" />
<div class="p-3 bg-warm-gray/10 rounded-lg">
<flux:icon :name="$icon" class="w-6 h-6 text-warm-gray" />
</div>
@endif
<div>
<div class="text-2xl font-bold text-navy">{{ $value }}</div>
<div class="text-2xl font-bold text-charcoal">{{ $value }}</div>
<div class="text-sm text-charcoal/70">{{ $label }}</div>
@if($trend !== null)
@php