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

color manual fixing

This commit is contained in:
Naser Mansour 2026-01-04 01:15:42 +02:00
parent 82e803dc26
commit a33cbfb908
18 changed files with 79 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
resources/css/app.css
View File

@ -43,7 +43,7 @@
/* Neutrals (unchanged) */ /* Neutrals (unchanged) */
--color-background: #E8E4DC; /* Off-White - light backgrounds */ --color-background: #E8E4DC; /* Off-White - light backgrounds */
--color-text: #1A1A1A; /* Deep Black - text color */ --color-body: #1A1A1A; /* Deep Black - body text color */
/* Semantic Aliases - used by components */ /* Semantic Aliases - used by components */
--color-accent-content: #A5C87A; /* Light Olive */ --color-accent-content: #A5C87A; /* Light Olive */
@ -91,7 +91,7 @@
========================================================================== */ ========================================================================== */
.logo-badge { .logo-badge {
border: 2px solid var(--color-text); border: 2px solid var(--color-body);
box-shadow: 4px 4px 6px rgba(26, 26, 26, 0.5); box-shadow: 4px 4px 6px rgba(26, 26, 26, 0.5);
} }
@ -106,7 +106,7 @@
/* Label styling - semibold weight per specs */ /* Label styling - semibold weight per specs */
[data-flux-label] { [data-flux-label] {
@apply !mb-0 !leading-tight font-semibold text-text; @apply !mb-0 !leading-tight font-semibold text-body;
} }
/* Input, Textarea, Select base styling */ /* Input, Textarea, Select base styling */
@ -115,7 +115,7 @@ textarea[data-flux-control],
[data-flux-control] input, [data-flux-control] input,
select[data-flux-control], select[data-flux-control],
[data-flux-select-button] { [data-flux-select-button] {
@apply border-text/30 rounded-md transition-colors; @apply border-body/30 rounded-md transition-colors text-body;
} }
/* Focus states - Warm Gray border with subtle ring */ /* Focus states - Warm Gray border with subtle ring */
@ -135,13 +135,13 @@ textarea[data-flux-control] {
/* Checkbox styling - Light Olive accent when checked */ /* Checkbox styling - Light Olive accent when checked */
[data-flux-checkbox] input[type="checkbox"], [data-flux-checkbox] input[type="checkbox"],
input[type="checkbox"][data-flux-control] { input[type="checkbox"][data-flux-control] {
@apply w-5 h-5 rounded border-text/30 text-accent focus:ring-accent focus:ring-offset-0; @apply w-5 h-5 rounded border-body/30 text-accent focus:ring-accent focus:ring-offset-0;
} }
/* Radio styling - Light Olive accent when selected */ /* Radio styling - Light Olive accent when selected */
[data-flux-radio] input[type="radio"], [data-flux-radio] input[type="radio"],
input[type="radio"][data-flux-control] { input[type="radio"][data-flux-control] {
@apply w-5 h-5 border-text/30 text-accent focus:ring-accent focus:ring-offset-0; @apply w-5 h-5 border-body/30 text-accent focus:ring-accent focus:ring-offset-0;
} }
/* Error state styling for Flux fields */ /* Error state styling for Flux fields */
@ -185,10 +185,10 @@ input[type="radio"][data-flux-control] {
/* Prose Brand styling for blog posts - Olive Green palette (Story 12.2) */ /* Prose Brand styling for blog posts - Olive Green palette (Story 12.2) */
.prose-brand { .prose-brand {
--tw-prose-headings: var(--color-text); /* Deep Black */ --tw-prose-headings: var(--color-body); /* Deep Black */
--tw-prose-links: var(--color-primary); /* Olive Green */ --tw-prose-links: var(--color-primary); /* Olive Green */
--tw-prose-bold: var(--color-text); /* Deep Black */ --tw-prose-bold: var(--color-body); /* Deep Black */
--tw-prose-body: var(--color-text); /* Deep Black */ --tw-prose-body: var(--color-body); /* Deep Black */
} }
.prose-brand a { .prose-brand a {
@ -201,10 +201,10 @@ input[type="radio"][data-flux-control] {
/* Backward compatibility alias for prose-navy */ /* Backward compatibility alias for prose-navy */
.prose-navy { .prose-navy {
--tw-prose-headings: var(--color-text); --tw-prose-headings: var(--color-body);
--tw-prose-links: var(--color-primary); --tw-prose-links: var(--color-primary);
--tw-prose-bold: var(--color-text); --tw-prose-bold: var(--color-body);
--tw-prose-body: var(--color-text); --tw-prose-body: var(--color-body);
} }
.prose-navy a { .prose-navy a {
@ -266,8 +266,8 @@ small, .text-sm {
/* Secondary button - Outlined with Light Olive border, Deep Black text */ /* Secondary button - Outlined with Light Olive border, Deep Black text */
.btn-secondary { .btn-secondary {
@apply bg-transparent border-2 border-accent text-text rounded-md px-6 py-3 font-semibold transition-colors; @apply bg-transparent border-2 border-accent text-body rounded-md px-6 py-3 font-semibold transition-colors;
@apply hover:bg-accent hover:text-text; @apply hover:bg-accent hover:text-body;
@apply focus:outline-none focus:ring-2 focus:ring-accent focus:ring-offset-2; @apply focus:outline-none focus:ring-2 focus:ring-accent focus:ring-offset-2;
} }
@ -356,7 +356,7 @@ button.btn-danger:disabled {
/* Input field styling */ /* Input field styling */
.input-field { .input-field {
@apply w-full border border-text/30 rounded-md px-4 py-3 @apply w-full border border-body/30 rounded-md px-4 py-3
focus:border-accent focus:ring-2 focus:ring-accent/20 focus:border-accent focus:ring-2 focus:ring-accent/20
transition-colors outline-none bg-white; transition-colors outline-none bg-white;
} }
@ -368,7 +368,7 @@ button.btn-danger:disabled {
/* Form label styling */ /* Form label styling */
.form-label { .form-label {
@apply block text-sm font-semibold text-text mb-2; @apply block text-sm font-semibold text-body mb-2;
} }
/* Required field indicator - for manual class usage */ /* Required field indicator - for manual class usage */
@ -390,7 +390,7 @@ button.btn-danger:disabled {
/* Textarea specific styling */ /* Textarea specific styling */
.textarea-field { .textarea-field {
@apply w-full border border-text/30 rounded-md px-4 py-3 @apply w-full border border-body/30 rounded-md px-4 py-3
focus:border-accent focus:ring-2 focus:ring-accent/20 focus:border-accent focus:ring-2 focus:ring-accent/20
transition-colors outline-none bg-white transition-colors outline-none bg-white
min-h-[120px] resize-y; min-h-[120px] resize-y;
@ -398,20 +398,20 @@ button.btn-danger:disabled {
/* Select dropdown styling */ /* Select dropdown styling */
.select-field { .select-field {
@apply w-full border border-text/30 rounded-md px-4 py-3 @apply w-full border border-body/30 rounded-md px-4 py-3
focus:border-accent focus:ring-2 focus:ring-accent/20 focus:border-accent focus:ring-2 focus:ring-accent/20
transition-colors outline-none bg-white; transition-colors outline-none bg-white;
} }
/* Custom checkbox styling */ /* Custom checkbox styling */
.checkbox-custom { .checkbox-custom {
@apply w-5 h-5 rounded border-text/30 text-accent @apply w-5 h-5 rounded border-body/30 text-accent
focus:ring-accent focus:ring-offset-0; focus:ring-accent focus:ring-offset-0;
} }
/* Custom radio styling */ /* Custom radio styling */
.radio-custom { .radio-custom {
@apply w-5 h-5 border-text/30 text-accent @apply w-5 h-5 border-body/30 text-accent
focus:ring-accent focus:ring-offset-0; focus:ring-accent focus:ring-offset-0;
} }

4
resources/views/components/auth-header.blade.php
View File

@ -4,6 +4,6 @@
]) ])
<div class="flex w-full flex-col text-center"> <div class="flex w-full flex-col text-center">
<flux:heading size="xl">{{ $title }}</flux:heading> <flux:heading size="xl" class="text-body">{{ $title }}</flux:heading>
<flux:subheading>{{ $description }}</flux:subheading> <flux:subheading class="text-body/70">{{ $description }}</flux:subheading>
</div> </div>

17
resources/views/components/language-toggle.blade.php
View File

@ -1,22 +1,29 @@
@props(['variant' => 'dark'])
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<a <a
href="{{ route('language.switch', 'ar') }}" href="{{ route('language.switch', 'ar') }}"
@class([ @class([
'text-sm px-2 py-1 rounded transition-colors min-h-[32px] flex items-center', 'text-sm px-2 py-1 rounded transition-colors min-h-[32px] flex items-center',
'bg-accent text-text font-bold' => app()->getLocale() === 'ar', 'bg-amber-500 text-white font-bold' => app()->getLocale() === 'ar',
'text-off-white hover:text-accent' => app()->getLocale() !== 'ar', 'text-off-white hover:text-accent' => app()->getLocale() !== 'ar' && $variant === 'dark',
'text-body/70 hover:text-body' => app()->getLocale() !== 'ar' && $variant === 'light',
]) ])
data-test="language-switch-ar" data-test="language-switch-ar"
> >
العربية العربية
</a> </a>
<span class="text-accent/50">|</span> <span @class([
'text-accent/50' => $variant === 'dark',
'text-body/30' => $variant === 'light',
])>|</span>
<a <a
href="{{ route('language.switch', 'en') }}" href="{{ route('language.switch', 'en') }}"
@class([ @class([
'text-sm px-2 py-1 rounded transition-colors min-h-[32px] flex items-center', 'text-sm px-2 py-1 rounded transition-colors min-h-[32px] flex items-center',
'bg-accent text-text font-bold' => app()->getLocale() === 'en', 'bg-amber-500 text-white font-bold' => app()->getLocale() === 'en',
'text-off-white hover:text-accent' => app()->getLocale() !== 'en', 'text-off-white hover:text-accent' => app()->getLocale() !== 'en' && $variant === 'dark',
'text-body/70 hover:text-body' => app()->getLocale() !== 'en' && $variant === 'light',
]) ])
data-test="language-switch-en" data-test="language-switch-en"
> >

4
resources/views/components/layouts/auth/card.blade.php
View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" dir="{{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }}" class="dark"> <html lang="{{ str_replace('_', '-', app()->getLocale()) }}" dir="{{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }}">
<head> <head>
@include('partials.head') @include('partials.head')
</head> </head>
@ -11,7 +11,7 @@
<!-- Language Toggle --> <!-- Language Toggle -->
<div class="absolute end-4 top-4"> <div class="absolute end-4 top-4">
<x-language-toggle /> <x-language-toggle variant="light" />
</div> </div>
<main id="main-content" role="main" tabindex="-1" class="bg-muted flex min-h-svh flex-col items-center justify-center gap-6 p-6 md:p-10"> <main id="main-content" role="main" tabindex="-1" class="bg-muted flex min-h-svh flex-col items-center justify-center gap-6 p-6 md:p-10">

4
resources/views/components/layouts/auth/simple.blade.php
View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" dir="{{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }}" class="dark"> <html lang="{{ str_replace('_', '-', app()->getLocale()) }}" dir="{{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }}">
<head> <head>
@include('partials.head') @include('partials.head')
</head> </head>
@ -11,7 +11,7 @@
<!-- Language Toggle --> <!-- Language Toggle -->
<div class="absolute end-4 top-4"> <div class="absolute end-4 top-4">
<x-language-toggle /> <x-language-toggle variant="light" />
</div> </div>
<main id="main-content" role="main" tabindex="-1" class="bg-background flex min-h-svh flex-col items-center justify-center gap-6 p-6 md:p-10"> <main id="main-content" role="main" tabindex="-1" class="bg-background flex min-h-svh flex-col items-center justify-center gap-6 p-6 md:p-10">

4
resources/views/components/layouts/auth/split.blade.php
View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" dir="{{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }}" class="dark"> <html lang="{{ str_replace('_', '-', app()->getLocale()) }}" dir="{{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }}">
<head> <head>
@include('partials.head') @include('partials.head')
</head> </head>
@ -11,7 +11,7 @@
<!-- Language Toggle --> <!-- Language Toggle -->
<div class="absolute end-4 top-4 z-50"> <div class="absolute end-4 top-4 z-50">
<x-language-toggle /> <x-language-toggle variant="light" />
</div> </div>
<main id="main-content" role="main" tabindex="-1" class="relative grid h-dvh flex-col items-center justify-center px-8 sm:px-0 lg:max-w-none lg:grid-cols-2 lg:px-0"> <main id="main-content" role="main" tabindex="-1" class="relative grid h-dvh flex-col items-center justify-center px-8 sm:px-0 lg:max-w-none lg:grid-cols-2 lg:px-0">

2
resources/views/components/toast.blade.php
View File

@ -42,7 +42,7 @@
:class="{ :class="{
'bg-success text-white': toast.type === 'success', 'bg-success text-white': toast.type === 'success',
'bg-danger text-white': toast.type === 'error', 'bg-danger text-white': toast.type === 'error',
'bg-warning text-text': toast.type === 'warning', 'bg-warning text-body': toast.type === 'warning',
'bg-primary text-white': toast.type === 'info' || !toast.type 'bg-primary text-white': toast.type === 'info' || !toast.type
}" }"
role="alert" role="alert"

6
resources/views/components/ui/stat-card.blade.php
View File

@ -13,14 +13,14 @@
</div> </div>
@endif @endif
<div> <div>
<div class="text-2xl font-bold text-text">{{ $value }}</div> <div class="text-2xl font-bold text-body">{{ $value }}</div>
<div class="text-sm text-text/70">{{ $label }}</div> <div class="text-sm text-body/70">{{ $label }}</div>
@if($trend !== null) @if($trend !== null)
@php @php
$trendClass = match(true) { $trendClass = match(true) {
$trend > 0 => 'text-success', $trend > 0 => 'text-success',
$trend < 0 => 'text-danger', $trend < 0 => 'text-danger',
default => 'text-text/50', default => 'text-body/50',
}; };
$trendPrefix = $trend > 0 ? '+' : ''; $trendPrefix = $trend > 0 ? '+' : '';
@endphp @endphp

4
resources/views/livewire/availability-calendar.blade.php
View File

@ -162,7 +162,7 @@ new class extends Component
<flux:icon name="chevron-{{ app()->getLocale() === 'ar' ? 'right' : 'left' }}" class="size-5" /> <flux:icon name="chevron-{{ app()->getLocale() === 'ar' ? 'right' : 'left' }}" class="size-5" />
</flux:button> </flux:button>
<flux:heading size="lg">{{ $monthName }}</flux:heading> <flux:heading size="lg" class="text-body">{{ $monthName }}</flux:heading>
<flux:button size="sm" wire:click="nextMonth" variant="ghost"> <flux:button size="sm" wire:click="nextMonth" variant="ghost">
<flux:icon name="chevron-{{ app()->getLocale() === 'ar' ? 'left' : 'right' }}" class="size-5" /> <flux:icon name="chevron-{{ app()->getLocale() === 'ar' ? 'left' : 'right' }}" class="size-5" />
@ -205,7 +205,7 @@ new class extends Component
<!-- Time Slots --> <!-- Time Slots -->
@if($selectedDate) @if($selectedDate)
<div class="mt-6"> <div class="mt-6">
<flux:heading size="sm" class="mb-3"> <flux:heading size="sm" class="mb-3 text-body">
{{ __('booking.available_times') }} - {{ __('booking.available_times') }} -
{{ \Carbon\Carbon::parse($selectedDate)->translatedFormat('d M Y') }} {{ \Carbon\Carbon::parse($selectedDate)->translatedFormat('d M Y') }}
</flux:heading> </flux:heading>

2
resources/views/livewire/pages/booking-success.blade.php
View File

@ -11,7 +11,7 @@ new #[Layout('components.layouts.public')] class extends Component
<div class="max-w-2xl mx-auto py-16 px-4 text-center"> <div class="max-w-2xl mx-auto py-16 px-4 text-center">
<flux:icon name="check-circle" class="w-16 h-16 mx-auto text-green-500 mb-6" /> <flux:icon name="check-circle" class="w-16 h-16 mx-auto text-green-500 mb-6" />
<flux:heading size="xl" class="mb-4"> <flux:heading size="xl" class="mb-4 text-body">
{{ __('booking.success_title') }} {{ __('booking.success_title') }}
</flux:heading> </flux:heading>

6
resources/views/livewire/pages/booking.blade.php
View File

@ -191,7 +191,7 @@ new #[Layout('components.layouts.public')] class extends Component
}; ?> }; ?>
<div class="max-w-4xl mx-auto py-8 px-4"> <div class="max-w-4xl mx-auto py-8 px-4">
<flux:heading size="xl" class="mb-6"> <flux:heading size="xl" class="mb-6 text-body">
{{ __('booking.request_consultation') }} {{ __('booking.request_consultation') }}
</flux:heading> </flux:heading>
@ -204,7 +204,7 @@ new #[Layout('components.layouts.public')] class extends Component
@if(!$selectedDate || !$selectedTime) @if(!$selectedDate || !$selectedTime)
{{-- Step 1: Calendar Selection --}} {{-- Step 1: Calendar Selection --}}
<flux:callout class="mb-6"> <flux:callout class="mb-6">
<p>{{ __('booking.guest_intro') }}</p> <p class="text-body">{{ __('booking.guest_intro') }}</p>
</flux:callout> </flux:callout>
<p class="mb-4 text-zinc-600 dark:text-zinc-400"> <p class="mb-4 text-zinc-600 dark:text-zinc-400">
@ -291,7 +291,7 @@ new #[Layout('components.layouts.public')] class extends Component
@else @else
{{-- Confirmation Step --}} {{-- Confirmation Step --}}
<flux:callout> <flux:callout>
<flux:heading size="sm">{{ __('booking.confirm_booking') }}</flux:heading> <flux:heading size="sm" class="text-body">{{ __('booking.confirm_booking') }}</flux:heading>
<p class="text-zinc-600 dark:text-zinc-400">{{ __('booking.confirm_message') }}</p> <p class="text-zinc-600 dark:text-zinc-400">{{ __('booking.confirm_message') }}</p>
<div class="mt-4 space-y-2"> <div class="mt-4 space-y-2">

22
resources/views/livewire/pages/posts/index.blade.php
View File

@ -56,7 +56,7 @@ new #[Layout('components.layouts.public')] class extends Component
}; ?> }; ?>
<div class="max-w-4xl mx-auto px-0"> <div class="max-w-4xl mx-auto px-0">
<flux:heading size="xl" class="text-text text-xl sm:text-2xl lg:text-3xl">{{ __('posts.posts') }}</flux:heading> <flux:heading size="xl" class="text-body text-xl sm:text-2xl lg:text-3xl">{{ __('posts.posts') }}</flux:heading>
<!-- Search Bar --> <!-- Search Bar -->
<div class="mt-4 sm:mt-6 relative"> <div class="mt-4 sm:mt-6 relative">
@ -66,14 +66,14 @@ new #[Layout('components.layouts.public')] class extends Component
class="w-full min-h-[44px]" class="w-full min-h-[44px]"
> >
<x-slot:iconLeading> <x-slot:iconLeading>
<flux:icon name="magnifying-glass" class="w-5 h-5 text-text/50" /> <flux:icon name="magnifying-glass" class="w-5 h-5 text-body/50" />
</x-slot:iconLeading> </x-slot:iconLeading>
</flux:input> </flux:input>
@if($search) @if($search)
<button <button
wire:click="clearSearch" wire:click="clearSearch"
class="absolute end-3 top-1/2 -translate-y-1/2 text-text/50 hover:text-text min-h-[44px] min-w-[44px] flex items-center justify-center" class="absolute end-3 top-1/2 -translate-y-1/2 text-body/50 hover:text-body min-h-[44px] min-w-[44px] flex items-center justify-center"
> >
<flux:icon name="x-mark" class="w-5 h-5" /> <flux:icon name="x-mark" class="w-5 h-5" />
</button> </button>
@ -82,7 +82,7 @@ new #[Layout('components.layouts.public')] class extends Component
<!-- Search Results Info --> <!-- Search Results Info -->
@if($search) @if($search)
<p class="mt-4 text-sm text-text/70"> <p class="mt-4 text-sm text-body/70">
@if($posts->total() > 0) @if($posts->total() > 0)
{{ __('posts.search_results', ['count' => $posts->total(), 'query' => $search]) }} {{ __('posts.search_results', ['count' => $posts->total(), 'query' => $search]) }}
@else @else
@ -95,7 +95,7 @@ new #[Layout('components.layouts.public')] class extends Component
<div class="mt-6 sm:mt-8 space-y-4 sm:space-y-6"> <div class="mt-6 sm:mt-8 space-y-4 sm:space-y-6">
@forelse($posts as $post) @forelse($posts as $post)
<article wire:key="post-{{ $post->id }}" class="bg-white p-4 sm:p-6 rounded-lg shadow-sm hover:shadow-md transition-shadow"> <article wire:key="post-{{ $post->id }}" class="bg-white p-4 sm:p-6 rounded-lg shadow-sm hover:shadow-md transition-shadow">
<h2 class="text-lg sm:text-xl font-semibold text-text"> <h2 class="text-lg sm:text-xl font-semibold text-body">
<a href="{{ route('posts.show', $post) }}" class="hover:text-primary" wire:navigate> <a href="{{ route('posts.show', $post) }}" class="hover:text-primary" wire:navigate>
@if($search) @if($search)
{!! $this->highlightSearch($post->getTitle(), $search) !!} {!! $this->highlightSearch($post->getTitle(), $search) !!}
@ -105,11 +105,11 @@ new #[Layout('components.layouts.public')] class extends Component
</a> </a>
</h2> </h2>
<time class="text-xs sm:text-sm text-text/70 mt-2 block"> <time class="text-xs sm:text-sm text-body/70 mt-2 block">
{{ $post->published_at?->translatedFormat('d F Y') ?? $post->created_at->translatedFormat('d F Y') }} {{ $post->published_at?->translatedFormat('d F Y') ?? $post->created_at->translatedFormat('d F Y') }}
</time> </time>
<p class="mt-2 sm:mt-3 text-text text-sm sm:text-base"> <p class="mt-2 sm:mt-3 text-body text-sm sm:text-base">
@if($search) @if($search)
{!! $this->highlightSearch($post->getExcerpt(), $search) !!} {!! $this->highlightSearch($post->getExcerpt(), $search) !!}
@else @else
@ -124,14 +124,14 @@ new #[Layout('components.layouts.public')] class extends Component
@empty @empty
<div class="empty-state bg-white rounded-lg"> <div class="empty-state bg-white rounded-lg">
@if($search) @if($search)
<flux:icon name="magnifying-glass" class="empty-state-icon text-text/30" /> <flux:icon name="magnifying-glass" class="empty-state-icon text-body/30" />
<p class="text-text/70">{{ __('posts.no_results', ['query' => $search]) }}</p> <p class="text-body/70">{{ __('posts.no_results', ['query' => $search]) }}</p>
<flux:button wire:click="clearSearch" class="mt-4"> <flux:button wire:click="clearSearch" class="mt-4">
{{ __('posts.clear_search') }} {{ __('posts.clear_search') }}
</flux:button> </flux:button>
@else @else
<flux:icon name="document-text" class="empty-state-icon text-text/40" /> <flux:icon name="document-text" class="empty-state-icon text-body/40" />
<p class="text-text/70">{{ __('posts.no_posts') }}</p> <p class="text-body/70">{{ __('posts.no_posts') }}</p>
@endif @endif
</div> </div>
@endforelse @endforelse

4
resources/views/livewire/pages/posts/show.blade.php
View File

@ -20,9 +20,9 @@ new #[Layout('components.layouts.public')] class extends Component
<article class="max-w-3xl mx-auto"> <article class="max-w-3xl mx-auto">
<header class="mb-8"> <header class="mb-8">
<flux:heading size="xl" class="text-text">{{ $post->getTitle() }}</flux:heading> <flux:heading size="xl" class="text-body">{{ $post->getTitle() }}</flux:heading>
<time class="text-text/70 mt-2 block"> <time class="text-body/70 mt-2 block">
{{ $post->published_at?->translatedFormat('l, d F Y') ?? $post->created_at->translatedFormat('l, d F Y') }} {{ $post->published_at?->translatedFormat('l, d F Y') ?? $post->created_at->translatedFormat('l, d F Y') }}
</time> </time>
</header> </header>

4
resources/views/pages/booking.blade.php
View File

@ -1,8 +1,8 @@
<x-layouts.public> <x-layouts.public>
<div class="py-8"> <div class="py-8">
<h1 class="text-3xl font-bold text-text mb-6">{{ __('navigation.booking') }}</h1> <h1 class="text-3xl font-bold text-body mb-6">{{ __('navigation.booking') }}</h1>
<div class="bg-white p-8 rounded-lg shadow-md"> <div class="bg-white p-8 rounded-lg shadow-md">
<p class="text-text">{{ __('Booking form will be implemented in a future story.') }}</p> <p class="text-body">{{ __('Booking form will be implemented in a future story.') }}</p>
</div> </div>
</div> </div>
</x-layouts.public> </x-layouts.public>

16
resources/views/pages/home.blade.php
View File

@ -1,20 +1,20 @@
<x-layouts.public> <x-layouts.public>
<div class="text-center py-8 sm:py-12"> <div class="text-center py-8 sm:py-12">
<h1 class="text-2xl sm:text-3xl lg:text-4xl font-bold text-text mb-4">{{ __('Libra Law Firm') }}</h1> <h1 class="text-2xl sm:text-3xl lg:text-4xl font-bold text-body mb-4">{{ __('Libra Law Firm') }}</h1>
<p class="text-text text-base sm:text-lg mb-6 sm:mb-8 px-4">{{ __('Professional legal services with integrity and excellence.') }}</p> <p class="text-body text-base sm:text-lg mb-6 sm:mb-8 px-4">{{ __('Professional legal services with integrity and excellence.') }}</p>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6 lg:gap-8 mt-8 sm:mt-12"> <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6 lg:gap-8 mt-8 sm:mt-12">
<div class="bg-white p-4 sm:p-6 rounded-lg shadow-md"> <div class="bg-white p-4 sm:p-6 rounded-lg shadow-md">
<h3 class="text-lg sm:text-xl font-semibold text-text mb-2">{{ __('Expert Consultations') }}</h3> <h3 class="text-lg sm:text-xl font-semibold text-body mb-2">{{ __('Expert Consultations') }}</h3>
<p class="text-text text-sm sm:text-base">{{ __('Professional legal advice tailored to your needs.') }}</p> <p class="text-body text-sm sm:text-base">{{ __('Professional legal advice tailored to your needs.') }}</p>
</div> </div>
<div class="bg-white p-4 sm:p-6 rounded-lg shadow-md"> <div class="bg-white p-4 sm:p-6 rounded-lg shadow-md">
<h3 class="text-lg sm:text-xl font-semibold text-text mb-2">{{ __('Case Management') }}</h3> <h3 class="text-lg sm:text-xl font-semibold text-body mb-2">{{ __('Case Management') }}</h3>
<p class="text-text text-sm sm:text-base">{{ __('Track your cases and stay informed every step of the way.') }}</p> <p class="text-body text-sm sm:text-base">{{ __('Track your cases and stay informed every step of the way.') }}</p>
</div> </div>
<div class="bg-white p-4 sm:p-6 rounded-lg shadow-md sm:col-span-2 lg:col-span-1"> <div class="bg-white p-4 sm:p-6 rounded-lg shadow-md sm:col-span-2 lg:col-span-1">
<h3 class="text-lg sm:text-xl font-semibold text-text mb-2">{{ __('Legal Resources') }}</h3> <h3 class="text-lg sm:text-xl font-semibold text-body mb-2">{{ __('Legal Resources') }}</h3>
<p class="text-text text-sm sm:text-base">{{ __('Access our library of legal insights and articles.') }}</p> <p class="text-body text-sm sm:text-base">{{ __('Access our library of legal insights and articles.') }}</p>
</div> </div>
</div> </div>
</div> </div>

4
resources/views/pages/legal.blade.php
View File

@ -1,11 +1,11 @@
<x-layouts.public> <x-layouts.public>
<div class="py-8"> <div class="py-8">
<h1 class="mb-6 text-3xl font-bold text-text dark:text-off-white">{{ $page->getTitle() }}</h1> <h1 class="mb-6 text-3xl font-bold text-body dark:text-off-white">{{ $page->getTitle() }}</h1>
<div class="prose max-w-none rounded-lg bg-white p-8 shadow-md dark:bg-zinc-800 dark:prose-invert" dir="{{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }}"> <div class="prose max-w-none rounded-lg bg-white p-8 shadow-md dark:bg-zinc-800 dark:prose-invert" dir="{{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }}">
@if ($page->getContent()) @if ($page->getContent())
{!! clean($page->getContent()) !!} {!! clean($page->getContent()) !!}
@else @else
<p class="text-text dark:text-zinc-400">{{ __('pages.content_coming_soon') }}</p> <p class="text-body dark:text-zinc-400">{{ __('pages.content_coming_soon') }}</p>
@endif @endif
</div> </div>
<p class="mt-4 text-sm text-zinc-500 dark:text-zinc-400"> <p class="mt-4 text-sm text-zinc-500 dark:text-zinc-400">

4
resources/views/pages/privacy.blade.php
View File

@ -1,8 +1,8 @@
<x-layouts.public> <x-layouts.public>
<div class="py-8"> <div class="py-8">
<h1 class="text-3xl font-bold text-text mb-6">{{ __('footer.privacy') }}</h1> <h1 class="text-3xl font-bold text-body mb-6">{{ __('footer.privacy') }}</h1>
<div class="bg-white p-8 rounded-lg shadow-md prose max-w-none"> <div class="bg-white p-8 rounded-lg shadow-md prose max-w-none">
<p class="text-text">{{ __('Privacy policy content will be added here.') }}</p> <p class="text-body">{{ __('Privacy policy content will be added here.') }}</p>
</div> </div>
</div> </div>
</x-layouts.public> </x-layouts.public>

4
resources/views/pages/terms.blade.php
View File

@ -1,8 +1,8 @@
<x-layouts.public> <x-layouts.public>
<div class="py-8"> <div class="py-8">
<h1 class="text-3xl font-bold text-text mb-6">{{ __('footer.terms') }}</h1> <h1 class="text-3xl font-bold text-body mb-6">{{ __('footer.terms') }}</h1>
<div class="bg-white p-8 rounded-lg shadow-md prose max-w-none"> <div class="bg-white p-8 rounded-lg shadow-md prose max-w-none">
<p class="text-text">{{ __('Terms of service content will be added here.') }}</p> <p class="text-body">{{ __('Terms of service content will be added here.') }}</p>
</div> </div>
</div> </div>
</x-layouts.public> </x-layouts.public>