Replit Agent c7573c35bf Task #14: Black Ayah & Scroll Reveal (EHSAN POC)
Two refinements to match ehsan.sa on artifacts/ehsan-poc:

1. Black ayah: the ayah artwork below the hero
   («وأحسنوا إنّ الله يحبّ المحسنين») now renders solid black
   instead of green via Tailwind `brightness-0` on the <img>.
   Ornaments and centered layout unchanged.

2. Scroll-reveal motion: added a reusable Reveal component
   (src/components/Reveal.tsx) built on the existing framer-motion
   dependency. It fades + translates children up (y:28 -> 0) when
   they scroll into view, animates once (viewport once:true,
   amount 0.2), supports an optional stagger `delay`, and falls
   back to a plain div when prefers-reduced-motion is set.

   Applied on:
   - home.tsx: stats row (2 cards, staggered), featured
     opportunity cards grid (staggered by column), workflow-steps
     grid (staggered by column).
   - opportunities.tsx: opportunity cards grid (staggered).

   Added `h-full` to the OpportunityCard root and to the Reveal
   wrappers / wrapped Cards so the motion wrapper becoming the grid
   item does not break equal-height cards.

Out of scope (unchanged): two-card stats layout, nav, services
mega-menu, hero slider/carousel, copy. No scroll animation on
header/nav or hero.

Verified: tsc --noEmit passes; restarted ehsan-poc web workflow
to clear HMR; screenshot confirms the ayah is black.
2026-06-05 19:11:34 +00:00
2026-05-28 23:37:31 +00:00
2026-05-28 23:37:31 +00:00
2026-05-28 23:37:31 +00:00
2026-05-28 23:37:31 +00:00
2026-05-28 23:37:31 +00:00
2026-05-28 23:37:31 +00:00
2026-05-28 23:37:31 +00:00
2026-05-28 23:37:31 +00:00
2026-05-28 23:37:31 +00:00
S
Description
Ehsan Donation Platform POC
19 MiB
Languages
TypeScript 96%
CSS 2.1%
HTML 0.8%
Shell 0.6%
JavaScript 0.5%