diff --git a/docs/stories/story-16.3-values-section.md b/docs/stories/story-16.3-values-section.md index b01ead6..95d0598 100644 --- a/docs/stories/story-16.3-values-section.md +++ b/docs/stories/story-16.3-values-section.md @@ -207,16 +207,16 @@ ## Dev Checklist -- [ ] Add values section to about.blade.php -- [ ] Style section header with gold underline -- [ ] Add intro text -- [ ] Create 6 value cards with icons -- [ ] Implement responsive grid (6 → 3 → 2 columns) -- [ ] Add hover effects to cards -- [ ] Add all English translations -- [ ] Add all Arabic translations -- [ ] Test RTL layout -- [ ] Test responsive breakpoints +- [x] Add values section to about.blade.php +- [x] Style section header with gold underline +- [x] Add intro text +- [x] Create 6 value cards with icons +- [x] Implement responsive grid (6 → 3 → 2 columns) +- [x] Add hover effects to cards +- [x] Add all English translations +- [x] Add all Arabic translations +- [x] Test RTL layout +- [x] Test responsive breakpoints ## Estimation @@ -227,3 +227,31 @@ - Story 16.2 completed (mission section exists above) - Flux icons available + +--- + +## Dev Agent Record + +### Status +Ready for Review + +### Agent Model Used +claude-opus-4-5-20251101 + +### Completion Notes +- Added values section with 6 value cards following the exact HTML structure from technical notes +- Implemented responsive grid: 2 cols mobile, 3 cols tablet, 6 cols desktop +- Added all English and Arabic translations for values section +- Used Flux icons: shield-check, scale, academic-cap, heart, briefcase, light-bulb +- Added hover shadow effect on cards +- All 19 new tests pass (52 total AboutPageTest tests pass) +- RTL support works automatically with centered text and grid layout + +### File List +- `resources/views/livewire/pages/about.blade.php` (modified) +- `lang/en/about.php` (modified) +- `lang/ar/about.php` (modified) +- `tests/Feature/Public/AboutPageTest.php` (modified) + +### Change Log +- 2026-01-11: Implemented Story 16.3 values section with all acceptance criteria met diff --git a/lang/ar/about.php b/lang/ar/about.php index 0d3e58f..3dc18e6 100644 --- a/lang/ar/about.php +++ b/lang/ar/about.php @@ -17,4 +17,14 @@ return [ 'mission_society_text' => 'تطمح ليبرا إلى إنشاء "منحة ليبرا للقانون والفنون الفلسطينية"، وإعادة ربط المجتمع بتاريخه وإرثه القانوني، والعمل كشريك موثوق للقضاء.', 'mission_diaspora_title' => 'للفلسطينيين في الشتات', 'mission_diaspora_text' => 'ليبرا منصة للاستماع إلى الفلسطينيين في الشتات وتعزيز ارتباطهم بالأرض الفلسطينية من خلال مساعدتهم في البحث والتحقيق في عائلاتهم وتاريخهم، والبحث في أراضيهم، وتوفير منصة للاستماع إلى آرائهم حول القضية الفلسطينية والمجتمعات الفلسطينية في الخارج.', + + // Values Section + 'values_title' => 'قيمنا', + 'values_intro' => 'هذه القيم تبدأ من الميدان وتعود إلى الناس.', + 'value_integrity' => 'النزاهة', + 'value_justice' => 'العدالة', + 'value_knowledge' => 'المعرفة', + 'value_women' => 'تمكين المرأة', + 'value_professionalism' => 'الاحترافية', + 'value_innovation' => 'الابتكار الاجتماعي', ]; diff --git a/lang/en/about.php b/lang/en/about.php index aca5198..5f2d953 100644 --- a/lang/en/about.php +++ b/lang/en/about.php @@ -17,4 +17,14 @@ return [ 'mission_society_text' => 'Libra aspires to establish the "Libra Scholarship for Law and Palestinian Arts", reconnect society with its history and legal heritage, and serve as a trusted partner to the judiciary.', 'mission_diaspora_title' => 'For Palestinians in the Diaspora', 'mission_diaspora_text' => 'Libra is a platform for listening to Palestinians in the diaspora and strengthening their connection to the Palestinian land by helping them research and investigate their families and history, research and investigate their lands, and providing them with a platform to hear their views on the Palestinian issue and Palestinian communities abroad.', + + // Values Section + 'values_title' => 'Our Values', + 'values_intro' => 'These values start in the field and return to the people.', + 'value_integrity' => 'Integrity', + 'value_justice' => 'Justice', + 'value_knowledge' => 'Knowledge', + 'value_women' => 'Women\'s Empowerment', + 'value_professionalism' => 'Professionalism', + 'value_innovation' => 'Social Innovation', ]; diff --git a/resources/views/livewire/pages/about.blade.php b/resources/views/livewire/pages/about.blade.php index 98edfff..6062749 100644 --- a/resources/views/livewire/pages/about.blade.php +++ b/resources/views/livewire/pages/about.blade.php @@ -95,7 +95,80 @@ new #[Layout('components.layouts.public')] class extends Component - {{-- Values Section - Story 16.3 --}} + {{-- Values Section --}} +
+
+

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

