// v8 "Bloom Dream" โ sections part 1: floating glass nav, hero with the REAL
// app phone trio + stage pill, invisible-load.
function DmNav({ p }) {
const [scrolled, setScrolled] = React.useState(false);
React.useEffect(() => {
const on = () => setScrolled(window.scrollY > 24);window.addEventListener('scroll', on, { passive: true });on();
return () => window.removeEventListener('scroll', on);
}, []);
const links = [['how', 'How it Works'], ['partner', 'For Partners'], ['features', 'Features'], ['story', 'Our Story']];
return (
);
}
// Dream-styled stage pill โ switches which stage leads the phone trio.
function DmStagePill({ stage, setStage, p }) {
const items = [
{ id: 'ttc', label: 'Trying', dot: p.butter, fill: p.butter, fg: '#4A330B' },
{ id: 'pregnancy', label: 'Pregnancy', dot: p.accent, fill: p.accent, fg: '#FFFFFF' },
{ id: 'postpartum', label: 'Postpartum', dot: p.sage, fill: p.sage, fg: '#FFFFFF' }];
return (
{items.map((it) => {const act = stage === it.id;return (
setStage(it.id)} style={{ display: 'inline-flex', alignItems: 'center', gap: 8,
padding: '9px 17px', borderRadius: 999, border: 'none', cursor: 'pointer', background: act ? it.fill : 'transparent',
color: act ? it.fg : p.inkSoft, fontFamily: dreamFonts.display, fontSize: 14, fontWeight: 700,
transition: 'background 200ms ease, color 200ms ease' }}>
);
})}
);
}
function DmHero({ p }) {
const [stage, setStage] = React.useState('pregnancy');
return (
Meet
Della
A friend in your corner that helps bring your village closer. So, Mama, you're not doing this alone anymore.
Della remembers your whole story, carries the mental load with you, and helps your partner show up - so you navigate this like a team, and never feel alone.
Chat with Della โ
See How She Helps
๐ App + WhatsApp + Text ยท ๐ In your language
{/* Live app phone trio + stage pill, in a glass halo */}
the friend in your corner โก
);
}
// Invisible load.
function DmLoad({ p }) {
const [ref, inView] = useReveal({ amount: 0.35 });
const pp = dreamPhone(p);
return (
The part nobody talks about. The weight of parenthood often falls on one person. Della brings your village closer.
You're holding all of it - the appointments, symptoms, feelings, the literal weight. You don't have to. Della carries it with you.
Your partner is anxious too - they want to help but nobody handed them a map. Della gives them one, gently.
Most apps are built for women only. But isn't this journey about two people becoming parents?
Della understands you both, your journey, and guides you.
);}
Object.assign(window, { DmNav, DmStagePill, DmHero, DmLoad });