From d30a0a0a00724444b443c6efdeb5594d1c5d499a Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Sat, 22 Dec 2018 21:11:14 +0800 Subject: Add more Menu badge support #545 --- docs/components/menu.html | 30 +++++++++++++++++++++++------- 1 file changed, 23 insertions(+), 7 deletions(-) (limited to 'docs/components/menu.html') diff --git a/docs/components/menu.html b/docs/components/menu.html index 08c1a62..9607923 100644 --- a/docs/components/menu.html +++ b/docs/components/menu.html @@ -222,12 +222,18 @@
  • -
  • +
  • My profile +
    + +
    +
    • +
  • Settings
    -
    My profile +
    • -
  • Settings
  • Logout
    • @@ -264,7 +270,7 @@ You can separate menu items with a divider. Spectre.css does not include JavaScript code, you will need to implement your JS to interact with the menus.

    -

    Menus also have Form controls (checkbox, radio and checkbox) support.

    +

    Menus also have Form controls (checkbox, radio and checkbox) support.

    <ul class="menu">
   <!-- menu header text -->
   <li class="divider" data-content="LINKS">
@@ -286,12 +292,22 @@
   <li class="divider"></li>
   <!-- menu item with badge -->
   <li class="menu-item">
-    <div class="menu-badge">
-      <label class="label label-primary">2</label>
-    </div>
     <a href="#">
       <i class="icon icon-link"></i> Settings
     </a>
+    <div class="menu-badge">
+      <label class="label label-primary">2</label>
+    </div>
+  </li>
+
+  <li class="menu-item">
+    <a href="#">My profile</a>
+    <div class="menu-badge">
+      <label class="form-checkbox">
+        <input type="checkbox">
+        <i class="form-icon"></i> Public
+      </label>
+    </div>
   </li>
 </ul>
    -- cgit v1.3.1-23-gd82d