From 7879ac719013df2f65f5ecce2c3a9ea4ae52c7f2 Mon Sep 17 00:00:00 2001 From: Naser Mansour Date: Sat, 31 Oct 2026 18:52:36 +0200 Subject: [PATCH] =?UTF-8?q?24-7:=20about=20page=20=E2=80=94=20implemented,?= =?UTF-8?q?=20QA=20Review?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Sonnet 5.5 --- docs/tasks/24-7.md | 2 +- docs/tasks/manual-tests/24-7.md | 10 + docs/tasks/statuses.md | 2 +- lang/ar/site.php | 5 + lang/en/site.php | 5 + resources/css/public.css | 6 + .../views/livewire/pages/about.blade.php | 349 +++++------------- tests/Feature/Design/AboutRedesignTest.php | 63 ++++ 8 files changed, 177 insertions(+), 265 deletions(-) create mode 100644 docs/tasks/manual-tests/24-7.md create mode 100644 tests/Feature/Design/AboutRedesignTest.php diff --git a/docs/tasks/24-7.md b/docs/tasks/24-7.md index b034923..f38fa9a 100644 --- a/docs/tasks/24-7.md +++ b/docs/tasks/24-7.md @@ -1,7 +1,7 @@ --- id: 24-7 title: 24-7 About Page -status: Ready for Dev +status: QA Review date: 2026-10-31 parent: 24 --- diff --git a/docs/tasks/manual-tests/24-7.md b/docs/tasks/manual-tests/24-7.md new file mode 100644 index 0000000..52056c3 --- /dev/null +++ b/docs/tasks/manual-tests/24-7.md @@ -0,0 +1,10 @@ +# Manual tests — 24-7 About Page + +Automated (passed 2026-10-31, `tests/Feature/Design/AboutRedesignTest.php`, 5 tests): the sections in order with all existing about.* +content in ar and en (identity, vision, three mission cards, six values, seven goals, four service groups, CTA); one h1 and alt on +every image; four service rows link to `/booking`; goal rows carry the static-row CSS; no scholarship content; site keys in both +languages; `lang/*/about.php` unchanged versus BASE. UI loop on `/about`: no horizontal scroll at 390/768/1440, h1 count 1. + +- [ ] `/about` in Arabic and English: six sections look like the home page's family (hero, vision with hoop and three cards, values, goals list, services, closing band). +- [ ] Hover a goal row: nothing fills. Hover a service row: fills forest, arrow button turns gold, row links to the booking page. +- [ ] 390px: goal numbers narrow (52px column), nothing overflows sideways. diff --git a/docs/tasks/statuses.md b/docs/tasks/statuses.md index dfd18be..ef40e68 100644 --- a/docs/tasks/statuses.md +++ b/docs/tasks/statuses.md @@ -143,7 +143,7 @@ | 24-4 | 24-4 Home Page Sections (Hero to Latest Articles) | QA Review | | 24-5 | 24-5 Home Booking Card (Compact Booking and Day Strip) | QA Review | | 24-6 | 24-6 Booking Page and Booking Success | QA Review | -| 24-7 | 24-7 About Page | Ready for Dev | +| 24-7 | 24-7 About Page | QA Review | | 24-8 | 24-8 Articles and Legal Pages | Ready for Dev | | 24-9 | 24-9 Auth Pages Type and Controls | Ready for Dev | | 24-10 | 24-10 Redesign Integration Verification | Ready for Dev | diff --git a/lang/ar/site.php b/lang/ar/site.php index 739df20..2dcf98d 100644 --- a/lang/ar/site.php +++ b/lang/ar/site.php @@ -72,4 +72,9 @@ return [ 'booking_submit' => 'اطلب هذا الموعد', 'booking_none' => 'لا توجد مواعيد متاحة حالياً', 'captcha_refresh' => 'سؤال جديد', + 'about_art_vision' => 'المادة ٠١ — الرؤية والرسالة', + 'about_art_values' => 'المادة ٠٢ — القيم', + 'about_art_goals' => 'المادة ٠٣ — الأهداف', + 'about_art_services' => 'المادة ٠٤ — الخدمات', + 'about_cta_title' => 'لكلّ حقٍّ وزنُه', ]; diff --git a/lang/en/site.php b/lang/en/site.php index 8760e65..aa3f7f3 100644 --- a/lang/en/site.php +++ b/lang/en/site.php @@ -72,4 +72,9 @@ return [ 'booking_submit' => 'Request this appointment', 'booking_none' => 'No times are available at the moment', 'captcha_refresh' => 'New question', + 'about_art_vision' => 'Article 01 — Vision and mission', + 'about_art_values' => 'Article 02 — Values', + 'about_art_goals' => 'Article 03 — Goals', + 'about_art_services' => 'Article 04 — Services', + 'about_cta_title' => 'Every right carries its weight', ]; diff --git a/resources/css/public.css b/resources/css/public.css index c7abef2..ae4c0eb 100644 --- a/resources/css/public.css +++ b/resources/css/public.css @@ -332,6 +332,12 @@ body.site .success-card{max-width:560px;margin-inline:auto;background:var(--crea body.site .success-card h1{font-size:clamp(2rem,3.4vw,2.6rem);margin-bottom:12px} body.site .success-card p{color:var(--muted);margin:0 0 26px} +/* ---------- About page (24-7) ---------- */ +body.site .row-static{grid-template-columns:90px 1fr} +body.site .row-static:hover{background:none;color:inherit;transform:none;box-shadow:none} +body.site .row-static::before{display:none} +@media (max-width:760px){body.site .row-static{grid-template-columns:52px 1fr}} + /* ---------- Reveal (hidden only when JavaScript runs) ---------- */ body.site.js [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)} body.site.js [data-reveal].in{opacity:1;transform:none} diff --git a/resources/views/livewire/pages/about.blade.php b/resources/views/livewire/pages/about.blade.php index ea5f1f1..837277d 100644 --- a/resources/views/livewire/pages/about.blade.php +++ b/resources/views/livewire/pages/about.blade.php @@ -9,288 +9,111 @@ new #[Layout('components.layouts.public')] class extends Component }; ?>
-
- {{-- Hero Section --}} -
-
- {{-- Page Title --}} -

