Table of contents

fold is, on phones, a collapsed outlined row reading “Contents, 13 sections” that opens with a chevron. chips shows section names as a row of outlined chips at every width, with no side table of contents. open shows a numbered list 1 to 13 already expanded inside a light gray panel. On wide screens fold and open also show a separate “On this page” list on the right.

Use fold on long posts to save space, chips to let readers scan section names, and open to show the contents straight away. On phones open takes a lot of vertical space.

It follows a documentation site’s “On This Page” style, and the current-section marker uses no bar or line.

Use it when — Variants 3

1. foldFold Long posts where the first phone screen is precious — folded on phones, a side list on wide screens.Used by 3: babyplay, babysick, babysleep
2. chipsChips When there are few short sections and a side column would be wasted — one row of chips at every width.Used by 5: babyfood, milestone, newborn, toddlerfood, 허브
3. openOpen When the headings alone should tell the story — an open numbered list even on phones.Used by 3: birthprep, feeding, vaccination