Visual overhaul — gallery photos integrated across all pages
Homepage: - The Challenge: woman-carrying-water evidence photo beside text - 4 pillar cards: thumbnail images (borehole, ponds, market, classroom) - Water tank sunset photo break before How We Work Approach: - Full-bleed photo hero (pond construction workers) - All 4 pillar sections: replaced generic photos with exact gallery matches - Solar panel evidence photo beside battery incident transparency story Projects: - Full-bleed photo hero (fish ponds aerial) - Photo mosaic: harvest, construction, catfish closeup - Water well card: borehole photo, School card: classroom photo - Drone overview photo break between sections About: - Full-bleed photo hero (community meeting) - Hands-with-seedling evidence block for 'from the ground up' - Fish ponds photo break between Team and Structure Support: - Full-bleed photo hero (hands with seedling — giving metaphor) - All 3 campaign cards: contextual header images - Water tank sunset photo break before transparency section Gallery: - Full-bleed photo hero (drone camp overview) Global: - New CSS: page-hero-visual, photo-break, evidence-block, support-card-img, pillar-card-thumb, photo-mosaic - Fixed broken nav links (double about/ tags) across all pages
This commit is contained in:
+27
-2
@@ -28,7 +28,10 @@
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<section class="page-hero">
|
||||
<section class="page-hero-visual">
|
||||
<div class="hero-bg">
|
||||
<img src="/images/gallery/community-meeting-shelter.jpg" alt="Community members gather under an open shelter to plan, discuss, and govern their own future" loading="eager">
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="label fade-up">About Us</div>
|
||||
<h1 class="fade-up">We build the system<br>that builds the community.</h1>
|
||||
@@ -55,6 +58,17 @@
|
||||
</ul>
|
||||
<p><strong>What we don't do:</strong> We don't collect donations directly. We don't issue tax receipts. We don't operate as a registered charity. This is intentional — it keeps us focused on design, management, and accountability rather than fundraising compliance.</p>
|
||||
</div>
|
||||
|
||||
<div class="evidence-block reverse fade-up mt-5">
|
||||
<div>
|
||||
<h3>From the ground up.</h3>
|
||||
<p style="color:#555;">The name is a command — not one person saving the world, but a community cooperating. Every project starts with the earth under our feet: the red laterite soil of Cameroon, the water beneath it, the fish that grow in it, the children who learn from it.</p>
|
||||
<p style="color:#555;">We don't parachute in solutions. We design systems that communities own, operate, and sustain — long after we've gone home.</p>
|
||||
</div>
|
||||
<div class="evidence-photo">
|
||||
<img src="/images/gallery/hands-soil-seedling.jpg" alt="Hands cupping red Cameroon earth with a tiny seedling — the core metaphor of everything Taawunu builds" loading="lazy">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -95,6 +109,17 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Photo Break -->
|
||||
<div class="photo-break fade-up">
|
||||
<img src="/images/gallery/fish-ponds-aerial.jpg" alt="The fish farm — 10 ponds carved into the earth, proof the model works" loading="lazy">
|
||||
<div class="photo-break-overlay">
|
||||
<div class="photo-break-text">
|
||||
<h3>Design systems, not dependency.</h3>
|
||||
<p>10 ponds. 35,000 fish capacity. Community owned and operated.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- How we're structured -->
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
@@ -170,7 +195,7 @@
|
||||
<div class="footer-grid">
|
||||
<div class="footer-brand"><div class="footer-arabic">تَعَاوُنُوا</div><div class="footer-wordmark">TAAWUNU</div><p>A social impact studio designing permanent self-sufficiency for marginalized communities.</p></div>
|
||||
<div><h4>Explore</h4><ul><li><a href="/approach/">Our Approach</a></li><li><a href="/projects/">Projects</a></li><li><a href="/gallery/">Gallery</a></li>
|
||||
<li><a href="/about/"><li><a href="/about/">About Us</a></li><li><a href="/support/">Support</a></li></ul></div>
|
||||
<li><a href="/about/">About Us</a></li><li><a href="/support/">Support</a></li></ul></div>
|
||||
<div><h4>Projects</h4><ul><li><a href="/projects/#aquaculture">Lolo Aquaculture</a></li><li><a href="/projects/#water">Solar Water Well</a></li></ul></div>
|
||||
<div><h4>Connect</h4><ul><li><a href="mailto:hello@taawunu.org">hello@taawunu.org</a></li><li><a href="https://linkedin.com/company/taawunu" target="_blank" rel="noopener">LinkedIn</a></li><li><a href="https://instagram.com/taawunu" target="_blank" rel="noopener">Instagram</a></li></ul></div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user