- {{ __('about.title') }} -

- - {{-- Tagline --}} -

- {{ __('about.tagline') }} -

- - {{-- Identity Statement --}} -

- {{ __('about.identity') }} -

+ {{-- Hero --}} +
+
+ {{ __('about.tagline') }} +

{{ __('about.title') }}

+

{{ __('about.identity') }}

- {{-- Vision Section --}} -
-
-

- {{ __('about.vision_title') }} -

-
-
- " - {{ __('about.vision_text') }} - " -
-
-
- - {{-- Mission Section --}} -
-
-

- {{ __('about.mission_title') }} -

-
-
-

- {{ __('about.mission_intro') }} -

+ {{-- Vision and mission --}} +
+
+
+
+ {{ __('site.about_art_vision') }} +

{{ __('about.vision_title') }}

+

{{ __('about.vision_text') }}

+

{{ __('about.mission_title') }}

+

{{ __('about.mission_intro') }}

+
+
{{ __('site.alt_hoop') }}
- -
- {{-- Card 1: For Institution --}} -
-
- -
-

- {{ __('about.mission_institution_title') }} -

-

- {{ __('about.mission_institution_text') }} -

-
- - {{-- Card 2: For Society --}} -
-
- -
-

- {{ __('about.mission_society_title') }} -

-

- {{ __('about.mission_society_text') }} -

-
- - {{-- Card 3: For Diaspora --}} -
-
- -
-

- {{ __('about.mission_diaspora_title') }} -

-

- {{ __('about.mission_diaspora_text') }} -

-
+
+
+
{{ __('site.card_institution_label') }}
+

{{ __('about.mission_institution_title') }}

{{ __('about.mission_institution_text') }}

+
+
+
{{ __('site.alt_olives') }}{{ __('site.card_society_label') }}
+

{{ __('about.mission_society_title') }}

{{ __('about.mission_society_text') }}

+
+
+
{{ __('site.alt_hills') }}{{ __('site.card_diaspora_label') }}
+

{{ __('about.mission_diaspora_title') }}

{{ __('about.mission_diaspora_text') }}

+
- {{-- Values Section --}} -
-
-

- {{ __('about.values_title') }} -

-
-

- {{ __('about.values_intro') }} -

- -
- {{-- Integrity --}} -
-
- + {{-- Values --}} +
+
+ + @php + $valueIcons = [ + '', + '', + '', + '', + '', + '', + ]; + @endphp +
+ @foreach (['integrity', 'justice', 'knowledge', 'women', 'professionalism', 'innovation'] as $i => $value) +
+ + {{ __('about.value_'.$value) }}
-

- {{ __('about.value_integrity') }} -

-
- - {{-- Justice --}} -
-
- -
-

- {{ __('about.value_justice') }} -

-
- - {{-- Knowledge --}} -
-
- -
-

- {{ __('about.value_knowledge') }} -

