Skip to content

Commit 2c7a78f

Browse files
committed
chore: update skill
1 parent 4437560 commit 2c7a78f

1 file changed

Lines changed: 5 additions & 1 deletion

File tree

skills/maizzle/SKILL.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ All built-in components are auto-imported, no import statements needed. See `ref
130130
| `<Link>` | Anchor element with email-safe defaults |
131131
| `<Button>` | Call-to-action button with bulletproof rendering |
132132
| `<Img>` | Image with dark mode and reduced motion variants |
133-
| `<Divider>` | Horizontal rule / visual separator |
133+
| `<Hr>` | Horizontal rule / visual separator |
134134
| `<Spacer>` | Vertical or horizontal spacing |
135135
| `<Preheader>` | Hidden preview text shown in inbox list view |
136136

@@ -146,11 +146,14 @@ All built-in components are auto-imported, no import statements needed. See `ref
146146

147147
| Component | Description |
148148
|-----------|-------------|
149+
| `<Font>` | Adds a Google Font (or custom font) via `<link>` + `@font-face`, with email-safe fallbacks |
150+
| `<Tailwind>` | Scopes a Tailwind/CSS block to its slot — per-template styles or scoped overrides |
149151
| `<WithUrl>` | Rewrites URLs in children — prepend base URL or append query params (UTM tracking) |
150152
| `<NoWidows>` | Replaces last space with `&nbsp;` to prevent orphaned words |
151153
| `<Outlook>` | Wraps content in Outlook conditional comments (shows only in Outlook) |
152154
| `<NotOutlook>` | Hides content from Outlook |
153155
| `<Vml>` | VML markup for Outlook-specific rendering (background images) |
156+
| `<Raw>` | Emits slot content verbatim — bypasses Vue compilation so `{{ }}` and ESP syntax pass through |
154157

155158
## Behavioral guidelines
156159

@@ -180,6 +183,7 @@ If the user hasn't specified, ask about:
180183
### Common mistakes to avoid
181184

182185
- Do not use `<div>` directly for layout structure. Use the `<Container>`, `<Section>`, `<Row>` and `<Column>` components, which render email-safe markup.
186+
- Prefer `<Spacer>` over vertical margins for spacing between block elements — Outlook ignores margins on many elements. Margins are fine on text elements (`<p>`, `<Text>`, headings).
183187
- Do not use CSS `flexbox` or `grid` for layouts — poor email client support. `display:flex` can be used for simple horizontal alignment in some cases, but tables are always more reliable.
184188
- Do not use `position: absolute/relative` — not supported in most email clients.
185189
- Do not use custom fonts without a web-safe fallback. Most email clients ignore `@font-face`.

0 commit comments

Comments
 (0)