Built because: “reusable email templates and content components”
01The ten components
Ten files from my component library. Each row is one file or one pair, with the data-slot names it exposes, exactly as they ship.
| Component file | What it does | Slots (data-slot) |
|---|---|---|
preheader.html | Hidden preview text with an MSO wrapper, then a “View in browser” link. | preheader_text view_online_url |
logo-header.html | Centred logo in a 600px MSO ghost table. Set in text for this concept. | logo_url |
hero-block.html | Headline, subtext and a button on a coloured block, VML rect behind it for Outlook. | headline subtext cta_text cta_url |
heading.html | One section heading in its own row. | heading_text |
text-block.html | Heading and body copy in one padded cell, MSO wrapper. | heading body |
cta-button.html | Bulletproof button: padded link, MSO fallback, one colour fill. | cta_text cta_url |
column-layout-2.html + image-block.html | Hybrid two-column row (MSO ghost table plus inline-block divs) that stacks on mobile. An image with a caption sits in each column. | col_1 col_2 image_url caption |
divider.html | A one-pixel rule in a 600px MSO wrapper. | divider_style |
list.html | Three bullet rows built from table cells, so bullets hold their position in Outlook. | item_1 item_2 item_3 |
footer-social.html + footer-unsub.html | A heading and a row of social links on a white 600px table, then the unsubscribe line. | social_heading social_links unsub_text |