compiled updates

README.md

@@ -80,9 +80,9 @@ reserves the right to change the license of future releases.
 
 Todo List
 ---------
-- Light sidebar colors
+- ~~Light sidebar colors~~ (Done)
-- Right sidebar
+- ~~Right sidebar~~ (Done)
-- Minified main-sidebar 
+- ~~Minified main-sidebar~~ (Done)
 - Right to left support
 - Custom pace style
 

changelog

@@ -6,6 +6,7 @@ v2.1.0:
 - Control sidebar converts to always slide over content on small screens
 - Added 6 new light sidebar skins
 - Updated demo menu
+- Fixed some minor bugs
 
 v2.0.5:
 - Fixed issue #288

dist/css/AdminLTE.css

@@ -1653,15 +1653,6 @@ a:focus {
 .box-body > .table {
   margin-bottom: 0;
 }
-.box-body > .chart {
-  position: relative;
-  overflow: hidden;
-  width: 100%;
-}
-.box-body > .chart svg,
-.box-body > .chart canvas {
-  width: 100%!important;
-}
 .box-body .fc {
   margin-top: 5px;
 }
@@ -3793,7 +3784,6 @@ fieldset[disabled] .btn-vk.active {
  * General: Miscellaneous
  * ----------------------
  */
-/* 10px padding and margins */
 .pad {
   padding: 10px;
 }
@@ -3803,12 +3793,10 @@ fieldset[disabled] .btn-vk.active {
 .margin-bottom {
   margin-bottom: 20px;
 }
-/* Display inline */
 .inline {
   display: inline;
   width: auto;
 }
-/* Description Blocks */
 .description-block {
   display: block;
   margin: 10px 0;
@@ -3826,7 +3814,6 @@ fieldset[disabled] .btn-vk.active {
 .description-block > .description-text {
   text-transform: uppercase;
 }
-/* Background colors */
 .bg-red,
 .bg-yellow,
 .bg-aqua,
@@ -4019,7 +4006,6 @@ fieldset[disabled] .btn-vk.active {
   opacity: 0.65;
   filter: alpha(opacity=65);
 }
-/* Text colors */
 .text-red {
   color: #dd4b39 !important;
 }
@@ -4068,27 +4054,21 @@ fieldset[disabled] .btn-vk.active {
 .text-maroon {
   color: #d81b60 !important;
 }
-/*Hide elements by display none only*/
 .hide {
   display: none !important;
 }
-/* Remove borders */
 .no-border {
   border: 0px !important;
 }
-/* Remove padding */
 .no-padding {
   padding: 0px !important;
 }
-/* Remove margins */
 .no-margin {
   margin: 0px !important;
 }
-/* Remove box shadow */
 .no-shadow {
   box-shadow: none!important;
 }
-/* Unstyled List */
 .list-unstyled,
 .chart-legend,
 .contacts-list,
@@ -4098,7 +4078,6 @@ fieldset[disabled] .btn-vk.active {
   margin: 0;
   padding: 0;
 }
-/* Remove border radius */
 .flat {
   border-radius: 0 !important;
 }
@@ -4107,15 +4086,11 @@ fieldset[disabled] .btn-vk.active {
 .text-bold.table th {
   font-weight: 700;
 }
-/* _fix for sparkline tooltip */
 .jqstooltip {
   padding: 5px!important;
   width: auto!important;
   height: auto!important;
 }
-/*
-Gradient Background colors
-*/
 .bg-teal-gradient {
   background: #39cccc !important;
   background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #39cccc), color-stop(1, #7adddd)) !important;
@@ -4232,6 +4207,15 @@ Gradient Background colors
   opacity: 1;
   filter: alpha(opacity=100);
 }
+.chart {
+  position: relative;
+  overflow: hidden;
+  width: 100%;
+}
+.chart svg,
+.chart canvas {
+  width: 100%!important;
+}
 /*
  * Misc: print
  * -----------

dist/js/app.js

@@ -73,12 +73,12 @@ $.AdminLTE.options = {
   //Box Widget plugin options
   boxWidgetOptions: {
     boxWidgetIcons: {
-      //The icon that triggers the collapse event
+      //Collapse icon
-      collapse: 'fa fa-minus',
+      collapse: 'fa-minus',
-      //The icon that trigger the opening event
+      //Open icon
-      open: 'fa fa-plus',
+      open: 'fa-plus',
-      //The icon that triggers the removing event
+      //Remove icon
-      remove: 'fa fa-times'
+      remove: 'fa-times'
     },
     boxWidgetSelectors: {
       //Remove button selector
@@ -420,36 +420,44 @@ function _init() {
    *        Set all of your option in the main $.AdminLTE.options object
    */
   $.AdminLTE.boxWidget = {
+    selectors: $.AdminLTE.options.boxWidgetOptions.boxWidgetSelectors,
+    icons: $.AdminLTE.options.boxWidgetOptions.boxWidgetIcons,
     activate: function () {
-      var o = $.AdminLTE.options;
       var _this = this;
       //Listen for collapse event triggers
-      $(o.boxWidgetOptions.boxWidgetSelectors.collapse).click(function (e) {
+      $(_this.selectors.collapse).on('click', function (e) {
         e.preventDefault();
         _this.collapse($(this));
       });
 
       //Listen for remove event triggers
-      $(o.boxWidgetOptions.boxWidgetSelectors.remove).click(function (e) {
+      $(_this.selectors.remove).on('click', function (e) {
         e.preventDefault();
         _this.remove($(this));
       });
     },
     collapse: function (element) {
+      var _this = this;
       //Find the box parent
       var box = element.parents(".box").first();
       //Find the body and the footer
-      var bf = box.find(".box-body, .box-footer");
+      var box_content = box.find("> .box-body, > .box-footer");
       if (!box.hasClass("collapsed-box")) {
-        //Convert minus into plus
+        //Convert minus into plus        
-        element.children(".fa-minus").removeClass("fa-minus").addClass("fa-plus");
+        element.children(":first")
-        bf.slideUp(300, function () {
+                .removeClass(_this.icons.collapse)
+                .addClass(_this.icons.open);
+        //Hide the content
+        box_content.slideUp(300, function () {
           box.addClass("collapsed-box");
         });
       } else {
         //Convert plus into minus
-        element.children(".fa-plus").removeClass("fa-plus").addClass("fa-minus");
+        element.children(":first")
-        bf.slideDown(300, function () {
+                .removeClass(_this.icons.open)
+                .addClass(_this.icons.collapse);
+        //Show the content
+        box_content.slideDown(300, function () {
           box.removeClass("collapsed-box");
         });
       }
@@ -458,8 +466,7 @@ function _init() {
       //Find the box parent
       var box = element.parents(".box").first();
       box.slideUp();
-    },
+    }
-    options: $.AdminLTE.options.boxWidgetOptions
   };
 }
 

dist/js/demo.js

@@ -111,10 +111,11 @@
           + "<input type='checkbox' data-controlsidebar='control-sidebar-open'/> "
           + "Toggle Control Sidebar Slide Effect"
           + "</label>"
+          + "<small>Toggles between slide over content and push content effects.</small>"
           + "</div>"
           + "</div>"
           );
-  var skins_list = $("<ul />", {"class": 'list-unstyled'});
+  var skins_list = $("<ul />", {"class": 'list-unstyled clearfix'});
 
   //Dark sidebar skins
   var skin_blue =
@@ -123,7 +124,7 @@
                   + "<div><span style='display:block; width: 20%; float: left; height: 7px; background: #367fa9;'></span><span class='bg-light-blue' style='display:block; width: 80%; float: left; height: 7px;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center'>Blue</p>");
+                  + "<p class='text-center no-margin'>Blue</p>");
   skins_list.append(skin_blue);
   var skin_black =
           $("<li />", {style: "float:left; width: 33.33333%; padding: 5px;"})
@@ -131,7 +132,7 @@
                   + "<div style='box-shadow: 0 0 2px rgba(0,0,0,0.1)' class='clearfix'><span style='display:block; width: 20%; float: left; height: 7px; background: #fefefe;'></span><span style='display:block; width: 80%; float: left; height: 7px; background: #fefefe;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #222;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center'>Black</p>");
+                  + "<p class='text-center no-margin'>Black</p>");
   skins_list.append(skin_black);
   var skin_purple =
           $("<li />", {style: "float:left; width: 33.33333%; padding: 5px;"})
@@ -139,7 +140,7 @@
                   + "<div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-purple-active'></span><span class='bg-purple' style='display:block; width: 80%; float: left; height: 7px;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center'>Purple</p>");
+                  + "<p class='text-center no-margin'>Purple</p>");
   skins_list.append(skin_purple);
   var skin_green =
           $("<li />", {style: "float:left; width: 33.33333%; padding: 5px;"})
@@ -147,7 +148,7 @@
                   + "<div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-green-active'></span><span class='bg-green' style='display:block; width: 80%; float: left; height: 7px;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center'>Green</p>");
+                  + "<p class='text-center no-margin'>Green</p>");
   skins_list.append(skin_green);
   var skin_red =
           $("<li />", {style: "float:left; width: 33.33333%; padding: 5px;"})
@@ -155,7 +156,7 @@
                   + "<div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-red-active'></span><span class='bg-red' style='display:block; width: 80%; float: left; height: 7px;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center'>Red</p>");
+                  + "<p class='text-center no-margin'>Red</p>");
   skins_list.append(skin_red);
   var skin_yellow =
           $("<li />", {style: "float:left; width: 33.33333%; padding: 5px;"})
@@ -163,7 +164,7 @@
                   + "<div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-yellow-active'></span><span class='bg-yellow' style='display:block; width: 80%; float: left; height: 7px;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center'>Yellow</p>");
+                  + "<p class='text-center no-margin'>Yellow</p>");
   skins_list.append(skin_yellow);
 
   //Light sidebar skins
@@ -173,7 +174,7 @@
                   + "<div><span style='display:block; width: 20%; float: left; height: 7px; background: #367fa9;'></span><span class='bg-light-blue' style='display:block; width: 80%; float: left; height: 7px;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center' style='font-size: 12px'>Blue Light</p>");