-
- - {{-- Women's Empowerment --}} -
-
- -
-

- {{ __('about.value_women') }} -

-
- - {{-- Professionalism --}} -
-
- -
-

- {{ __('about.value_professionalism') }} -

-
- - {{-- Social Innovation --}} -
-
- -
-

- {{ __('about.value_innovation') }} -

-
+ @endforeach
- {{-- Goals Section --}} -
-
-

- {{ __('about.goals_title') }} -

-
+ {{-- Goals --}} +
+
+ +
    + @foreach (__('about.goals') as $i => $goal) +
  1. + {{ sprintf('%02d', $i + 1) }} +

    {{ $goal }}

    +
    2. + @endforeach +
+
+
-
-
- @foreach(__('about.goals') as $index => $goal) -
- - {{ $index + 1 }} - -

{{ $goal }}

+ {{-- Legal services --}} +
+
+ +
+ @foreach (['consultation', 'family', 'civil', 'business'] as $i => $service) + + {{ sprintf('%02d', $i + 1) }} +

{{ __('about.service_'.$service.'_title') }}

+
+ @foreach (__('about.service_'.$service.'_items') as $item) + {{ $item }} + @endforeach
- @endforeach -
+ + + @endforeach
- {{-- Services Section --}} -
-
-

- {{ __('about.services_title') }} -

-
-

- {{ __('about.services_intro') }} -

- -
- {{-- Legal Consultations & Representation --}} -
-
- -
-

- {{ __('about.service_consultation_title') }} -

-
    - @foreach(__('about.service_consultation_items') as $item) -
  • - - {{ $item }} -
    • - @endforeach -
-
- - {{-- Women's & Family Law --}} -
-
- -
-

- {{ __('about.service_family_title') }} -

-
    - @foreach(__('about.service_family_items') as $item) -
  • - - {{ $item }} -
    • - @endforeach -
-
- - {{-- Civil & Commercial Disputes --}} -
-
- -
-

- {{ __('about.service_civil_title') }} -

-
    - @foreach(__('about.service_civil_items') as $item) -
  • - - {{ $item }} -
    • - @endforeach -
-
- - {{-- Business Legal Services --}} -
-
- -
-

- {{ __('about.service_business_title') }} -

-
    - @foreach(__('about.service_business_items') as $item) -
  • - - {{ $item }} -
    • - @endforeach -
-
-
- -
- - {{ __('about.services_cta') }} - -
+ {{-- Closing call to action --}} +
+
+

{{ __('site.about_cta_title') }}

+

{{ __('about.services_cta') }}

- -
diff --git a/tests/Feature/Design/AboutRedesignTest.php b/tests/Feature/Design/AboutRedesignTest.php new file mode 100644 index 0000000..47f6008 --- /dev/null +++ b/tests/Feature/Design/AboutRedesignTest.php @@ -0,0 +1,63 @@ +withSession(['locale' => $locale])->get('/about')->assertOk()->getContent(); +} + +test('about renders its sections in order with the existing content in both languages', function () { + foreach (['ar', 'en'] as $locale) { + $html = aboutHtml($locale); + app()->setLocale($locale); + + $needles = [ + __('about.title'), __('about.identity'), __('about.vision_title'), __('about.mission_institution_title'), + __('about.mission_society_title'), __('about.mission_diaspora_title'), __('about.values_title'), __('about.value_women'), + __('about.goals_title'), __('about.goals')[6], __('about.services_title'), __('about.service_business_items')[0], + __('site.about_cta_title'), __('about.services_cta'), + ]; + $last = -1; + foreach ($needles as $n) { + $pos = strpos($html, e($n), $last + 1); + $pos = $pos === false ? strpos($html, $n, $last + 1) : $pos; + expect($pos)->not->toBeFalse("missing or out of order [$locale]: $n"); + $last = $pos; + } + + expect(substr_count($html, 'class="sampler"'))->toBe(1); + expect(substr_count($html, 'class="val"'))->toBe(6); + expect(substr_count($html, 'row row-static'))->toBe(7); + } +}); + +test('about has one h1 and alt text on every image', function () { + $html = aboutHtml('ar'); + expect(substr_count($html, 'toBe(1); + preg_match_all('/]*>/', $html, $m); + foreach ($m[0] as $img) { + expect($img)->toMatch('/\balt="[^"]+"/'); + } +}); + +test('service rows link to booking and goal rows are static', function () { + $html = aboutHtml('en'); + expect(substr_count($html, 'toBe(4); + expect(substr_count($html, 'href="'.route('booking').'"'))->toBeGreaterThanOrEqual(5); + expect(file_get_contents(resource_path('css/public.css'))) + ->toContain('body.site .row-static{grid-template-columns:90px 1fr}') + ->toContain('body.site .row-static:hover{background:none;color:inherit;transform:none;box-shadow:none}') + ->toContain('body.site .row-static::before{display:none}'); +}); + +test('about page contains no scholarship content', function () { + expect(file_get_contents(resource_path('views/livewire/pages/about.blade.php')))->not->toContain('scholarship'); +}); + +test('about site keys exist in both languages', function () { + foreach (['ar', 'en'] as $locale) { + $t = require base_path("lang/$locale/site.php"); + foreach (['about_art_vision', 'about_art_values', 'about_art_goals', 'about_art_services', 'about_cta_title'] as $k) { + expect($t)->toHaveKey($k); + } + } +});