Match Nablus workshop form's background/card styling to the rest of the site

Reused existing, already-compiled design-system pieces instead of ad hoc
inline colors: the login page's auth-pattern background (public/images/
auth-pattern.svg) on the standalone layout, and the reusable <x-ui.card
highlight> component (Warm Gold accent border) for the form card. Replaced
inline style="color: #2D322A" with the text-body token.

Also fixes the actual root cause behind "the picture still looks the same"
from the prior two tasks: public/build's compiled CSS was stale (last built
Jan 17, before this session), so max-h-40/max-h-64 were never in the
generated stylesheet. Rebuilt via npm run build and verified the new classes
compile; production has its own deploy-time build so this shouldn't recur
there.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Naser Mansour
2026-09-28 00:12:07 +03:00
parent 4258b5d2e7
commit 7b708d2fd7
4 changed files with 145 additions and 8 deletions
@@ -42,11 +42,11 @@ new #[Layout('components.layouts.standalone')] class extends Component
class="max-h-40 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)">
<h1 class="text-2xl font-bold mb-2" style="color: #2D322A">تسجيل في ورشة عمل ريادايات نابلس</h1>
<p class="mb-4" style="color: #2D322A">تخططين لإطلاق مشروعك الخاص أو تطوير تجارتك الإلكترونية؟ 🚀</p>
<x-ui.card highlight>
<h1 class="text-2xl font-bold mb-2 text-body">تسجيل في ورشة عمل ريادايات نابلس</h1>
<p class="mb-4 text-body">تخططين لإطلاق مشروعك الخاص أو تطوير تجارتك الإلكترونية؟ 🚀</p>
<p class="text-sm leading-relaxed mb-6" style="color: #2D322A">
<p class="text-sm leading-relaxed mb-6 text-body">
ندعوكم للانضمام إلينا في ورشة عمل متخصصة وشاملة تجمع بين القانون، التسويق الرقمي، وإدارة
المتاجر الإلكترونية لبناء مشروعك على أسس متينة وناجحة! 🎯📊💡
<br><br>
@@ -97,5 +97,5 @@ new #[Layout('components.layouts.standalone')] class extends Component
إرسال
</flux:button>
</form>
</div>
</x-ui.card>
</div>