+                  + "<p class='text-center no-margin' style='font-size: 12px'>Blue Light</p>");
   skins_list.append(skin_blue_light);
   var skin_black_light =
           $("<li />", {style: "float:left; width: 33.33333%; padding: 5px;"})
@@ -181,7 +182,7 @@
                   + "<div style='box-shadow: 0 0 2px rgba(0,0,0,0.1)' class='clearfix'><span style='display:block; width: 20%; float: left; height: 7px; background: #fefefe;'></span><span style='display:block; width: 80%; float: left; height: 7px; background: #fefefe;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center' style='font-size: 12px'>Black Light</p>");
+                  + "<p class='text-center no-margin' style='font-size: 12px'>Black Light</p>");
   skins_list.append(skin_black_light);
   var skin_purple_light =
           $("<li />", {style: "float:left; width: 33.33333%; padding: 5px;"})
@@ -189,7 +190,7 @@
                   + "<div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-purple-active'></span><span class='bg-purple' style='display:block; width: 80%; float: left; height: 7px;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center' style='font-size: 12px'>Purple Light</p>");
+                  + "<p class='text-center no-margin' style='font-size: 12px'>Purple Light</p>");
   skins_list.append(skin_purple_light);
   var skin_green_light =
           $("<li />", {style: "float:left; width: 33.33333%; padding: 5px;"})
