From b56b14d2f4a5c30c9a3d106377b40d3a7f595b8a Mon Sep 17 00:00:00 2001
From: Yan Zhu <picturepan2@hotmail.com>
Date: Wed, 16 Aug 2017 19:53:45 +0800
Subject: Move Panels and Empty states to Components from Layout

---
 docs/utilities.html | 48 ++++++++++++++++++++++++------------------------
 1 file changed, 24 insertions(+), 24 deletions(-)

(limited to 'docs/utilities.html')

diff --git a/docs/utilities.html b/docs/utilities.html
index 9b81d41..e161ffa 100644
--- a/docs/utilities.html
+++ b/docs/utilities.html
@@ -104,12 +104,6 @@
                   <li class="menu-item">
                     <a href="layout.html#navbar">Navbar</a>
                   </li>
-                  <li class="menu-item">
-                    <a href="layout.html#panels">Panels</a>
-                  </li>
-                  <li class="menu-item">
-                    <a href="layout.html#empty">Empty states</a>
-                  </li>
                 </ul>
               </div>
             </div>
@@ -144,6 +138,9 @@
                   <li class="menu-item">
                     <a href="components.html#chips">Chips</a>
                   </li>
+                  <li class="menu-item">
+                    <a href="components.html#empty">Empty states</a>
+                  </li>
                   <li class="menu-item">
                     <a href="components.html#menus">Menus</a>
                   </li>
@@ -156,6 +153,9 @@
                   <li class="menu-item">
                     <a href="components.html#pagination">Pagination</a>
                   </li>
+                  <li class="menu-item">
+                    <a href="components.html#panels">Panels</a>
+                  </li>
                   <li class="menu-item">
                     <a href="components.html#popovers">Popovers</a>
                   </li>
@@ -251,12 +251,12 @@
       <a href="#sidebar-close" id="sidebar-close" class="docs-nav-clear"></a>
 
       <div id="content" class="s-content">
-        <div id="colors" class="container">
-          <h3 class="s-title"><a href="#colors" class="anchor" aria-hidden="true">#</a>Color utilities</h3>
+        <div class="container">
+          <h3 id="colors" class="s-title"><a href="#colors" class="anchor" aria-hidden="true">#</a>Color utilities</h3>
           <div class="docs-note">
             <p>Color utilities are used for changing colors for text, link and background.</p>
           </div>
-          <h4 class="s-subtitle">Text colors</h4>
+          <h4 id="colors-text" class="s-subtitle">Text colors</h4>
           <div class="docs-note">
             <p><span class="text-primary">primary color</span></p>
             <p><span class="text-secondary">secondary color</span></p>
@@ -297,7 +297,7 @@
 &lt;<span class="tag">a</span> <span class="atn">class</span>=<span class="atv">&quot;text-error&quot;</span> <span class="atn">href</span>=<span class="atv">&quot;#&quot;</span>&gt;error color&lt;<span class="tag">/a</span>&gt;
 </code></pre>
 
-          <h4 class="s-subtitle">Background colors</h4>
+          <h4 id="colors-background" class="s-subtitle">Background colors</h4>
           <div class="docs-note">
             <p><span class="bg-primary text-light p-1 rounded">primary bg</span></p>
             <p><span class="bg-secondary text-primary p-1 rounded">secondary bg</span></p>
@@ -320,8 +320,8 @@
 
         </div>
 
-        <div id="display" class="container">
-          <h3 class="s-title"><a href="#display" class="anchor" aria-hidden="true">#</a>Display utilities</h3>
+        <div class="container">
+          <h3 id="display" class="s-title"><a href="#display" class="anchor" aria-hidden="true">#</a>Display utilities</h3>
           <div class="docs-note">
             <p>Display utilities are used for display and hidden things.</p>
           </div>
@@ -352,8 +352,8 @@
 
         </div>
 
-        <div id="divider" class="container">
-          <h3 class="s-title"><a href="#divider" class="anchor" aria-hidden="true">#</a>Divider</h3>
+        <div class="container">
+          <h3 id="divider" class="s-title"><a href="#divider" class="anchor" aria-hidden="true">#</a>Divider</h3>
           <div class="docs-note">
             <p>A Divider is used for separating elements.</p>
           </div>
@@ -426,8 +426,8 @@
 </code></pre>
         </div>
 
-        <div id="loading" class="container">
-          <h3 class="s-title"><a href="#loading" class="anchor" aria-hidden="true">#</a>Loading</h3>
+        <div class="container">
+          <h3 id="loading" class="s-title"><a href="#loading" class="anchor" aria-hidden="true">#</a>Loading</h3>
           <div class="docs-note">
             <p>Loading indicator is used for loading or updating. Also, you can add the <code>loading</code> class to buttons for loading status.</p>
           </div>
@@ -437,8 +437,8 @@
             </div>
           </div>
           <div class="docs-note">
-              <p>Add the <code>loading-lg</code> class for large size. </p>
-            </div>
+            <p>Add the <code>loading-lg</code> class for large size. </p>
+          </div>
           <div class="columns">
             <div class="column col-12 text-center">
               <div class="loading loading-lg"></div>
@@ -454,8 +454,8 @@
 
         </div>
 
-        <div id="position" class="container">
-          <h3 class="s-title"><a href="#position" class="anchor" aria-hidden="true">#</a>Position utilities</h3>
+        <div class="container">
+          <h3 id="position" class="s-title"><a href="#position" class="anchor" aria-hidden="true">#</a>Position utilities</h3>
           <div class="docs-note">
             <p>Position utilities are used for useful layout and position things, including clearfix, float, position and margin/padding utilities.</p>
           </div>
@@ -498,8 +498,8 @@
 
         </div>
 
-        <div id="shapes" class="container">
-          <h3 class="s-title"><a href="#shapes" class="anchor" aria-hidden="true">#</a>Shape utilities</h3>
+        <div class="container">
+          <h3 id="shapes" class="s-title"><a href="#shapes" class="anchor" aria-hidden="true">#</a>Shape utilities</h3>
           <div class="docs-note">
             <p>Shape utilities are used for change element shapes.</p>
           </div>
@@ -525,8 +525,8 @@
 
         </div>
 
-        <div id="text" class="container">
-          <h3 class="s-title"><a href="#text" class="anchor" aria-hidden="true">#</a>Text utilities</h3>
+        <div class="container">
+          <h3 id="text" class="s-title"><a href="#text" class="anchor" aria-hidden="true">#</a>Text utilities</h3>
           <div class="docs-note">
             <p>Text utilities are used for text alignment, styles and overflow things.</p>
           </div>
-- 
cgit v1.3.1-23-gd82d