updated

build/less/variables.less

@@ -57,7 +57,7 @@
 
 //Light sidebar
 @sidebar-light-bg:                  #f9fafc;
-@sidebar-light-hover-bg:            lighten(#f0f0f1, 1.5%);//#f7f7f7;
+@sidebar-light-hover-bg:            lighten(#f0f0f1, 1.5%);
 @sidebar-light-color:               #444;
 @sidebar-light-hover-color:         #000;
 @sidebar-light-submenu-bg:          @sidebar-light-hover-bg;

dist/css/AdminLTE.css

@@ -2807,11 +2807,15 @@ table.text-center th {
   padding: 10px;
   text-align: center;
 }
-.users-list > li > img {
+.users-list > li img {
   border-radius: 50%;
   max-width: 100%;
   height: auto;
 }
+.users-list > li > a:hover,
+.users-list > li > a:hover .users-list-name {
+  color: #999;
+}
 .users-list-name,
 .users-list-date {
   display: block;
@@ -2823,9 +2827,6 @@ table.text-center th {
   white-space: nowrap;
   text-overflow: ellipsis;
 }
-.users-list-name:hover {
-  color: #999;
-}
 .users-list-date {
   color: #999;
   font-size: 12px;

dist/js/demo.js

@@ -29,11 +29,11 @@
   //Create the new tab
   var tab_pane = $("<div />", {
     "id": "control-sidebar-theme-demo-options-tab",
-    "class": "tab-pane"
+    "class": "tab-pane active"
   });
 
   //Create the tab button
-  var tab_button = $("<li />")
+  var tab_button = $("<li />", {"class": "active"})
           .html("<a href='#control-sidebar-theme-demo-options-tab' data-toggle='tab'>"
                   + "<i class='fa fa-wrench'></i>"
                   + "</a>");
@@ -81,7 +81,15 @@
           + "<input type='checkbox' data-controlsidebar='control-sidebar-open' class='pull-right'/> "
           + "Toggle Right Sidebar Slide"
           + "</label>"
-          + "<p>Toggles between slide over content and push content effects.</p>"
+          + "<p>Toggle between slide over content and push content effects</p>"
+          + "</div>"
+          //Control Sidebar Skin Toggle
+          + "<div class='form-group'>"
+          + "<label class='control-sidebar-subheading'>"
+          + "<input type='checkbox' data-sidebarskin='toggle' class='pull-right'/> "
+          + "Toggle Right Sidebar Skin"
+          + "</label>"
+          + "<p>Toggle between dark and light skins for the right sidebar</p>"
           + "</div>"
           );
   var skins_list = $("<ul />", {"class": 'list-unstyled clearfix'});
@@ -204,7 +212,7 @@
     $("body").toggleClass(cls);
     AdminLTE.layout.fixSidebar();
     //Fix the problem with right sidebar and layout boxed
-    if(cls == "layout-boxed")
+    if (cls == "layout-boxed")
       AdminLTE.controlSidebar._fix($(".control-sidebar-bg"));
   }
 
@@ -280,5 +288,16 @@
       if (!slide)
         $('.control-sidebar').removeClass('control-sidebar-open');
     });
+
+    $("[data-sidebarskin='toggle']").on('click', function () {
+      var sidebar = $(".control-sidebar");
+      if (sidebar.hasClass("control-sidebar-dark")) {
+        sidebar.removeClass("control-sidebar-dark")
+        sidebar.addClass("control-sidebar-light")
+      } else {
+        sidebar.removeClass("control-sidebar-light")
+        sidebar.addClass("control-sidebar-dark")
+      }
+    });
   }
 })(jQuery, $.AdminLTE);