@@ -197,7 +198,7 @@
                   + "<div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-green-active'></span><span class='bg-green' style='display:block; width: 80%; float: left; height: 7px;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center' style='font-size: 12px'>Green Light</p>");
+                  + "<p class='text-center no-margin' style='font-size: 12px'>Green Light</p>");
   skins_list.append(skin_green_light);
   var skin_red_light =
           $("<li />", {style: "float:left; width: 33.33333%; padding: 5px;"})
@@ -205,7 +206,7 @@
                   + "<div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-red-active'></span><span class='bg-red' style='display:block; width: 80%; float: left; height: 7px;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center' style='font-size: 12px'>Red Light</p>");
+                  + "<p class='text-center no-margin' style='font-size: 12px'>Red Light</p>");
   skins_list.append(skin_red_light);
   var skin_yellow_light =
           $("<li />", {style: "float:left; width: 33.33333%; padding: 5px;"})
@@ -213,7 +214,7 @@
                   + "<div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-yellow-active'></span><span class='bg-yellow' style='display:block; width: 80%; float: left; height: 7px;'></span></div>"
                   + "<div><span style='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>"
                   + "</a>"
-                  + "<p class='text-center' style='font-size: 12px'>Yellow Light</p>");
+                  + "<p class='text-center no-margin' style='font-size: 12px;'>Yellow Light</p>");
   skins_list.append(skin_yellow_light);
 
   demo_settings.append("<h4 class='text-light-blue' style='margin: 0 0 5px 0; border-bottom: 1px solid #ddd; padding-bottom: 15px;'>Skins</h4>");

index2.html

@@ -29,7 +29,7 @@
         <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
     <![endif]-->
   </head>
-  <body class="skin-purple-light sidebar-mini sidebar-collapse">
+  <body class="skin-blue sidebar-mini sidebar-collapse">
     <div class="wrapper">
 
       <header class="main-header">
@@ -535,7 +535,7 @@
                       <p class="text-center">
                         <strong>Sales: 1 Jan, 2014 - 30 Jul, 2014</strong>
                       </p>
-                      <div class="chart-responsive">
+                      <div class="chart">
                         <!-- Sales Chart Canvas -->
                         <canvas id="salesChart" height="180"></canvas>
                       </div><!-- /.chart-responsive -->
@@ -1286,9 +1286,12 @@
     <!-- Bootstrap 3.3.2 JS -->
     <script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
     <!-- FastClick -->
-    <script src='plugins/fastclick/fastclick.min.js'></script>
+    <script src='plugins/fastclick/fastclick.min.js'></script>    
     <!-- AdminLTE App -->
     <script src="dist/js/app.min.js" type="text/javascript"></script>
+    <script>
+      $.AdminLTE.options.controlSidebarOptions.slide = false
+    </script>
     <!-- Sparkline -->
     <script src="plugins/sparkline/jquery.sparkline.min.js" type="text/javascript"></script>
     <!-- jvectormap -->
@@ -1308,7 +1311,7 @@
     <!-- AdminLTE dashboard demo (This is only for demo purposes) -->
     <script src="dist/js/pages/dashboard2.js" type="text/javascript"></script>
     
-    <!-- AdminLTE for demo purposes -->
+    <!-- AdminLTE for demo purposes --
-    <script src="dist/js/demo.js" type="text/javascript"></script>
+    <script src="dist/js/demo.js" type="text/javascript"></script-->
   </body>
 </html>