Component Library
Internal reference page showing every converted Whites section in its major configurations. Each instance is numbered group.instance and labelled on the section itself; the same IDs name the sections in the theme editor. All content below is real, editable theme content.
1 — Heroes (Hero Pro #2)
- 1.1 Dark photo banner · white text · feature pills
- 1.2 Light banner · dark text overrides
- 1.3 Split layout · inline video · stat tiles
2 — Feature sections
- 2.1 Feature #1 · USP icon strip · card background + shadow
- 2.2 Feature #50 · interactive hotspot image · simple-list mobile
- 2.3 Feature #50 · interactive mobile layout · square image ratio
- 2.4 Feature #51 · feature card rows · centre heading
3 — Stats
- 3.1 Stats #4 · image right · animated counters
- 3.2 Stats #4 · image left · static numbers · mixed formats
- 3.3 Stats #4 · text-only (no image)
- 3.4 Stats #6 · video media · 4 stat tiles · badge
4 — Steps (Steps #9)
- 4.1 Image steps · autoplay carousel
- 4.2 Video steps with posters · forced mobile layout · no autoplay
5 — Video
- 5.1 Video with text · video right · autoplay muted loop
- 5.2 Video with text · video left · click-to-play
- 5.3 Video slider #5 · coverflow · portrait · arrows (3/5-up density configurable)
- 5.4 Video slider #6 · corner play/sound controls · liquid glass · verified badges
6 — Testimonials & social proof
- 6.1 Testimonial #12 · video cards · square media · arrows · no autoplay
- 6.2 Testimonial #12 · image cards · portrait media · autoplay · pagination dots
- 6.3 Testimonial #28 · media + review/button blocks
- 6.4 Glow testimonial · scrolling quote rows (reverse direction)
- 6.5 Social proof · coupon strip
7 — Comparison & conversion
- 7.1 Comparison table #22 · check/cross columns · stacked mobile layout
- 7.2 Featured product · live buy block (Coconut Pulling Oil)
Cosmetic options (colours, fonts, spacing, widths, radii, shadows, hover effects) exist on every section and are not duplicated as separate examples.