adds warning to buttons and menu pages

diff --git a/docs/pages/button.md b/docs/pages/button.md
index 6b8361296a810e1b803d0fb71eb257ec91bc1252..424d1f02fcda6daf032c127f1be16dadf6069a58 100644 (file)
--- a/docs/pages/button.md
+++ b/docs/pages/button.md
@@ -75,3 +75,8 @@ Creating buttons with a radius or rounded edges (like a pill) can be achieved by
 <button href="#" class="rounded">Round</button>
 
 ```
+
+<div class="callout primary">
+- It's important to add an `href` attribute to your `<button>`'s to ensure that Outlook.com will not display `[undefined]` in your rendered email.<br> 
+- Office 365 and Outlook.com require a valid url in the href attribute or you can use the # placeholder.
+</div>

diff --git a/docs/pages/menu.md b/docs/pages/menu.md
index 868d446ce313870af671166559d6f1d5f4e1e412..5d55d6b59fb98660c2ce2d729e6e67bda2113d9c 100644 (file)
--- a/docs/pages/menu.md
+++ b/docs/pages/menu.md
@@ -18,6 +18,11 @@ In Inky HTML, use the tag `<menu>` to make a menu, and the tag `<item>` to make
 </menu>
 ```
 
+<div class="callout primary">
+- It's important to add an `href` attribute to your `<item>`'s to ensure that Outlook.com will not display `[undefined]` in your rendered email.<br> 
+- Office 365 and Outlook.com require a valid url in the href attribute or you can use the # placeholder.
+</div>
+
 ---
 
 ## Vertical Menu