From 0dcb54f81f1ac46e975d3bb058dc8fe3266b4fe3 Mon Sep 17 00:00:00 2001 From: Alex Scott Date: Mon, 3 Jul 2017 18:15:44 +0000 Subject: [PATCH] Update menu docs to specify adding '.icons' class as well as layout-specific class. --- docs/pages/menu.md | 47 +++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 44 insertions(+), 3 deletions(-) diff --git a/docs/pages/menu.md b/docs/pages/menu.md index e73b36743..ef4778353 100644 --- a/docs/pages/menu.md +++ b/docs/pages/menu.md @@ -294,18 +294,59 @@ Menu items can have icons. Wrap the text of the item in a ``, and then add --- -Add the class `.icon-top` to the Menu to orient icons above the text. +Add the class `.icons` to the parent menu container to specify that the menu contains icons. Along with this, add your choice of layout class, such as `.icon-top`. + +When using any of the menu icon layout classes, ensure that the icon and the text are in the correct order. For `.icon-right` and `.icon-bottom`, the icon must come AFTER the text.

Watch this part in video

+### Icon Top +
+ edit on codepen button +
+ +```html_example + +``` +### Icon Right +
+ edit on codepen button +
+```html_example + +``` +### Icon Bottom +
+ edit on codepen button +
+ +```html_example + +``` +### Icon Left
- edit on codepen button + edit on codepen button
```html_example -