updated demo sidebar menu

- fixed timeline link in pages/calendar & pages/widgets
- added ribbons link after timeline link

index.html

@@ -345,6 +345,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="pages/UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

index2.html

@@ -332,6 +332,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="pages/UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

index3.html

@@ -342,6 +342,12 @@ to get the desired effect
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="pages/UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/UI/buttons.html

@@ -334,6 +334,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/UI/general.html

@@ -380,6 +380,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/UI/icons.html

@@ -334,6 +334,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/UI/modals.html

@@ -338,6 +338,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/UI/navbar.html

@@ -340,6 +340,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/UI/ribbons.html

@@ -329,6 +329,12 @@
                   <p>Navbar & Tabs</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/timeline.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Timeline</p>
+                </a>
+              </li>
               <li class="nav-item">
                 <a href="../UI/ribbons.html" class="nav-link active">
                   <i class="far fa-circle nav-icon"></i>

pages/UI/sliders.html

@@ -339,6 +339,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/UI/timeline.html

@@ -166,7 +166,7 @@
       <nav class="mt-2">
         <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
           <!-- Add icons to the links using the .nav-icon class
-               with font-awesome or any other icon font library -->
+               <br /> with font-awesome or any other icon font library -->
           <li class="nav-item has-treeview">
             <a href="#" class="nav-link">
               <i class="nav-icon fas fa-tachometer-alt"></i>
@@ -282,8 +282,8 @@
               </li>
             </ul>
           </li>
-          <li class="nav-item has-treeview">
-            <a href="#" class="nav-link">
+          <li class="nav-item has-treeview menu-open">
+            <a href="#" class="nav-link active">
               <i class="nav-icon fas fa-tree"></i>
               <p>
                 UI Elements
@@ -328,11 +328,17 @@
                 </a>
               </li>
               <li class="nav-item">
-                <a href="../UI/timeline.html" class="nav-link">
+                <a href="../UI/timeline.html" class="nav-link active">
                   <i class="far fa-circle nav-icon"></i>
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">
@@ -491,8 +497,8 @@
               </li>
             </ul>
           </li>
-          <li class="nav-item has-treeview menu-open">
-            <a href="#" class="nav-link active">
+          <li class="nav-item has-treeview">
+            <a href="#" class="nav-link">
               <i class="nav-icon far fa-plus-square"></i>
               <p>
                 Extras
@@ -543,7 +549,7 @@
                 </a>
               </li>
               <li class="nav-item">
-                <a href="../examples/blank.html" class="nav-link active">
+                <a href="../examples/blank.html" class="nav-link">
                   <i class="far fa-circle nav-icon"></i>
                   <p>Blank Page</p>
                 </a>

pages/calendar.html

@@ -335,11 +335,17 @@
                 </a>
               </li>
               <li class="nav-item">
-                <a href="../UI/timeline.html" class="nav-link">
+                <a href="UI/timeline.html" class="nav-link">
                   <i class="far fa-circle nav-icon"></i>
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/charts/chartjs.html

@@ -334,6 +334,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/charts/flot.html

@@ -335,6 +335,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/charts/inline.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/404.html

@@ -335,6 +335,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/500.html

@@ -335,6 +335,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/blank.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/contacts.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/e_commerce.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/invoice.html

@@ -334,6 +334,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/language-menu.html

@@ -348,6 +348,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/legacy-user-menu.html

@@ -363,6 +363,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/profile.html

@@ -335,6 +335,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/project_add.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/project_detail.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/project_edit.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/examples/projects.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/forms/advanced.html

@@ -348,6 +348,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview menu-open">

pages/forms/editors.html

@@ -337,6 +337,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview menu-open">

pages/forms/general.html

@@ -335,6 +335,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview menu-open">

pages/layout/boxed.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/layout/collapsed-sidebar.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/layout/fixed-footer.html

@@ -335,6 +335,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/layout/fixed-sidebar.html

@@ -337,6 +337,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/layout/fixed-topnav.html

@@ -335,6 +335,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/mailbox/compose.html

@@ -337,6 +337,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/mailbox/mailbox.html

@@ -336,6 +336,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/mailbox/read-mail.html

@@ -335,6 +335,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/tables/data.html

@@ -337,6 +337,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/tables/jsgrid.html

@@ -338,6 +338,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/tables/simple.html

@@ -334,6 +334,12 @@
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="../UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">

pages/widgets.html

@@ -329,11 +329,17 @@
                 </a>
               </li>
               <li class="nav-item">
-                <a href="../UI/timeline.html" class="nav-link">
+                <a href="UI/timeline.html" class="nav-link">
                   <i class="far fa-circle nav-icon"></i>
                   <p>Timeline</p>
                 </a>
               </li>
+              <li class="nav-item">
+                <a href="UI/ribbons.html" class="nav-link">
+                  <i class="far fa-circle nav-icon"></i>
+                  <p>Ribbons</p>
+                </a>
+              </li>
             </ul>
           </li>
           <li class="nav-item has-treeview">