+
+

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

+ +
+ {{-- Integrity --}} +
+
+ +
+

+ {{ __('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') }} +

+
+
+
+
{{-- Goals Section - Story 16.4 --}} diff --git a/tests/Feature/Public/AboutPageTest.php b/tests/Feature/Public/AboutPageTest.php index 2141b7b..5bcd0a3 100644 --- a/tests/Feature/Public/AboutPageTest.php +++ b/tests/Feature/Public/AboutPageTest.php @@ -246,3 +246,142 @@ test('about page mission cards have icons', function () { ->assertOk() ->assertSee('get('/about') + ->assertOk() + ->assertSee('bg-white py-8 sm:py-12 lg:py-[60px]', false); +}); + +// AC2: Values Section Header +test('about page displays values title in English', function () { + $this->withSession(['locale' => 'en']) + ->get('/about') + ->assertOk() + ->assertSee('Our Values'); +}); + +test('about page displays values title in Arabic', function () { + $this->withSession(['locale' => 'ar']) + ->get('/about') + ->assertOk() + ->assertSee('قيمنا'); +}); + +// AC3: Values Introduction +test('about page displays values intro in English', function () { + $this->withSession(['locale' => 'en']) + ->get('/about') + ->assertOk() + ->assertSee('These values start in the field and return to the people.'); +}); + +test('about page displays values intro in Arabic', function () { + $this->withSession(['locale' => 'ar']) + ->get('/about') + ->assertOk() + ->assertSee('هذه القيم تبدأ من الميدان وتعود إلى الناس.'); +}); + +// AC4: Six Value Cards - English +test('about page displays integrity value in English', function () { + $this->withSession(['locale' => 'en']) + ->get('/about') + ->assertOk() + ->assertSee('Integrity'); +}); + +test('about page displays justice value in English', function () { + $this->withSession(['locale' => 'en']) + ->get('/about') + ->assertOk() + ->assertSee('Justice'); +}); + +test('about page displays knowledge value in English', function () { + $this->withSession(['locale' => 'en']) + ->get('/about') + ->assertOk() + ->assertSee('Knowledge'); +}); + +test('about page displays women empowerment value in English', function () { + $this->withSession(['locale' => 'en']) + ->get('/about') + ->assertOk() + ->assertSee("Women's Empowerment"); +}); + +test('about page displays professionalism value in English', function () { + $this->withSession(['locale' => 'en']) + ->get('/about') + ->assertOk() + ->assertSee('Professionalism'); +}); + +test('about page displays social innovation value in English', function () { + $this->withSession(['locale' => 'en']) + ->get('/about') + ->assertOk() + ->assertSee('Social Innovation'); +}); + +// AC4: Six Value Cards - Arabic +test('about page displays integrity value in Arabic', function () { + $this->withSession(['locale' => 'ar']) + ->get('/about') + ->assertOk() + ->assertSee('النزاهة'); +}); + +test('about page displays justice value in Arabic', function () { + $this->withSession(['locale' => 'ar']) + ->get('/about') + ->assertOk() + ->assertSee('العدالة'); +}); + +test('about page displays knowledge value in Arabic', function () { + $this->withSession(['locale' => 'ar']) + ->get('/about') + ->assertOk() + ->assertSee('المعرفة'); +}); + +test('about page displays women empowerment value in Arabic', function () { + $this->withSession(['locale' => 'ar']) + ->get('/about') + ->assertOk() + ->assertSee('تمكين المرأة'); +}); + +test('about page displays professionalism value in Arabic', function () { + $this->withSession(['locale' => 'ar']) + ->get('/about') + ->assertOk() + ->assertSee('الاحترافية'); +}); + +test('about page displays social innovation value in Arabic', function () { + $this->withSession(['locale' => 'ar']) + ->get('/about') + ->assertOk() + ->assertSee('الابتكار الاجتماعي'); +}); + +// AC5: Value Card Styling +test('about page value cards have correct styling', function () { + $this->get('/about') + ->assertOk() + ->assertSee('bg-background rounded-xl p-6 text-center hover:shadow-md transition-shadow', false); +}); + +// AC6: Responsive Grid +test('about page value cards use responsive grid', function () { + $this->get('/about') + ->assertOk() + ->assertSee('grid-cols-2 md:grid-cols-3 lg:grid-cols-6', false); +});