From ecdad8dbd24593bc8370b6b2d2544be735388bce Mon Sep 17 00:00:00 2001
From: Naser Mansour <naser@aumix.com>
Date: Mon, 28 Sep 2026 00:00:47 +0300
Subject: [PATCH] Shrink oversized flyer image and logo on Nablus workshop form
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Flyer capped to max-h-64 (was w-full, ~640x853px dominating the page); logo
reduced to h-10 (was h-16), matching the site's own sm-logo convention.
Pure styling change, no logic — 7/7 existing tests unchanged and passing.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 docs/tasks/18.md                              | 71 +++++++++++++++++++
 docs/tasks/statuses.md                        |  1 +
 .../pages/forms/nablus-workshop.blade.php     |  4 +-
 3 files changed, 74 insertions(+), 2 deletions(-)
 create mode 100644 docs/tasks/18.md

diff --git a/docs/tasks/18.md b/docs/tasks/18.md
new file mode 100644
index 0000000..4c2bb2a
--- /dev/null
+++ b/docs/tasks/18.md
@@ -0,0 +1,71 @@
+---
+id: 18
+title: 18 Nablus Workshop Form - Image Sizing Fix
+status: Done
+date: 2026-09-27
+parent: null
+---
+
+## Description
+
+Naser reviewed the Nablus workshop registration page (task 17, shipped in commit `690c223`) and
+found the flyer image and the logo render far too large. Fix the sizing in
+`resources/views/livewire/pages/forms/nablus-workshop.blade.php` — a pure styling change, no
+logic involved.
+
+**File to modify:** `resources/views/livewire/pages/forms/nablus-workshop.blade.php`
+
+Current flyer image markup (around line 39-43):
+
+```blade
+    <img
+        src="{{ asset('images/workshop-nablus-flyer.jpeg') }}"
+        alt="ورشة متخصصة: القانون، التسويق الرقمي، وإدارة المتاجر الإلكترونية"
+        class="w-full rounded-lg shadow-[0_2px_8px_rgba(0,0,0,0.1)]"
+    />
+```
+
+The image is 1086x1448px (portrait). `w-full` inside the page's `max-w-[640px]` container
+scales it to roughly 640x853px, which dominates the page above the fold on both desktop and
+mobile. The full workshop agenda text is already duplicated in the paragraph immediately below
+this image (same file, further down), so the image is decorative here, not the only source of
+that information — it can be shown at a much smaller, capped size without losing information.
+
+Change the class to cap its height and center it as a modest banner rather than a full-width
+hero:
+
+```blade
+        class="max-h-64 w-auto mx-auto rounded-lg shadow-[0_2px_8px_rgba(0,0,0,0.1)]"
+```
+
+Current logo markup (around line 46):
+
+```blade
+        <img src="{{ asset('images/logo.png') }}" alt="LIBRA for Rights" class="h-16 w-auto object-contain mb-4" />
+```
+
+`h-16` (64px) is larger than this project's own logo-size convention for a compact card header —
+`resources/views/components/logo.blade.php` defines `sm` as `h-10 w-10` (40px, its own comment
+says "Mobile nav") and `md` as `h-12 w-12` (48px, "Desktop nav"). Change the class to match the
+`sm` convention:
+
+```blade
+        <img src="{{ asset('images/logo.png') }}" alt="LIBRA for Rights" class="h-10 w-auto object-contain mb-4" />
+```
+
+No other part of the file changes. No route, layout, mailable, or validation logic is affected.
+
+## Acceptance Criteria
+
+- [ ] `resources/views/livewire/pages/forms/nablus-workshop.blade.php`'s flyer `<img>` tag's
+      class attribute contains `max-h-64` and does not contain `w-full`
+- [ ] The same file's logo `<img>` tag's class attribute contains `h-10` and does not contain
+      `h-16`
+- [ ] Visiting `/forms/nablus-workshop` still returns HTTP 200 (no markup breakage introduced)
+- [ ] The existing test suite for this page (`tests/Feature/Public/NablusWorkshopRegistrationTest.php`)
+      still passes unchanged — this is a styling-only change, it must not alter any of that
+      test's assertions
+
+## Sub-tasks
+
+None.
diff --git a/docs/tasks/statuses.md b/docs/tasks/statuses.md
index 3d97d98..2e33e3c 100644
--- a/docs/tasks/statuses.md
+++ b/docs/tasks/statuses.md
@@ -126,3 +126,4 @@
 | 17 | 17 Nablus Workshop Registration Form | Done |
 | 17-1 | 17-1 Registration mailable and email template | Done |
 | 17-2 | 17-2 Standalone registration page, form, and submit wiring | Done |
+| 18 | 18 Nablus Workshop Form - Image Sizing Fix | Done |
diff --git a/resources/views/livewire/pages/forms/nablus-workshop.blade.php b/resources/views/livewire/pages/forms/nablus-workshop.blade.php
index 4ac8cf5..a59a733 100644
--- a/resources/views/livewire/pages/forms/nablus-workshop.blade.php
+++ b/resources/views/livewire/pages/forms/nablus-workshop.blade.php
@@ -39,11 +39,11 @@ new #[Layout('components.layouts.standalone')] class extends Component
     <img
         src="{{ asset('images/workshop-nablus-flyer.jpeg') }}"
         alt="ورشة متخصصة: القانون، التسويق الرقمي، وإدارة المتاجر الإلكترونية"
-        class="w-full rounded-lg shadow-[0_2px_8px_rgba(0,0,0,0.1)]"
+        class="max-h-64 w-auto mx-auto rounded-lg shadow-[0_2px_8px_rgba(0,0,0,0.1)]"
     />
 
     <div class="bg-white rounded-lg p-6" style="box-shadow: 0 2px 8px rgba(0,0,0,0.1)">
-        <img src="{{ asset('images/logo.png') }}" alt="LIBRA for Rights" class="h-16 w-auto object-contain mb-4" />
+        <img src="{{ asset('images/logo.png') }}" alt="LIBRA for Rights" class="h-10 w-auto object-contain mb-4" />
 
         <h1 class="text-2xl font-bold mb-2" style="color: #2D322A">تسجيل في ورشة عمل ريادايات نابلس</h1>
         <p class="mb-4" style="color: #2D322A">تخططين لإطلاق مشروعك الخاص أو تطوير تجارتك الإلكترونية؟ 🚀</p>