updated plugins part 1

- updated package.json plugins (fontawesome)
- updated npm/Plugins
- removed bootstrap css files
- replaced bootstrap-wysihtml5 (it's not support BS4) with summernote
- updated bootstrap-slider to latest version & updated demo
- replaced old chartjs demos with new chartjs
- updated bootstrap-colorpicker & updated forms/advanced demo file
- removed ckeditor in order to respect licenses
- replaced bootstrap-datepicker & bootstrap-timepicker with tempusdominus-bootstrap-4

build/npm/Plugins.js

@@ -11,8 +11,8 @@ const Plugins = [
   },
   // Bootstrap
   {
-    from: 'node_modules/bootstrap/dist',
-    to  : 'plugins/bootstrap'
+    from: 'node_modules/bootstrap/dist/js',
+    to  : 'plugins/bootstrap/js'
   },
   // Font Awesome
   {
@@ -23,16 +23,67 @@ const Plugins = [
     from: 'node_modules/@fortawesome/fontawesome-free/webfonts',
     to  : 'plugins/fontawesome-free/webfonts'
   },
-  // Chart.js 2
+  // overlayScrollbars
+  {
+    from: 'node_modules/overlayscrollbars/js',
+    to  : 'plugins/overlayScrollbars/js'
+  },
+  {
+    from: 'node_modules/overlayscrollbars/css',
+    to  : 'plugins/overlayScrollbars/css'
+  },
+  // Chart.js
   {
     from: 'node_modules/chart.js/dist/',
     to  : 'plugins/chart.js'
   },
-  // CKEditor
+  // Summernote
+  {
+    from: 'node_modules/summernote/dist/',
+    to  : 'plugins/summernote'
+  },
+  // Bootstrap Slider
+  {
+    from: 'node_modules/bootstrap-slider/dist/',
+    to  : 'plugins/bootstrap-slider'
+  },
+  {
+    from: 'node_modules/bootstrap-slider/dist/css',
+    to  : 'plugins/bootstrap-slider/css'
+  },
+  // Bootstrap Colorpicker
+  {
+    from: 'node_modules/bootstrap-colorpicker/dist/js',
+    to  : 'plugins/bootstrap-colorpicker/js'
+  },
+  {
+    from: 'node_modules/bootstrap-colorpicker/dist/css',
+    to  : 'plugins/bootstrap-colorpicker/css'
+  },
+  // Tempusdominus Bootstrap 4
   {
-    from: 'node_modules/@ckeditor/ckeditor5-build-classic/build/',
-    to  : 'plugins/ckeditor'
+    from: 'node_modules/tempusdominus-bootstrap-4/build/js',
+    to  : 'plugins/tempusdominus-bootstrap-4/js'
   },
+  {
+    from: 'node_modules/tempusdominus-bootstrap-4/build/css',
+    to  : 'plugins/tempusdominus-bootstrap-4/css'
+  },
+  // Moment
+  {
+    from: 'node_modules/moment/min',
+    to  : 'plugins/moment'
+  },
+  {
+    from: 'node_modules/moment/locale',
+    to  : 'plugins/moment/locale'
+  },
+  // FastClick
+  {
+    from: 'node_modules/fastclick/lib',
+    to  : 'plugins/fastclick'
+  },
+
   // DataTables
   {
     from: 'node_modules/datatables.net/js',
@@ -46,15 +97,6 @@ const Plugins = [
     from: 'node_modules/datatables.net-bs4/css',
     to: 'plugins/datatables'
   },
-  // overlayScrollbars
-  {
-    from: 'node_modules/overlayscrollbars/js',
-    to  : 'plugins/overlayScrollbars/js'
-  },
-  {
-    from: 'node_modules/overlayscrollbars/css',
-    to  : 'plugins/overlayScrollbars/css'
-  },
 
   // // Doc Assets
   // // AdminLTE Dist

build/scss/_cards.scss

@@ -343,4 +343,30 @@
       }
     }
   }
+
+  .card.bg-#{$name},
+  .card.bg-#{$name}-gradient {
+    .bootstrap-datetimepicker-widget {
+      .table td,
+      .table th {
+        border: none;
+      }
+      
+      table thead tr:first-child th:hover,
+      table td.day:hover,
+      table td.hour:hover,
+      table td.minute:hover,
+      table td.second:hover {
+        background: darken($color, 8%);
+        color: color-yiq($color);
+      }
+
+
+      table td.active,
+      table td.active:hover {
+        background: lighten($color, 10%);
+        color: color-yiq($color);
+      }
+    }
+  }
 }

build/scss/_miscellaneous.scss

@@ -70,6 +70,14 @@ a.text-muted:hover {
   color: color-yiq($white) !important;
 }
 
+// Gradient Background colors
+@each $name, $color in $theme-colors {
+  .bg-#{$name}-gradient {
+    @include gradient($color, $color, lighten($color, 10%));
+    color: color-yiq($color);
+  }
+}
+
 // Disabled!
 [class^="bg-"].disabled {
   opacity: .65;
@@ -135,14 +143,6 @@ a.text-muted:hover {
   height: auto !important;
 }
 
-// Gradient Background colors
-@each $name, $color in $theme-colors {
-  .bg-#{$name}-gradient {
-    @include gradient($color, $color, lighten($color, 10%));
-    color: color-yiq($color);
-  }
-}
-
 // Description Block Extension
 .description-block {
   .description-icon {
@@ -394,4 +394,13 @@ a.text-muted:hover {
       color: $white;
     }
   }
-}
+}
+
+// Background colors (colors)
+@each $name, $color in $colors {
+  ##{$name}.slider {
+    .slider-selection {
+      background: $color;
+    }
+  }
+}

dist/css/adminlte.css

@@ -12876,6 +12876,41 @@ textarea.form-control.is-warning {
   color: #ffffff;
 }
 
+.card.bg-primary .bootstrap-datetimepicker-widget .table td, .card.label-primary .bootstrap-datetimepicker-widget .table td,
+.card.bg-primary .bootstrap-datetimepicker-widget .table th,
+.card.label-primary .bootstrap-datetimepicker-widget .table th,
+.card.bg-primary-gradient .bootstrap-datetimepicker-widget .table td,
+.card.bg-primary-gradient .bootstrap-datetimepicker-widget .table th {
+  border: none;
+}
+
+.card.bg-primary .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .card.label-primary .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-primary .bootstrap-datetimepicker-widget table td.day:hover,
+.card.label-primary .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-primary .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.label-primary .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-primary .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.label-primary .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-primary .bootstrap-datetimepicker-widget table td.second:hover,
+.card.label-primary .bootstrap-datetimepicker-widget table td.second:hover,
+.card.bg-primary-gradient .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-primary-gradient .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-primary-gradient .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-primary-gradient .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-primary-gradient .bootstrap-datetimepicker-widget table td.second:hover {
+  background: #0067d6;
+  color: #ffffff;
+}
+
+.card.bg-primary .bootstrap-datetimepicker-widget table td.active, .card.label-primary .bootstrap-datetimepicker-widget table td.active,
+.card.bg-primary .bootstrap-datetimepicker-widget table td.active:hover,
+.card.label-primary .bootstrap-datetimepicker-widget table td.active:hover,
+.card.bg-primary-gradient .bootstrap-datetimepicker-widget table td.active,
+.card.bg-primary-gradient .bootstrap-datetimepicker-widget table td.active:hover {
+  background: #3395ff;
+  color: #ffffff;
+}
+
 .card-secondary:not(.card-outline) .card-header {
   background-color: #6c757d;
   border-bottom: 0;
@@ -12902,6 +12937,35 @@ textarea.form-control.is-warning {
   color: #ffffff;
 }
 
+.card.bg-secondary .bootstrap-datetimepicker-widget .table td,
+.card.bg-secondary .bootstrap-datetimepicker-widget .table th,
+.card.bg-secondary-gradient .bootstrap-datetimepicker-widget .table td,
+.card.bg-secondary-gradient .bootstrap-datetimepicker-widget .table th {
+  border: none;
+}
+
+.card.bg-secondary .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-secondary .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-secondary .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-secondary .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-secondary .bootstrap-datetimepicker-widget table td.second:hover,
+.card.bg-secondary-gradient .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-secondary-gradient .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-secondary-gradient .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-secondary-gradient .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-secondary-gradient .bootstrap-datetimepicker-widget table td.second:hover {
+  background: #596167;
+  color: #ffffff;
+}
+
+.card.bg-secondary .bootstrap-datetimepicker-widget table td.active,
+.card.bg-secondary .bootstrap-datetimepicker-widget table td.active:hover,
+.card.bg-secondary-gradient .bootstrap-datetimepicker-widget table td.active,
+.card.bg-secondary-gradient .bootstrap-datetimepicker-widget table td.active:hover {
+  background: #868e96;
+  color: #ffffff;
+}
+
 .card-success:not(.card-outline) .card-header {
   background-color: #28a745;
   border-bottom: 0;
@@ -12928,6 +12992,47 @@ textarea.form-control.is-warning {
   color: #ffffff;
 }
 
+.card.bg-success .bootstrap-datetimepicker-widget .table td, .card.alert-success .bootstrap-datetimepicker-widget .table td, .card.label-success .bootstrap-datetimepicker-widget .table td,
+.card.bg-success .bootstrap-datetimepicker-widget .table th,
+.card.alert-success .bootstrap-datetimepicker-widget .table th,
+.card.label-success .bootstrap-datetimepicker-widget .table th,
+.card.bg-success-gradient .bootstrap-datetimepicker-widget .table td,
+.card.bg-success-gradient .bootstrap-datetimepicker-widget .table th {
+  border: none;
+}
+
+.card.bg-success .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .card.alert-success .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .card.label-success .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-success .bootstrap-datetimepicker-widget table td.day:hover,
+.card.alert-success .bootstrap-datetimepicker-widget table td.day:hover,
+.card.label-success .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-success .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.alert-success .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.label-success .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-success .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.alert-success .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.label-success .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-success .bootstrap-datetimepicker-widget table td.second:hover,
+.card.alert-success .bootstrap-datetimepicker-widget table td.second:hover,
+.card.label-success .bootstrap-datetimepicker-widget table td.second:hover,
+.card.bg-success-gradient .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-success-gradient .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-success-gradient .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-success-gradient .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-success-gradient .bootstrap-datetimepicker-widget table td.second:hover {
+  background: #208637;
+  color: #ffffff;
+}
+
+.card.bg-success .bootstrap-datetimepicker-widget table td.active, .card.alert-success .bootstrap-datetimepicker-widget table td.active, .card.label-success .bootstrap-datetimepicker-widget table td.active,
+.card.bg-success .bootstrap-datetimepicker-widget table td.active:hover,
+.card.alert-success .bootstrap-datetimepicker-widget table td.active:hover,
+.card.label-success .bootstrap-datetimepicker-widget table td.active:hover,
+.card.bg-success-gradient .bootstrap-datetimepicker-widget table td.active,
+.card.bg-success-gradient .bootstrap-datetimepicker-widget table td.active:hover {
+  background: #34ce57;
+  color: #ffffff;
+}
+
 .card-info:not(.card-outline) .card-header {
   background-color: #17a2b8;
   border-bottom: 0;
@@ -12954,6 +13059,47 @@ textarea.form-control.is-warning {
   color: #ffffff;
 }
 
+.card.bg-info .bootstrap-datetimepicker-widget .table td, .card.alert-info .bootstrap-datetimepicker-widget .table td, .card.label-info .bootstrap-datetimepicker-widget .table td,
+.card.bg-info .bootstrap-datetimepicker-widget .table th,
+.card.alert-info .bootstrap-datetimepicker-widget .table th,
+.card.label-info .bootstrap-datetimepicker-widget .table th,
+.card.bg-info-gradient .bootstrap-datetimepicker-widget .table td,
+.card.bg-info-gradient .bootstrap-datetimepicker-widget .table th {
+  border: none;
+}
+
+.card.bg-info .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .card.alert-info .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .card.label-info .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-info .bootstrap-datetimepicker-widget table td.day:hover,
+.card.alert-info .bootstrap-datetimepicker-widget table td.day:hover,
+.card.label-info .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-info .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.alert-info .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.label-info .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-info .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.alert-info .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.label-info .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-info .bootstrap-datetimepicker-widget table td.second:hover,
+.card.alert-info .bootstrap-datetimepicker-widget table td.second:hover,
+.card.label-info .bootstrap-datetimepicker-widget table td.second:hover,
+.card.bg-info-gradient .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-info-gradient .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-info-gradient .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-info-gradient .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-info-gradient .bootstrap-datetimepicker-widget table td.second:hover {
+  background: #128294;
+  color: #ffffff;
+}
+
+.card.bg-info .bootstrap-datetimepicker-widget table td.active, .card.alert-info .bootstrap-datetimepicker-widget table td.active, .card.label-info .bootstrap-datetimepicker-widget table td.active,
+.card.bg-info .bootstrap-datetimepicker-widget table td.active:hover,
+.card.alert-info .bootstrap-datetimepicker-widget table td.active:hover,
+.card.label-info .bootstrap-datetimepicker-widget table td.active:hover,
+.card.bg-info-gradient .bootstrap-datetimepicker-widget table td.active,
+.card.bg-info-gradient .bootstrap-datetimepicker-widget table td.active:hover {
+  background: #1fc8e3;
+  color: #ffffff;
+}
+
 .card-warning:not(.card-outline) .card-header {
   background-color: #ffc107;
   border-bottom: 0;
@@ -12980,6 +13126,47 @@ textarea.form-control.is-warning {
   color: #1F2D3D;
 }
 
+.card.bg-warning .bootstrap-datetimepicker-widget .table td, .card.alert-warning .bootstrap-datetimepicker-widget .table td, .card.label-warning .bootstrap-datetimepicker-widget .table td,
+.card.bg-warning .bootstrap-datetimepicker-widget .table th,
+.card.alert-warning .bootstrap-datetimepicker-widget .table th,
+.card.label-warning .bootstrap-datetimepicker-widget .table th,
+.card.bg-warning-gradient .bootstrap-datetimepicker-widget .table td,
+.card.bg-warning-gradient .bootstrap-datetimepicker-widget .table th {
+  border: none;
+}
+
+.card.bg-warning .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .card.alert-warning .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .card.label-warning .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-warning .bootstrap-datetimepicker-widget table td.day:hover,
+.card.alert-warning .bootstrap-datetimepicker-widget table td.day:hover,
+.card.label-warning .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-warning .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.alert-warning .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.label-warning .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-warning .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.alert-warning .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.label-warning .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-warning .bootstrap-datetimepicker-widget table td.second:hover,
+.card.alert-warning .bootstrap-datetimepicker-widget table td.second:hover,
+.card.label-warning .bootstrap-datetimepicker-widget table td.second:hover,
+.card.bg-warning-gradient .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-warning-gradient .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-warning-gradient .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-warning-gradient .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-warning-gradient .bootstrap-datetimepicker-widget table td.second:hover {
+  background: #dda600;
+  color: #1F2D3D;
+}
+
+.card.bg-warning .bootstrap-datetimepicker-widget table td.active, .card.alert-warning .bootstrap-datetimepicker-widget table td.active, .card.label-warning .bootstrap-datetimepicker-widget table td.active,
+.card.bg-warning .bootstrap-datetimepicker-widget table td.active:hover,
+.card.alert-warning .bootstrap-datetimepicker-widget table td.active:hover,
+.card.label-warning .bootstrap-datetimepicker-widget table td.active:hover,
+.card.bg-warning-gradient .bootstrap-datetimepicker-widget table td.active,
+.card.bg-warning-gradient .bootstrap-datetimepicker-widget table td.active:hover {
+  background: #ffce3a;
+  color: #1F2D3D;
+}
+
 .card-danger:not(.card-outline) .card-header {
   background-color: #dc3545;
   border-bottom: 0;
@@ -13006,6 +13193,53 @@ textarea.form-control.is-warning {
   color: #ffffff;
 }
 
+.card.bg-danger .bootstrap-datetimepicker-widget .table td, .card.alert-danger .bootstrap-datetimepicker-widget .table td, .card.alert-error .bootstrap-datetimepicker-widget .table td, .card.label-danger .bootstrap-datetimepicker-widget .table td,
+.card.bg-danger .bootstrap-datetimepicker-widget .table th,
+.card.alert-danger .bootstrap-datetimepicker-widget .table th,
+.card.alert-error .bootstrap-datetimepicker-widget .table th,
+.card.label-danger .bootstrap-datetimepicker-widget .table th,
+.card.bg-danger-gradient .bootstrap-datetimepicker-widget .table td,
+.card.bg-danger-gradient .bootstrap-datetimepicker-widget .table th {
+  border: none;
+}
+
+.card.bg-danger .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .card.alert-danger .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .card.alert-error .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .card.label-danger .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-danger .bootstrap-datetimepicker-widget table td.day:hover,
+.card.alert-danger .bootstrap-datetimepicker-widget table td.day:hover,
+.card.alert-error .bootstrap-datetimepicker-widget table td.day:hover,
+.card.label-danger .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-danger .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.alert-danger .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.alert-error .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.label-danger .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-danger .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.alert-danger .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.alert-error .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.label-danger .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-danger .bootstrap-datetimepicker-widget table td.second:hover,
+.card.alert-danger .bootstrap-datetimepicker-widget table td.second:hover,
+.card.alert-error .bootstrap-datetimepicker-widget table td.second:hover,
+.card.label-danger .bootstrap-datetimepicker-widget table td.second:hover,
+.card.bg-danger-gradient .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-danger-gradient .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-danger-gradient .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-danger-gradient .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-danger-gradient .bootstrap-datetimepicker-widget table td.second:hover {
+  background: #c62232;
+  color: #ffffff;
+}
+
+.card.bg-danger .bootstrap-datetimepicker-widget table td.active, .card.alert-danger .bootstrap-datetimepicker-widget table td.active, .card.alert-error .bootstrap-datetimepicker-widget table td.active, .card.label-danger .bootstrap-datetimepicker-widget table td.active,
+.card.bg-danger .bootstrap-datetimepicker-widget table td.active:hover,
+.card.alert-danger .bootstrap-datetimepicker-widget table td.active:hover,
+.card.alert-error .bootstrap-datetimepicker-widget table td.active:hover,
+.card.label-danger .bootstrap-datetimepicker-widget table td.active:hover,
+.card.bg-danger-gradient .bootstrap-datetimepicker-widget table td.active,
+.card.bg-danger-gradient .bootstrap-datetimepicker-widget table td.active:hover {
+  background: #e4606d;
+  color: #ffffff;
+}
+
 .card-light:not(.card-outline) .card-header {
   background-color: #f8f9fa;
   border-bottom: 0;
@@ -13032,6 +13266,35 @@ textarea.form-control.is-warning {
   color: #1F2D3D;
 }
 
+.card.bg-light .bootstrap-datetimepicker-widget .table td,
+.card.bg-light .bootstrap-datetimepicker-widget .table th,
+.card.bg-light-gradient .bootstrap-datetimepicker-widget .table td,
+.card.bg-light-gradient .bootstrap-datetimepicker-widget .table th {
+  border: none;
+}
+
+.card.bg-light .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-light .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-light .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-light .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-light .bootstrap-datetimepicker-widget table td.second:hover,
+.card.bg-light-gradient .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-light-gradient .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-light-gradient .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-light-gradient .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-light-gradient .bootstrap-datetimepicker-widget table td.second:hover {
+  background: #e0e5e9;
+  color: #1F2D3D;
+}
+
+.card.bg-light .bootstrap-datetimepicker-widget table td.active,
+.card.bg-light .bootstrap-datetimepicker-widget table td.active:hover,
+.card.bg-light-gradient .bootstrap-datetimepicker-widget table td.active,
+.card.bg-light-gradient .bootstrap-datetimepicker-widget table td.active:hover {
+  background: white;
+  color: #1F2D3D;
+}
+
 .card-dark:not(.card-outline) .card-header {
   background-color: #343a40;
   border-bottom: 0;
@@ -13058,6 +13321,35 @@ textarea.form-control.is-warning {
   color: #ffffff;
 }
 
+.card.bg-dark .bootstrap-datetimepicker-widget .table td,
+.card.bg-dark .bootstrap-datetimepicker-widget .table th,
+.card.bg-dark-gradient .bootstrap-datetimepicker-widget .table td,
+.card.bg-dark-gradient .bootstrap-datetimepicker-widget .table th {
+  border: none;
+}
+
+.card.bg-dark .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-dark .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-dark .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-dark .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-dark .bootstrap-datetimepicker-widget table td.second:hover,
+.card.bg-dark-gradient .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,
+.card.bg-dark-gradient .bootstrap-datetimepicker-widget table td.day:hover,
+.card.bg-dark-gradient .bootstrap-datetimepicker-widget table td.hour:hover,
+.card.bg-dark-gradient .bootstrap-datetimepicker-widget table td.minute:hover,
+.card.bg-dark-gradient .bootstrap-datetimepicker-widget table td.second:hover {
+  background: #222629;
+  color: #ffffff;
+}
+
+.card.bg-dark .bootstrap-datetimepicker-widget table td.active,
+.card.bg-dark .bootstrap-datetimepicker-widget table td.active:hover,
+.card.bg-dark-gradient .bootstrap-datetimepicker-widget table td.active,
+.card.bg-dark-gradient .bootstrap-datetimepicker-widget table td.active:hover {
+  background: #4b545c;
+  color: #ffffff;
+}
+
 /*
  * Component: Info Box
  * -------------------
@@ -14821,6 +15113,54 @@ a.text-muted:hover {
   color: #1F2D3D !important;
 }
 
+.bg-primary-gradient {
+  background: #007bff;
+  background: -o-linear-gradient(#3395ff, #007bff);
+  color: #ffffff;
+}
+
+.bg-secondary-gradient {
+  background: #6c757d;
+  background: -o-linear-gradient(#868e96, #6c757d);
+  color: #ffffff;
+}
+
+.bg-success-gradient {
+  background: #28a745;
+  background: -o-linear-gradient(#34ce57, #28a745);
+  color: #ffffff;
+}
+
+.bg-info-gradient {
+  background: #17a2b8;
+  background: -o-linear-gradient(#1fc8e3, #17a2b8);
+  color: #ffffff;
+}
+
+.bg-warning-gradient {
+  background: #ffc107;
+  background: -o-linear-gradient(#ffce3a, #ffc107);
+  color: #1F2D3D;
+}
+
+.bg-danger-gradient {
+  background: #dc3545;
+  background: -o-linear-gradient(#e4606d, #dc3545);
+  color: #ffffff;
+}
+
+.bg-light-gradient {
+  background: #f8f9fa;
+  background: -o-linear-gradient(white, #f8f9fa);
+  color: #1F2D3D;
+}
+
+.bg-dark-gradient {
+  background: #343a40;
+  background: -o-linear-gradient(#4b545c, #343a40);
+  color: #ffffff;
+}
+
 [class^="bg-"].disabled {
   opacity: .65;
 }
@@ -14877,54 +15217,6 @@ a.text-muted:hover {
   height: auto !important;
 }
 
-.bg-primary-gradient {
-  background: #007bff;
-  background: -o-linear-gradient(#3395ff, #007bff);
-  color: #ffffff;
-}
-
-.bg-secondary-gradient {
-  background: #6c757d;
-  background: -o-linear-gradient(#868e96, #6c757d);
-  color: #ffffff;
-}
-
-.bg-success-gradient {
-  background: #28a745;
-  background: -o-linear-gradient(#34ce57, #28a745);
-  color: #ffffff;
-}
-
-.bg-info-gradient {
-  background: #17a2b8;
-  background: -o-linear-gradient(#1fc8e3, #17a2b8);
-  color: #ffffff;
-}
-
-.bg-warning-gradient {
-  background: #ffc107;
-  background: -o-linear-gradient(#ffce3a, #ffc107);
-  color: #1F2D3D;
-}
-
-.bg-danger-gradient {
-  background: #dc3545;
-  background: -o-linear-gradient(#e4606d, #dc3545);
-  color: #ffffff;
-}
-
-.bg-light-gradient {
-  background: #f8f9fa;
-  background: -o-linear-gradient(white, #f8f9fa);
-  color: #1F2D3D;
-}
-
-.bg-dark-gradient {
-  background: #343a40;
-  background: -o-linear-gradient(#4b545c, #343a40);
-  color: #ffffff;
-}
-
 .description-block .description-icon {
   font-size: 16px;
 }
@@ -15162,6 +15454,58 @@ a.text-muted:hover {
   color: #ffffff;
 }
 
+#blue.slider .slider-selection {
+  background: #007bff;
+}
+
+#indigo.slider .slider-selection {
+  background: #6610f2;
+}
+
+#purple.slider .slider-selection {
+  background: #6f42c1;
+}
+
+#pink.slider .slider-selection {
+  background: #e83e8c;
+}
+
+#red.slider .slider-selection {
+  background: #dc3545;
+}
+
+#orange.slider .slider-selection {
+  background: #fd7e14;
+}
+
+#yellow.slider .slider-selection {
+  background: #ffc107;
+}
+
+#green.slider .slider-selection {
+  background: #28a745;
+}
+
+#teal.slider .slider-selection {
+  background: #20c997;
+}
+
+#cyan.slider .slider-selection {
+  background: #17a2b8;
+}
+
+#white.slider .slider-selection {
+  background: #ffffff;
+}
+
+#gray.slider .slider-selection {
+  background: #6c757d;
+}
+
+#gray-dark.slider .slider-selection {
+  background: #343a40;
+}
+
 /*
  * Misc: print
  * -----------

dist/js/pages/dashboard.js

@@ -28,7 +28,7 @@ $(function () {
   })
 
   // bootstrap WYSIHTML5 - text editor
-  $('.textarea').wysihtml5()
+  $('.textarea').summernote()
 
   $('.daterange').daterangepicker({
     ranges   : {
@@ -115,7 +115,10 @@ $(function () {
   })
 
   // The Calender
-  $('#calendar').datepicker()
+  $('#calendar').datetimepicker({
+    format: 'L',
+    inline: true
+  })
 
   // SLIMSCROLL FOR CHAT WIDGET
   $('#chat-box').overlayScrollbars({

dist/js/pages/dashboard2.js

@@ -13,76 +13,62 @@ $(function () {
 
   // Get context with jQuery - using jQuery's .get() method.
   var salesChartCanvas = $('#salesChart').get(0).getContext('2d')
-  // This will get the first returned node in the jQuery collection.
-  var salesChart       = new Chart(salesChartCanvas)
 
   var salesChartData = {
     labels  : ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
     datasets: [
       {
+        label               : 'Digital Goods',
+        backgroundColor     : 'rgba(60,141,188,0.9)',
+        borderColor         : 'rgba(60,141,188,0.8)',
+        pointRadius          : false,
+        pointColor          : '#3b8bba',
+        pointStrokeColor    : 'rgba(60,141,188,1)',
+        pointHighlightFill  : '#fff',
+        pointHighlightStroke: 'rgba(60,141,188,1)',
+        data                : [28, 48, 40, 19, 86, 27, 90]
+      },
+      {
         label               : 'Electronics',
-        fillColor           : '#dee2e6',
-        strokeColor         : '#ced4da',
-        pointColor          : '#ced4da',
+        backgroundColor     : 'rgba(210, 214, 222, 1)',
+        borderColor         : 'rgba(210, 214, 222, 1)',
+        pointRadius         : false,
+        pointColor          : 'rgba(210, 214, 222, 1)',
         pointStrokeColor    : '#c1c7d1',
         pointHighlightFill  : '#fff',
-        pointHighlightStroke: 'rgb(220,220,220)',
+        pointHighlightStroke: 'rgba(220,220,220,1)',
         data                : [65, 59, 80, 81, 56, 55, 40]
       },
-      {
-        label               : 'Digital Goods',
-        fillColor           : 'rgba(0, 123, 255, 0.9)',
-        strokeColor         : 'rgba(0, 123, 255, 1)',
-        pointColor          : '#3b8bba',
-        pointStrokeColor    : 'rgba(0, 123, 255, 1)',
-        pointHighlightFill  : '#fff',
-        pointHighlightStroke: 'rgba(0, 123, 255, 1)',
-        data                : [28, 48, 40, 19, 86, 27, 90]
-      }
     ]
   }
 
   var salesChartOptions = {
-    //Boolean - If we should show the scale at all
-    showScale               : true,
-    //Boolean - Whether grid lines are shown across the chart
-    scaleShowGridLines      : false,
-    //String - Colour of the grid lines
-    scaleGridLineColor      : 'rgba(0,0,0,.05)',
-    //Number - Width of the grid lines
-    scaleGridLineWidth      : 1,
-    //Boolean - Whether to show horizontal lines (except X axis)
-    scaleShowHorizontalLines: true,
-    //Boolean - Whether to show vertical lines (except Y axis)
-    scaleShowVerticalLines  : true,
-    //Boolean - Whether the line is curved between points
-    bezierCurve             : true,
-    //Number - Tension of the bezier curve between points
-    bezierCurveTension      : 0.3,
-    //Boolean - Whether to show a dot for each point
-    pointDot                : false,
-    //Number - Radius of each point dot in pixels
-    pointDotRadius          : 4,
-    //Number - Pixel width of point dot stroke
-    pointDotStrokeWidth     : 1,
-    //Number - amount extra to add to the radius to cater for hit detection outside the drawn point
-    pointHitDetectionRadius : 20,
-    //Boolean - Whether to show a stroke for datasets
-    datasetStroke           : true,
-    //Number - Pixel width of dataset stroke
-    datasetStrokeWidth      : 2,
-    //Boolean - Whether to fill the dataset with a color
-    datasetFill             : true,
-    //String - A legend template
-    legendTemplate          : '<ul class="<%=name.toLowerCase()%>-legend"><% for (var i=0; i<datasets.length; i++){%><li><span style="background-color:<%=datasets[i].lineColor%>"></span><%=datasets[i].label%></li><%}%></ul>',
-    //Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
-    maintainAspectRatio     : false,
-    //Boolean - whether to make the chart responsive to window resizing
-    responsive              : true
+    maintainAspectRatio : false,
+    responsive : true,
+    legend: {
+      display: false
+    },
+    scales: {
+      xAxes: [{
+        gridLines : {
+          display : false,
+        }
+      }],
+      yAxes: [{
+        gridLines : {
+          display : false,
+        }
+      }]
+    }
   }
 
-  //Create the line chart
-  salesChart.Line(salesChartData, salesChartOptions)
+  // This will get the first returned node in the jQuery collection.
+  var salesChart = new Chart(salesChartCanvas, { 
+      type: 'line', 
+      data: salesChartData, 
+      options: salesChartOptions
+    }
+  )
 
   //---------------------------
   //- END MONTHLY SALES CHART -
@@ -92,75 +78,36 @@ $(function () {
   //- PIE CHART -
   //-------------
   // Get context with jQuery - using jQuery's .get() method.
-  var pieChartCanvas = $('#pieChart').get(0).getContext('2d')
-  var pieChart       = new Chart(pieChartCanvas)
-  var PieData        = [
-    {
-      value    : 700,
-      color    : '#dc3545',
-      highlight: '#dc3545',
-      label    : 'Chrome'
-    },
-    {
-      value    : 500,
-      color    : '#28a745',
-      highlight: '#28a745',
-      label    : 'IE'
-    },
-    {
-      value    : 400,
-      color    : '#ffc107',
-      highlight: '#ffc107',
-      label    : 'FireFox'
-    },
-    {
-      value    : 600,
-      color    : '#17a2b8',
-      highlight: '#17a2b8',
-      label    : 'Safari'
-    },
-    {
-      value    : 300,
-      color    : '#007bff',
-      highlight: '#007bff',
-      label    : 'Opera'
-    },
-    {
-      value    : 100,
-      color    : '#6c757d',
-      highlight: '#6c757d',
-      label    : 'Navigator'
+    var pieChartCanvas = $('#pieChart').get(0).getContext('2d')
+    var pieData        = {
+      labels: [
+          'Chrome', 
+          'IE',
+          'FireFox', 
+          'Safari', 
+          'Opera', 
+          'Navigator', 
+      ],
+      datasets: [
+        {
+          data: [700,500,400,600,300,100],
+          backgroundColor : ['#f56954', '#00a65a', '#f39c12', '#00c0ef', '#3c8dbc', '#d2d6de'],
+        }
+      ]
     }
-  ]
-  var pieOptions     = {
-    //Boolean - Whether we should show a stroke on each segment
-    segmentShowStroke    : true,
-    //String - The colour of each segment stroke
-    segmentStrokeColor   : '#fff',
-    //Number - The width of each segment stroke
-    segmentStrokeWidth   : 1,
-    //Number - The percentage of the chart that we cut out of the middle
-    percentageInnerCutout: 50, // This is 0 for Pie charts
-    //Number - Amount of animation steps
-    animationSteps       : 100,
-    //String - Animation easing effect
-    animationEasing      : 'easeOutBounce',
-    //Boolean - Whether we animate the rotation of the Doughnut
-    animateRotate        : true,
-    //Boolean - Whether we animate scaling the Doughnut from the centre
-    animateScale         : false,
-    //Boolean - whether to make the chart responsive to window resizing
-    responsive           : true,
-    // Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
-    maintainAspectRatio  : false,
-    //String - A legend template
-    legendTemplate       : '<ul class="<%=name.toLowerCase()%>-legend"><% for (var i=0; i<segments.length; i++){%><li><span style="background-color:<%=segments[i].fillColor%>"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>',
-    //String - A tooltip template
-    tooltipTemplate      : '<%=value %> <%=label%> users'
-  }
-  //Create pie or douhnut chart
-  // You can switch between pie and douhnut using the method below.
-  pieChart.Doughnut(PieData, pieOptions)
+    var pieOptions     = {
+      legend: {
+        display: false
+      }
+    }
+    //Create pie or douhnut chart
+    // You can switch between pie and douhnut using the method below.
+    var pieChart = new Chart(pieChartCanvas, {
+      type: 'doughnut',
+      data: pieData,
+      options: pieOptions      
+    })
+
   //-----------------
   //- END PIE CHART -
   //-----------------

index.html

@@ -10,6 +10,8 @@
   <link rel="stylesheet" href="plugins/fontawesome-free/css/all.min.css">
   <!-- Ionicons -->
   <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
+  <!-- Tempusdominus Bbootstrap 4 -->
+  <link rel="stylesheet" href="plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">
   <!-- Theme style -->
   <link rel="stylesheet" href="dist/css/adminlte.min.css">
   <!-- overlayScrollbars -->
@@ -20,12 +22,10 @@
   <link rel="stylesheet" href="plugins/morris/morris.css">
   <!-- jvectormap -->
   <link rel="stylesheet" href="plugins/jvectormap/jquery-jvectormap-1.2.2.css">
-  <!-- Date Picker -->
-  <link rel="stylesheet" href="plugins/datepicker/datepicker3.css">
   <!-- Daterange picker -->
   <link rel="stylesheet" href="plugins/daterangepicker/daterangepicker-bs3.css">
-  <!-- bootstrap wysihtml5 - text editor -->
-  <link rel="stylesheet" href="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
+  <!-- summernote -->
+  <link rel="stylesheet" href="plugins/summernote/summernote-bs4.css">
   <!-- Google Font: Source Sans Pro -->
   <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
 </head>
@@ -1108,7 +1108,7 @@
                 <!-- /. tools -->
               </div>
               <!-- /.card-header -->
-              <div class="card-body p-0">
+              <div class="card-body pt-0">
                 <!--The calendar -->
                 <div id="calendar" style="width: 100%"></div>
               </div>
@@ -1163,10 +1163,11 @@
 <!-- daterangepicker -->
 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>
 <script src="plugins/daterangepicker/daterangepicker.js"></script>
-<!-- datepicker -->
-<script src="plugins/datepicker/bootstrap-datepicker.js"></script>
-<!-- Bootstrap WYSIHTML5 -->
-<script src="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
+<!-- Tempusdominus Bootstrap 4 -->
+<script src="plugins/moment/moment.min.js"></script>
+<script src="plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>
+<!-- Summernote -->
+<script src="plugins/summernote/summernote-bs4.min.js"></script>
 <!-- overlayScrollbars -->
 <script src="plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
 <!-- FastClick -->

index2.html

@@ -1408,8 +1408,8 @@
 <!-- jVectorMap -->
 <script src="plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
 <script src="plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
-<!-- ChartJS 1.0.2 -->
-<script src="plugins/chartjs-old/Chart.min.js"></script>
+<!-- ChartJS -->
+<script src="plugins/chart.js/Chart.min.js"></script>
 
 <!-- PAGE SCRIPTS -->
 <script src="dist/js/pages/dashboard2.js"></script>

package-lock.json

@@ -194,14 +194,14 @@
       }
     },
     "@ckeditor/ckeditor5-build-classic": {
-      "version": "1.0.0-beta.4",
-      "resolved": "https://registry.npmjs.org/@ckeditor/ckeditor5-build-classic/-/ckeditor5-build-classic-1.0.0-beta.4.tgz",
-      "integrity": "sha1-ybmwfRjLnZlViuif1XtR7m5pQLg="
+      "version": "12.2.0",
+      "resolved": "https://registry.npmjs.org/@ckeditor/ckeditor5-build-classic/-/ckeditor5-build-classic-12.2.0.tgz",
+      "integrity": "sha512-En64jC5ImZoa+XLa2JrZYCKpq2iNXhdf17xgmpJoAXp+m36EqSHd6/4x0XT/pjrZSDxrcLUZxyZJlQCRtSaeHw=="
     },
     "@fortawesome/fontawesome-free": {
-      "version": "5.8.2",
-      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-5.8.2.tgz",
-      "integrity": "sha512-E4fDUF4fbu9AxKpaQQqCN3XBnNzb/5e0Gvd9OaQsYkK574LVI57v/EqqPfIm/mC7jYbxaPNrhvT5AF+Yzwyizg=="
+      "version": "5.9.0",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-5.9.0.tgz",
+      "integrity": "sha512-g795BBEzM/Hq2SYNPm/NQTIp3IWd4eXSH0ds87Na2jnrAUFX3wkyZAI4Gwj9DOaWMuz2/01i8oWI7P7T/XLkhg=="
     },
     "@mrmlnc/readdir-enhanced": {
       "version": "2.2.1",
@@ -602,13 +602,21 @@
       "dev": true
     },
     "axios": {
-      "version": "0.17.1",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-0.17.1.tgz",
-      "integrity": "sha1-LY4+XQvb1zJ/kbyBT1xXZg+Bgk0=",
+      "version": "0.19.0",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.19.0.tgz",
+      "integrity": "sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==",
       "dev": true,
       "requires": {
-        "follow-redirects": "^1.2.5",
-        "is-buffer": "^1.1.5"
+        "follow-redirects": "1.5.10",
+        "is-buffer": "^2.0.2"
+      },
+      "dependencies": {
+        "is-buffer": {
+          "version": "2.0.3",
+          "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.3.tgz",
+          "integrity": "sha512-U15Q7MXTuZlrbymiz95PJpZxu8IlipAp4dtS3wOdgPXx3mqBnslrWU14kxfHB+Py/+2PVKSr37dMAgM2A4uArw==",
+          "dev": true
+        }
       }
     },
     "babel-cli": {
@@ -1444,6 +1452,20 @@
       "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.3.1.tgz",
       "integrity": "sha512-rXqOmH1VilAt2DyPzluTi2blhk17bO7ef+zLLPlWvG494pDxcM234pJ8wTc/6R40UWizAIIMgxjvxZg5kmsbag=="
     },
+    "bootstrap-colorpicker": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/bootstrap-colorpicker/-/bootstrap-colorpicker-3.1.2.tgz",
+      "integrity": "sha512-yUWegXox8GYoXVtYdrEIN3QMOeEFbcSFGDadZu2pWmmMgTaw4ECX9T8GvYQzJkRusvK9uzi39FjE0W2k8lQECA==",
+      "requires": {
+        "bootstrap": ">=4.0",
+        "jquery": ">=2.1.0"
+      }
+    },
+    "bootstrap-slider": {
+      "version": "10.6.1",
+      "resolved": "https://registry.npmjs.org/bootstrap-slider/-/bootstrap-slider-10.6.1.tgz",
+      "integrity": "sha512-lA6SwGr33YcKHtpt0lYjwspc4RCgM2bdrFdHU1U77Lal6gZGjVF/Ii9/Mff0b1dyZ4RvSAzaOlSsuY1d5wCtdA=="
+    },
     "boxen": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.3.0.tgz",
@@ -1541,12 +1563,12 @@
       }
     },
     "browser-sync": {
-      "version": "2.26.5",
-      "resolved": "https://registry.npmjs.org/browser-sync/-/browser-sync-2.26.5.tgz",
-      "integrity": "sha512-zVa6MmadAFgl5Uk53Yy5cw5tGTO7xSGAWK3Yx70GJ1t5jK+r6B4q3xq+1XbYfLt1SbeFg7WoNWneNhMT4B9jFw==",
+      "version": "2.26.7",
+      "resolved": "https://registry.npmjs.org/browser-sync/-/browser-sync-2.26.7.tgz",
+      "integrity": "sha512-lY3emme0OyvA2ujEMpRmyRy9LY6gHLuTr2/ABxhIm3lADOiRXzP4dgekvnDrQqZ/Ec2Fz19lEjm6kglSG5766w==",
       "dev": true,
       "requires": {
-        "browser-sync-client": "^2.26.4",
+        "browser-sync-client": "^2.26.6",
         "browser-sync-ui": "^2.26.4",
         "bs-recipes": "1.3.4",
         "bs-snippet-injector": "^2.0.1",
@@ -1561,7 +1583,7 @@
         "fs-extra": "3.0.1",
         "http-proxy": "1.15.2",
         "immutable": "^3",
-        "localtunnel": "1.9.1",
+        "localtunnel": "1.9.2",
         "micromatch": "^3.1.10",
         "opn": "5.3.0",
         "portscanner": "2.1.1",
@@ -2490,9 +2512,9 @@
       }
     },
     "browser-sync-client": {
-      "version": "2.26.4",
-      "resolved": "https://registry.npmjs.org/browser-sync-client/-/browser-sync-client-2.26.4.tgz",
-      "integrity": "sha512-mQiDp5/tf79VezDS5j/EExU4Ze6f5DQYuL0Z7VdJgBbNLTHDfkYGi2R620qc6HkY9XZA0m4/UwihT7J42RBIJA==",
+      "version": "2.26.6",
+      "resolved": "https://registry.npmjs.org/browser-sync-client/-/browser-sync-client-2.26.6.tgz",
+      "integrity": "sha512-mGrkZdNzttKdf/16I+y+2dTQxoMCIpKbVIMJ/uP8ZpnKu9f9qa/2CYVtLtbjZG8nsM14EwiCrjuFTGBEnT3Gjw==",
       "dev": true,
       "requires": {
         "etag": "1.8.1",
@@ -4412,6 +4434,11 @@
       "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=",
       "dev": true
     },
+    "fastclick": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/fastclick/-/fastclick-1.0.6.tgz",
+      "integrity": "sha1-FhYlsnsaWAZAWTa9qaLBkm0Gvmo="
+    },
     "fastparse": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
@@ -4501,29 +4528,38 @@
       "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I=",
       "dev": true
     },
+    "flot": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/flot/-/flot-3.1.1.tgz",
+      "integrity": "sha512-Xn8rhWlV7KYFCiFCPiqEXN8TDEFWQVP4MVVPDgfYvhzWQYInmcX8FWzSm9CK+7VxPBcMBjlDFi5nhPSsAL0IcQ==",
+      "requires": {
+        "regenerator-runtime": "~0.13.2"
+      },
+      "dependencies": {
+        "regenerator-runtime": {
+          "version": "0.13.2",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.2.tgz",
+          "integrity": "sha512-S/TQAZJO+D3m9xeN1WTI8dLKBBiRgXBlTJvbWjCThHWZj9EvHK70Ff50/tYj2J/fvBY6JtFVwRuazHN2E7M9BA=="
+        }
+      }
+    },
     "follow-redirects": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.7.0.tgz",
-      "integrity": "sha512-m/pZQy4Gj287eNy94nivy5wchN3Kp+Q5WgUPNy5lJSZ3sgkVKSYV/ZChMAQVIgx1SqfZ2zBZtPA2YlXIWxxJOQ==",
+      "version": "1.5.10",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
+      "integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
       "dev": true,
       "requires": {
-        "debug": "^3.2.6"
+        "debug": "=3.1.0"
       },
       "dependencies": {
         "debug": {
-          "version": "3.2.6",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
-          "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
           "dev": true,
           "requires": {
-            "ms": "^2.1.1"
+            "ms": "2.0.0"
           }
-        },
-        "ms": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
-          "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==",
-          "dev": true
         }
       }
     },
@@ -6753,17 +6789,32 @@
       }
     },
     "localtunnel": {
-      "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/localtunnel/-/localtunnel-1.9.1.tgz",
-      "integrity": "sha512-HWrhOslklDvxgOGFLxi6fQVnvpl6XdX4sPscfqMZkzi3gtt9V7LKBWYvNUcpHSVvjwCQ6xzXacVvICNbNcyPnQ==",
+      "version": "1.9.2",
+      "resolved": "https://registry.npmjs.org/localtunnel/-/localtunnel-1.9.2.tgz",
+      "integrity": "sha512-NEKF7bDJE9U3xzJu3kbayF0WTvng6Pww7tzqNb/XtEARYwqw7CKEX7BvOMg98FtE9es2CRizl61gkV3hS8dqYg==",
       "dev": true,
       "requires": {
-        "axios": "0.17.1",
-        "debug": "2.6.9",
+        "axios": "0.19.0",
+        "debug": "4.1.1",
         "openurl": "1.1.1",
         "yargs": "6.6.0"
       },
       "dependencies": {
+        "debug": {
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
+          "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+          "dev": true,
+          "requires": {
+            "ms": "^2.1.1"
+          }
+        },
+        "ms": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
+          "dev": true
+        },
         "yargs": {
           "version": "6.6.0",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
@@ -7130,6 +7181,14 @@
       "resolved": "https://registry.npmjs.org/moment/-/moment-2.24.0.tgz",
       "integrity": "sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg=="
     },
+    "moment-timezone": {
+      "version": "0.5.25",
+      "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.25.tgz",
+      "integrity": "sha512-DgEaTyN/z0HFaVcVbSyVCUU6HeFdnNC3vE4c9cgu2dgMTvjBUBdBzWfasTBmAW45u5OIMeCJtU8yNjM22DHucw==",
+      "requires": {
+        "moment": ">= 2.9.0"
+      }
+    },
     "ms": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
@@ -7299,9 +7358,9 @@
       }
     },
     "nodemon": {
-      "version": "1.19.0",
-      "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-1.19.0.tgz",
-      "integrity": "sha512-NHKpb/Je0Urmwi3QPDHlYuFY9m1vaVfTsRZG5X73rY46xPj0JpNe8WhUGQdkDXQDOxrBNIU3JrcflE9Y44EcuA==",
+      "version": "1.19.1",
+      "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-1.19.1.tgz",
+      "integrity": "sha512-/DXLzd/GhiaDXXbGId5BzxP1GlsqtMGM9zTmkWrgXtSqjKmGSbLicM/oAy4FR0YWm14jCHRwnR31AHS2dYFHrg==",
       "dev": true,
       "requires": {
         "chokidar": "^2.1.5",
@@ -7408,9 +7467,9 @@
           },
           "dependencies": {
             "ms": {
-              "version": "2.1.1",
-              "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
-              "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==",
+              "version": "2.1.2",
+              "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+              "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
               "dev": true
             }
           }
@@ -10675,9 +10734,9 @@
       "dev": true
     },
     "pstree.remy": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/pstree.remy/-/pstree.remy-1.1.6.tgz",
-      "integrity": "sha512-NdF35+QsqD7EgNEI5mkI/X+UwaxVEbQaz9f4IooEmMUv6ZPmlTQYGjBPJGgrlzNdjSvIy4MWMg6Q6vCgBO2K+w==",
+      "version": "1.1.7",
+      "resolved": "https://registry.npmjs.org/pstree.remy/-/pstree.remy-1.1.7.tgz",
+      "integrity": "sha512-xsMgrUwRpuGskEzBFkH8NmTimbZ5PcPup0LA8JJkHIm2IMUbQcpo3yeLNWVrufEYjh8YwtSVh0xz6UeWc5Oh5A==",
       "dev": true
     },
     "punycode": {
@@ -12065,6 +12124,11 @@
         "schema-utils": "^0.3.0"
       }
     },
+    "summernote": {
+      "version": "0.8.12",
+      "resolved": "https://registry.npmjs.org/summernote/-/summernote-0.8.12.tgz",
+      "integrity": "sha512-RVEJoIyztwPpopTwZvjag1WOvbmhUGFe6Mc9RADzzcX1ogG8pIXCB88icu/vjNYihITrzj2zZsoFMcDRHSlhEA=="
+    },
     "supports-color": {
       "version": "5.4.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.4.0.tgz",
@@ -12188,6 +12252,18 @@
         "inherits": "2"
       }
     },
+    "tempusdominus-bootstrap-4": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/tempusdominus-bootstrap-4/-/tempusdominus-bootstrap-4-5.1.2.tgz",
+      "integrity": "sha512-ksD8qc4wOJeE19wvryXmEpRzMUSZu4wSOdG6zKSn8l4ccad16249KOX1j0CccyZpuuES/n4FLqLAUB+Dd1LTBA==",
+      "requires": {
+        "bootstrap": ">=4.1.2",
+        "jquery": "^3.0",
+        "moment": "^2.22.2",
+        "moment-timezone": "^0.5.11",
+        "popper.js": "^1.14.3"
+      }
+    },
     "term-size": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/term-size/-/term-size-1.2.0.tgz",
@@ -12390,9 +12466,9 @@
       "dev": true
     },
     "uglify-js": {
-      "version": "3.5.13",
-      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.5.13.tgz",
-      "integrity": "sha512-Lho+IJlquX6sdJgyKSJx/M9y4XbDd3ekPjD8S6HYmT5yVSwDtlSuca2w5hV4g2dIsp0Y/4orbfWxKexodmFv7w==",
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.6.0.tgz",
+      "integrity": "sha512-W+jrUHJr3DXKhrsS7NUVxn3zqMOFn0hL/Ei6v0anCIMoKC93TjcflTagwIHLW7SfMFfiQuktQyFVCFHGUE0+yg==",
       "dev": true,
       "requires": {
         "commander": "~2.20.0",
@@ -12838,9 +12914,9 @@
       }
     },
     "write-file-atomic": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.4.2.tgz",
-      "integrity": "sha512-s0b6vB3xIVRLWywa6X9TOMA7k9zio0TMOsl9ZnDkliA/cfJlpHXAscj0gbHVJiTdIuAYpIyqS5GW91fqm6gG5g==",
+      "version": "2.4.3",
+      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.4.3.tgz",
+      "integrity": "sha512-GaETH5wwsX+GcnzhPgKcKjJ6M2Cq3/iZp1WyY/X1CSqrW+jVNM9Y7D8EC2sM4ZG/V8wZlSniJnCKWPmBYAucRQ==",
       "dev": true,
       "requires": {
         "graceful-fs": "^4.1.11",

package.json

@@ -44,19 +44,23 @@
     "url": "https://github.com/ColorlibHQ/AdminLTE/issues"
   },
   "dependencies": {
-    "@ckeditor/ckeditor5-build-classic": "^1.0.0-beta.4",
-    "@fortawesome/fontawesome-free": "^5.8.2",
+    "@ckeditor/ckeditor5-build-classic": "^12.2.0",
+    "@fortawesome/fontawesome-free": "^5.9.0",
     "bootstrap": "^4.3.1",
+    "bootstrap-colorpicker": "^3.1.2",
+    "bootstrap-slider": "^10.6.1",
     "chart.js": "^2.8.0",
     "datatables.net": "^1.10.19",
     "datatables.net-bs4": "^1.10.19",
+    "fastclick": "^1.0.6",
+    "flot": "^3.1.1",
     "jquery": "^3.4.1",
     "jquery-ui": "^1.12.1",
+    "moment": "^2.24.0",
     "overlayscrollbars": "^1.7.1",
-    "popper.js": "^1.15.0"
-  },
-  "peerDependencies": {
-    "font-awesome": "^4.7.0"
+    "popper.js": "^1.15.0",
+    "summernote": "^0.8.12",
+    "tempusdominus-bootstrap-4": "^5.1.2"
   },
   "devDependencies": {
     "autoprefixer": "^8.6.5",
@@ -65,7 +69,7 @@
     "babel-eslint": "^8.2.6",
     "babel-plugin-external-helpers": "^6.22.0",
     "babel-preset-env": "^1.7.0",
-    "browser-sync": "^2.26.5",
+    "browser-sync": "^2.26.7",
     "clean-css-cli": "^4.3.0",
     "css-loader": "^0.28.11",
     "eslint": "^4.19.1",
@@ -74,13 +78,13 @@
     "fs-extra": "^5.0.0",
     "ncp": "^2.0.0",
     "node-sass": "^4.12.0",
-    "nodemon": "^1.19.0",
+    "nodemon": "^1.19.1",
     "npm-run-all": "^4.1.5",
     "path": "^0.12.7",
     "postcss-cli": "^5.0.1",
     "rollup": "^0.55.5",
     "rollup-plugin-babel": "^3.0.7",
     "style-loader": "^0.19.1",
-    "uglify-js": "^3.5.13"
+    "uglify-js": "^3.6.0"
   }
 }

pages/UI/sliders.html

@@ -16,7 +16,7 @@
   <!-- ion slider Nice -->
   <link rel="stylesheet" href="../../plugins/ionslider/ion.rangeSlider.skinNice.css">
   <!-- bootstrap slider -->
-  <link rel="stylesheet" href="../../plugins/bootstrap-slider/slider.css">
+  <link rel="stylesheet" href="../../plugins/bootstrap-slider/css/bootstrap-slider.min.css">
   <!-- Theme style -->
   <link rel="stylesheet" href="../../dist/css/adminlte.min.css">
   <!-- Google Font: Source Sans Pro -->
@@ -625,9 +625,9 @@
                     <p>data-slider-id="yellow"</p>
                     <input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200"
                            data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="horizontal"
-                           data-slider-selection="before" data-slider-tooltip="show" data-slider-id="aqua">
+                           data-slider-selection="before" data-slider-tooltip="show" data-slider-id="teal">
 
-                    <p>data-slider-id="aqua"</p>
+                    <p>data-slider-id="teal"</p>
                     <input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200"
                            data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="horizontal"
                            data-slider-selection="before" data-slider-tooltip="show" data-slider-id="purple">
@@ -649,7 +649,7 @@
                            data-slider-selection="before" data-slider-tooltip="show" data-slider-id="yellow">
                     <input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200"
                            data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="vertical"
-                           data-slider-selection="before" data-slider-tooltip="show" data-slider-id="aqua">
+                           data-slider-selection="before" data-slider-tooltip="show" data-slider-id="teal">
                     <input type="text" value="" class="slider form-control" data-slider-min="-200" data-slider-max="200"
                            data-slider-step="5" data-slider-value="[-100,100]" data-slider-orientation="vertical"
                            data-slider-selection="before" data-slider-tooltip="show" data-slider-id="purple">
@@ -698,11 +698,11 @@
 <!-- Ion Slider -->
 <script src="../../plugins/ionslider/ion.rangeSlider.min.js"></script>
 <!-- Bootstrap slider -->
-<script src="../../plugins/bootstrap-slider/bootstrap-slider.js"></script>
+<script src="../../plugins/bootstrap-slider/bootstrap-slider.min.js"></script>
 <script>
   $(function () {
     /* BOOTSTRAP SLIDER */
-    $('.slider').slider()
+    $('.slider').bootstrapSlider()
 
     /* ION SLIDER */
     $('#range_1').ionRangeSlider({

pages/charts/chartjs.html

@@ -658,8 +658,8 @@
 <script src="../../plugins/jquery/jquery.min.js"></script>
 <!-- Bootstrap 4 -->
 <script src="../../plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
-<!-- ChartJS 1.0.1 -->
-<script src="../../plugins/chartjs-old/Chart.min.js"></script>
+<!-- ChartJS -->
+<script src="../../plugins/chart.js/Chart.min.js"></script>
 <!-- FastClick -->
 <script src="../../plugins/fastclick/fastclick.js"></script>
 <!-- AdminLTE App -->
@@ -680,197 +680,134 @@
 
     // Get context with jQuery - using jQuery's .get() method.
     var areaChartCanvas = $('#areaChart').get(0).getContext('2d')
-    // This will get the first returned node in the jQuery collection.
-    var areaChart       = new Chart(areaChartCanvas)
 
     var areaChartData = {
       labels  : ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
       datasets: [
         {
+          label               : 'Digital Goods',
+          backgroundColor     : 'rgba(60,141,188,0.9)',
+          borderColor         : 'rgba(60,141,188,0.8)',
+          pointRadius          : false,
+          pointColor          : '#3b8bba',
+          pointStrokeColor    : 'rgba(60,141,188,1)',
+          pointHighlightFill  : '#fff',
+          pointHighlightStroke: 'rgba(60,141,188,1)',
+          data                : [28, 48, 40, 19, 86, 27, 90]
+        },
+        {
           label               : 'Electronics',
-          fillColor           : 'rgba(210, 214, 222, 1)',
-          strokeColor         : 'rgba(210, 214, 222, 1)',
+          backgroundColor     : 'rgba(210, 214, 222, 1)',
+          borderColor         : 'rgba(210, 214, 222, 1)',
+          pointRadius         : false,
           pointColor          : 'rgba(210, 214, 222, 1)',
           pointStrokeColor    : '#c1c7d1',
           pointHighlightFill  : '#fff',
           pointHighlightStroke: 'rgba(220,220,220,1)',
           data                : [65, 59, 80, 81, 56, 55, 40]
         },
-        {
-          label               : 'Digital Goods',
-          fillColor           : 'rgba(60,141,188,0.9)',
-          strokeColor         : 'rgba(60,141,188,0.8)',
-          pointColor          : '#3b8bba',
-          pointStrokeColor    : 'rgba(60,141,188,1)',
-          pointHighlightFill  : '#fff',
-          pointHighlightStroke: 'rgba(60,141,188,1)',
-          data                : [28, 48, 40, 19, 86, 27, 90]
-        }
       ]
     }
 
     var areaChartOptions = {
-      //Boolean - If we should show the scale at all
-      showScale               : true,
-      //Boolean - Whether grid lines are shown across the chart
-      scaleShowGridLines      : false,
-      //String - Colour of the grid lines
-      scaleGridLineColor      : 'rgba(0,0,0,.05)',
-      //Number - Width of the grid lines
-      scaleGridLineWidth      : 1,
-      //Boolean - Whether to show horizontal lines (except X axis)
-      scaleShowHorizontalLines: true,
-      //Boolean - Whether to show vertical lines (except Y axis)
-      scaleShowVerticalLines  : true,
-      //Boolean - Whether the line is curved between points
-      bezierCurve             : true,
-      //Number - Tension of the bezier curve between points
-      bezierCurveTension      : 0.3,
-      //Boolean - Whether to show a dot for each point
-      pointDot                : false,
-      //Number - Radius of each point dot in pixels
-      pointDotRadius          : 4,
-      //Number - Pixel width of point dot stroke
-      pointDotStrokeWidth     : 1,
-      //Number - amount extra to add to the radius to cater for hit detection outside the drawn point
-      pointHitDetectionRadius : 20,
-      //Boolean - Whether to show a stroke for datasets
-      datasetStroke           : true,
-      //Number - Pixel width of dataset stroke
-      datasetStrokeWidth      : 2,
-      //Boolean - Whether to fill the dataset with a color
-      datasetFill             : true,
-      //String - A legend template
-      legendTemplate          : '<ul class="<%=name.toLowerCase()%>-legend"><% for (var i=0; i<datasets.length; i++){%><li><span style="background-color:<%=datasets[i].lineColor%>"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>',
-      //Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
-      maintainAspectRatio     : true,
-      //Boolean - whether to make the chart responsive to window resizing
-      responsive              : true
+      maintainAspectRatio : false,
+      responsive : true,
+      legend: {
+        display: false
+      },
+      scales: {
+        xAxes: [{
+          gridLines : {
+            display : false,
+          }
+        }],
+        yAxes: [{
+          gridLines : {
+            display : false,
+          }
+        }]
+      }
     }
 
-    //Create the line chart
-    areaChart.Line(areaChartData, areaChartOptions)
+    // This will get the first returned node in the jQuery collection.
+    var areaChart       = new Chart(areaChartCanvas, { 
+      type: 'line',
+      data: areaChartData, 
+      options: areaChartOptions
+    })
 
     //-------------
     //- LINE CHART -
     //--------------
-    var lineChartCanvas          = $('#lineChart').get(0).getContext('2d')
-    var lineChart                = new Chart(lineChartCanvas)
-    var lineChartOptions         = areaChartOptions
+    var lineChartCanvas = $('#lineChart').get(0).getContext('2d')
+    var lineChartOptions = areaChartOptions
+    var lineChartData = areaChartData
+    lineChartData.datasets[0].fill = false;
+    lineChartData.datasets[1].fill = false;
     lineChartOptions.datasetFill = false
-    lineChart.Line(areaChartData, lineChartOptions)
+
+    var lineChart = new Chart(lineChartCanvas, { 
+      type: 'line',
+      data: lineChartData, 
+      options: lineChartOptions
+    })
 
     //-------------
     //- PIE CHART -
     //-------------
     // Get context with jQuery - using jQuery's .get() method.
     var pieChartCanvas = $('#pieChart').get(0).getContext('2d')
-    var pieChart       = new Chart(pieChartCanvas)
-    var PieData        = [
-      {
-        value    : 700,
-        color    : '#f56954',
-        highlight: '#f56954',
-        label    : 'Chrome'
-      },
-      {
-        value    : 500,
-        color    : '#00a65a',
-        highlight: '#00a65a',
-        label    : 'IE'
-      },
-      {
-        value    : 400,
-        color    : '#f39c12',
-        highlight: '#f39c12',
-        label    : 'FireFox'
-      },
-      {
-        value    : 600,
-        color    : '#00c0ef',
-        highlight: '#00c0ef',
-        label    : 'Safari'
-      },
-      {
-        value    : 300,
-        color    : '#3c8dbc',
-        highlight: '#3c8dbc',
-        label    : 'Opera'
-      },
-      {
-        value    : 100,
-        color    : '#d2d6de',
-        highlight: '#d2d6de',
-        label    : 'Navigator'
-      }
-    ]
+    var pieData        = {
+      labels: [
+          'Chrome', 
+          'IE',
+          'FireFox', 
+          'Safari', 
+          'Opera', 
+          'Navigator', 
+      ],
+      datasets: [
+        {
+          data: [700,500,400,600,300,100],
+          backgroundColor : ['#f56954', '#00a65a', '#f39c12', '#00c0ef', '#3c8dbc', '#d2d6de'],
+        }
+      ]
+    }
     var pieOptions     = {
-      //Boolean - Whether we should show a stroke on each segment
-      segmentShowStroke    : true,
-      //String - The colour of each segment stroke
-      segmentStrokeColor   : '#fff',
-      //Number - The width of each segment stroke
-      segmentStrokeWidth   : 2,
-      //Number - The percentage of the chart that we cut out of the middle
-      percentageInnerCutout: 50, // This is 0 for Pie charts
-      //Number - Amount of animation steps
-      animationSteps       : 100,
-      //String - Animation easing effect
-      animationEasing      : 'easeOutBounce',
-      //Boolean - Whether we animate the rotation of the Doughnut
-      animateRotate        : true,
-      //Boolean - Whether we animate scaling the Doughnut from the centre
-      animateScale         : false,
-      //Boolean - whether to make the chart responsive to window resizing
-      responsive           : true,
-      // Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
-      maintainAspectRatio  : true,
-      //String - A legend template
-      legendTemplate       : '<ul class="<%=name.toLowerCase()%>-legend"><% for (var i=0; i<segments.length; i++){%><li><span style="background-color:<%=segments[i].fillColor%>"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>'
     }
     //Create pie or douhnut chart
     // You can switch between pie and douhnut using the method below.
-    pieChart.Doughnut(PieData, pieOptions)
+    var pieChart = new Chart(pieChartCanvas, {
+      type: 'doughnut',
+      data: pieData,
+      options: pieOptions      
+    })
+    // pieChart.Doughnut(PieData, pieOptions)
 
     //-------------
     //- BAR CHART -
     //-------------
-    var barChartCanvas                   = $('#barChart').get(0).getContext('2d')
-    var barChart                         = new Chart(barChartCanvas)
-    var barChartData                     = areaChartData
-    barChartData.datasets[1].fillColor   = '#00a65a'
-    barChartData.datasets[1].strokeColor = '#00a65a'
-    barChartData.datasets[1].pointColor  = '#00a65a'
-    var barChartOptions                  = {
-      //Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value
-      scaleBeginAtZero        : true,
-      //Boolean - Whether grid lines are shown across the chart
-      scaleShowGridLines      : true,
-      //String - Colour of the grid lines
-      scaleGridLineColor      : 'rgba(0,0,0,.05)',
-      //Number - Width of the grid lines
-      scaleGridLineWidth      : 1,
-      //Boolean - Whether to show horizontal lines (except X axis)
-      scaleShowHorizontalLines: true,
-      //Boolean - Whether to show vertical lines (except Y axis)
-      scaleShowVerticalLines  : true,
-      //Boolean - If there is a stroke on each bar
-      barShowStroke           : true,
-      //Number - Pixel width of the bar stroke
-      barStrokeWidth          : 2,
-      //Number - Spacing between each of the X value sets
-      barValueSpacing         : 5,
-      //Number - Spacing between data sets within X values
-      barDatasetSpacing       : 1,
-      //String - A legend template
-      legendTemplate          : '<ul class="<%=name.toLowerCase()%>-legend"><% for (var i=0; i<datasets.length; i++){%><li><span style="background-color:<%=datasets[i].fillColor%>"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>',
-      //Boolean - whether to make the chart responsive
+    var barChartCanvas = $('#barChart').get(0).getContext('2d')
+    var barChartData = jQuery.extend(true, {}, areaChartData)
+    var temp0 = areaChartData.datasets[0]
+    var temp1 = areaChartData.datasets[1]
+    barChartData.datasets[0] = temp1
+    barChartData.datasets[1] = temp0
+    // barChartData.datasets[1].backgroundColor = '#00a65a'
+    // barChartData.datasets[1].borderColor = '#00a65a'
+
+    var barChartOptions = {
       responsive              : true,
       maintainAspectRatio     : true
     }
 
     barChartOptions.datasetFill = false
-    barChart.Bar(barChartData, barChartOptions)
+    var barChart = new Chart(barChartCanvas, {
+      type: 'bar', 
+      data: barChartData,
+      options: barChartOptions
+    })
+    // barChart.Bar(barChartData, barChartOptions)
   })
 </script>
 </body>

pages/forms/advanced.html

@@ -16,9 +16,9 @@
   <!-- iCheck for checkboxes and radio inputs -->
   <link rel="stylesheet" href="../../plugins/iCheck/all.css">
   <!-- Bootstrap Color Picker -->
-  <link rel="stylesheet" href="../../plugins/colorpicker/bootstrap-colorpicker.min.css">
-  <!-- Bootstrap time Picker -->
-  <link rel="stylesheet" href="../../plugins/timepicker/bootstrap-timepicker.min.css">
+  <link rel="stylesheet" href="../../plugins/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css">
+  <!-- Tempusdominus Bbootstrap 4 -->
+  <link rel="stylesheet" href="../../plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">
   <!-- Select2 -->
   <link rel="stylesheet" href="../../plugins/select2/select2.min.css">
   <!-- Theme style -->
@@ -754,13 +754,12 @@
                   <div class="form-group">
                     <label>Time picker:</label>
 
-                    <div class="input-group">
-                      <input type="text" class="form-control timepicker">
-
-                      <div class="input-group-append">
-                        <span class="input-group-text"><i class="far fa-clock"></i></span>
+                    <div class="input-group date" id="timepicker" data-target-input="nearest">
+                      <input type="text" class="form-control datetimepicker-input" data-target="#timepicker"/>
+                      <div class="input-group-append" data-target="#timepicker" data-toggle="datetimepicker">
+                          <div class="input-group-text"><i class="far fa-clock"></i></div>
+                      </div>
                       </div>
-                    </div>
                     <!-- /.input group -->
                   </div>
                   <!-- /.form group -->
@@ -963,13 +962,13 @@
 <script src="../../plugins/input-mask/jquery.inputmask.js"></script>
 <script src="../../plugins/input-mask/jquery.inputmask.date.extensions.js"></script>
 <script src="../../plugins/input-mask/jquery.inputmask.extensions.js"></script>
+<script src="../../plugins/moment/moment.min.js"></script>
 <!-- date-range-picker -->
-<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>
 <script src="../../plugins/daterangepicker/daterangepicker.js"></script>
 <!-- bootstrap color picker -->
-<script src="../../plugins/colorpicker/bootstrap-colorpicker.min.js"></script>
-<!-- bootstrap time picker -->
-<script src="../../plugins/timepicker/bootstrap-timepicker.min.js"></script>
+<script src="../../plugins/bootstrap-colorpicker/js/bootstrap-colorpicker.min.js"></script>
+<!-- Tempusdominus Bootstrap 4 -->
+<script src="../../plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>
 <!-- iCheck 1.0.1 -->
 <script src="../../plugins/iCheck/icheck.min.js"></script>
 <!-- FastClick -->
@@ -1034,17 +1033,19 @@
       radioClass   : 'iradio_flat-green'
     })
 
+    //Timepicker
+    $('#timepicker').datetimepicker({
+      format: 'LT'
+    })
+
     //Colorpicker
     $('.my-colorpicker1').colorpicker()
     //color picker with addon
     $('.my-colorpicker2').colorpicker()
 
-    //Timepicker
-    $('.timepicker').timepicker({
-      showInputs: false,
-      upArrowStyle: 'fas fa-chevron-up',
-      downArrowStyle: 'fas fa-chevron-down'
-    })
+    $('.my-colorpicker2').on('colorpickerChange', function(event) {
+      $('.my-colorpicker2 .fa-square').css('color', event.color.toString());
+    });
   })
 </script>
 </body>

pages/forms/editors.html

@@ -13,8 +13,8 @@
   <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
   <!-- Theme style -->
   <link rel="stylesheet" href="../../dist/css/adminlte.min.css">
-  <!-- bootstrap wysihtml5 - text editor -->
-  <link rel="stylesheet" href="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
+  <!-- summernote -->
+  <link rel="stylesheet" href="../../plugins/summernote/summernote-bs4.css">
   <!-- Google Font: Source Sans Pro -->
   <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
 </head>
@@ -550,40 +550,6 @@
     <section class="content">
       <div class="row">
         <div class="col-md-12">
-          <div class="card card-info card-outline">
-            <div class="card-header">
-              <h3 class="card-title">
-                CKEditor5
-                <small>Advanced and full of features</small>
-              </h3>
-              <!-- tools box -->
-              <div class="card-tools">
-                <button type="button" class="btn btn-tool btn-sm"
-                        data-widget="collapse"
-                        data-toggle="tooltip"
-                        title="Collapse">
-                  <i class="fas fa-minus"></i>
-                </button>
-                <button type="button" class="btn btn-tool btn-sm"
-                        data-widget="remove"
-                        data-toggle="tooltip"
-                        title="Remove">
-                  <i class="fas fa-times"></i>
-                </button>
-              </div>
-              <!-- /. tools -->
-            </div>
-            <!-- /.card-header -->
-            <div class="card-body">
-              <div class="mb-3">
-                <textarea id="editor1" name="editor1" style="width: 100%">This is my textarea to be replaced with CKEditor.</textarea>
-              </div>
-              <p class="text-sm mb-0">Please adhere to the <a href="https://ckeditor.com/ckeditor-5-builds/#classic">CKEditor</a>
-                license when using it!</p>
-            </div>
-          </div>
-          <!-- /.card -->
-
           <div class="card card-outline card-info">
             <div class="card-header">
               <h3 class="card-title">
@@ -647,28 +613,12 @@
 <script src="../../dist/js/adminlte.min.js"></script>
 <!-- AdminLTE for demo purposes -->
 <script src="../../dist/js/demo.js"></script>
-<!-- CK Editor -->
-<script src="../../plugins/ckeditor/ckeditor.js"></script>
-<!-- Bootstrap WYSIHTML5 -->
-<script src="../../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
+<!-- Summernote -->
+<script src="../../plugins/summernote/summernote-bs4.min.js"></script>
 <script>
   $(function () {
-    // Replace the <textarea id="editor1"> with a CKEditor
-    // instance, using default configuration.
-    ClassicEditor
-      .create(document.querySelector('#editor1'))
-      .then(function (editor) {
-        // The editor instance
-      })
-      .catch(function (error) {
-        console.error(error)
-      })
-
-    // bootstrap WYSIHTML5 - text editor
-
-    $('.textarea').wysihtml5({
-      toolbar: { fa: true }
-    })
+    // Summernote
+    $('.textarea').summernote()
   })
 </script>
 </body>

plugins/bootstrap-colorpicker/css/bootstrap-colorpicker.css

@@ -0,0 +1,399 @@
+/*!
+ * Bootstrap Colorpicker - Bootstrap Colorpicker is a modular color picker plugin for Bootstrap 4.
+ * @package bootstrap-colorpicker
+ * @version v3.1.2
+ * @license MIT
+ * @link https://farbelous.github.io/bootstrap-colorpicker/
+ * @link https://github.com/farbelous/bootstrap-colorpicker.git
+ */
+.colorpicker {
+  position: relative;
+  display: none;
+  font-size: inherit;
+  color: inherit;
+  text-align: left;
+  list-style: none;
+  background-color: #ffffff;
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  padding: .75rem .75rem;
+  width: 148px;
+  border-radius: 4px;
+  -webkit-box-sizing: content-box;
+          box-sizing: content-box; }
+
+.colorpicker.colorpicker-disabled,
+.colorpicker.colorpicker-disabled * {
+  cursor: default !important; }
+
+.colorpicker div {
+  position: relative; }
+
+.colorpicker-popup {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  float: left;
+  margin-top: 1px;
+  z-index: 1060; }
+
+.colorpicker-popup.colorpicker-bs-popover-content {
+  position: relative;
+  top: auto;
+  left: auto;
+  float: none;
+  margin: 0;
+  z-index: initial;
+  border: none;
+  padding: 0.25rem 0;
+  border-radius: 0;
+  background: none;
+  -webkit-box-shadow: none;
+          box-shadow: none; }
+
+.colorpicker:before,
+.colorpicker:after {
+  content: "";
+  display: table;
+  clear: both;
+  line-height: 0; }
+
+.colorpicker-clear {
+  clear: both;
+  display: block; }
+
+.colorpicker:before {
+  content: '';
+  display: inline-block;
+  border-left: 7px solid transparent;
+  border-right: 7px solid transparent;
+  border-bottom: 7px solid #ccc;
+  border-bottom-color: rgba(0, 0, 0, 0.2);
+  position: absolute;
+  top: -7px;
+  left: auto;
+  right: 6px; }
+
+.colorpicker:after {
+  content: '';
+  display: inline-block;
+  border-left: 6px solid transparent;
+  border-right: 6px solid transparent;
+  border-bottom: 6px solid #ffffff;
+  position: absolute;
+  top: -6px;
+  left: auto;
+  right: 7px; }
+
+.colorpicker.colorpicker-with-alpha {
+  width: 170px; }
+
+.colorpicker.colorpicker-with-alpha .colorpicker-alpha {
+  display: block; }
+
+.colorpicker-saturation {
+  position: relative;
+  width: 126px;
+  height: 126px;
+  /* FF3.6+ */
+  /* Chrome,Safari4+ */
+  /* Chrome10+,Safari5.1+ */
+  /* Opera 11.10+ */
+  /* IE10+ */
+  background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(black)), -webkit-gradient(linear, left top, right top, from(white), to(rgba(255, 255, 255, 0)));
+  background: linear-gradient(to bottom, transparent 0%, black 100%), linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%);
+  /* W3C */
+  cursor: crosshair;
+  float: left;
+  -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
+          box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
+  margin-bottom: 6px; }
+  .colorpicker-saturation .colorpicker-guide {
+    display: block;
+    height: 6px;
+    width: 6px;
+    border-radius: 6px;
+    border: 1px solid #000;
+    -webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.8);
+            box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.8);
+    position: absolute;
+    top: 0;
+    left: 0;
+    margin: -3px 0 0 -3px; }
+
+.colorpicker-hue,
+.colorpicker-alpha {
+  position: relative;
+  width: 16px;
+  height: 126px;
+  float: left;
+  cursor: row-resize;
+  margin-left: 6px;
+  margin-bottom: 6px; }
+
+.colorpicker-alpha-color {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%; }
+
+.colorpicker-hue,
+.colorpicker-alpha-color {
+  -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
+          box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); }
+
+.colorpicker-hue .colorpicker-guide,
+.colorpicker-alpha .colorpicker-guide {
+  display: block;
+  height: 4px;
+  background: rgba(255, 255, 255, 0.8);
+  border: 1px solid rgba(0, 0, 0, 0.4);
+  position: absolute;
+  top: 0;
+  left: 0;
+  margin-left: -2px;
+  margin-top: -2px;
+  right: -2px;
+  z-index: 1; }
+
+.colorpicker-hue {
+  /* FF3.6+ */
+  /* Chrome,Safari4+ */
+  /* Chrome10+,Safari5.1+ */
+  /* Opera 11.10+ */
+  /* IE10+ */
+  background: -webkit-gradient(linear, left bottom, left top, from(red), color-stop(8%, #ff8000), color-stop(17%, yellow), color-stop(25%, #80ff00), color-stop(33%, lime), color-stop(42%, #00ff80), color-stop(50%, cyan), color-stop(58%, #0080ff), color-stop(67%, blue), color-stop(75%, #8000ff), color-stop(83%, magenta), color-stop(92%, #ff0080), to(red));
+  background: linear-gradient(to top, red 0%, #ff8000 8%, yellow 17%, #80ff00 25%, lime 33%, #00ff80 42%, cyan 50%, #0080ff 58%, blue 67%, #8000ff 75%, magenta 83%, #ff0080 92%, red 100%);
+  /* W3C */ }
+
+.colorpicker-alpha {
+  background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), white;
+  background-size: 10px 10px;
+  background-position: 0 0, 5px 5px;
+  display: none; }
+
+.colorpicker-bar {
+  min-height: 16px;
+  margin: 6px 0 0 0;
+  clear: both;
+  text-align: center;
+  font-size: 10px;
+  line-height: normal;
+  max-width: 100%;
+  -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
+          box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); }
+  .colorpicker-bar:before {
+    content: "";
+    display: table;
+    clear: both; }
+
+.colorpicker-bar.colorpicker-bar-horizontal {
+  height: 126px;
+  width: 16px;
+  margin: 0 0 6px 0;
+  float: left; }
+
+.colorpicker-input-addon {
+  position: relative; }
+
+.colorpicker-input-addon i {
+  display: inline-block;
+  cursor: pointer;
+  vertical-align: text-top;
+  height: 16px;
+  width: 16px;
+  position: relative; }
+
+.colorpicker-input-addon:before {
+  content: "";
+  position: absolute;
+  width: 16px;
+  height: 16px;
+  display: inline-block;
+  vertical-align: text-top;
+  background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), white;
+  background-size: 10px 10px;
+  background-position: 0 0, 5px 5px; }
+
+.colorpicker.colorpicker-inline {
+  position: relative;
+  display: inline-block;
+  float: none;
+  z-index: auto;
+  vertical-align: text-bottom; }
+
+.colorpicker.colorpicker-horizontal {
+  width: 126px;
+  height: auto; }
+
+.colorpicker.colorpicker-horizontal .colorpicker-bar {
+  width: 126px; }
+
+.colorpicker.colorpicker-horizontal .colorpicker-saturation {
+  float: none;
+  margin-bottom: 0; }
+
+.colorpicker.colorpicker-horizontal .colorpicker-hue,
+.colorpicker.colorpicker-horizontal .colorpicker-alpha {
+  float: none;
+  width: 126px;
+  height: 16px;
+  cursor: col-resize;
+  margin-left: 0;
+  margin-top: 6px;
+  margin-bottom: 0; }
+
+.colorpicker.colorpicker-horizontal .colorpicker-hue .colorpicker-guide,
+.colorpicker.colorpicker-horizontal .colorpicker-alpha .colorpicker-guide {
+  position: absolute;
+  display: block;
+  bottom: -2px;
+  left: 0;
+  right: auto;
+  height: auto;
+  width: 4px; }
+
+.colorpicker.colorpicker-horizontal .colorpicker-hue {
+  /* FF3.6+ */
+  /* Chrome,Safari4+ */
+  /* Chrome10+,Safari5.1+ */
+  /* Opera 11.10+ */
+  /* IE10+ */
+  background: -webkit-gradient(linear, right top, left top, from(red), color-stop(8%, #ff8000), color-stop(17%, yellow), color-stop(25%, #80ff00), color-stop(33%, lime), color-stop(42%, #00ff80), color-stop(50%, cyan), color-stop(58%, #0080ff), color-stop(67%, blue), color-stop(75%, #8000ff), color-stop(83%, magenta), color-stop(92%, #ff0080), to(red));
+  background: linear-gradient(to left, red 0%, #ff8000 8%, yellow 17%, #80ff00 25%, lime 33%, #00ff80 42%, cyan 50%, #0080ff 58%, blue 67%, #8000ff 75%, magenta 83%, #ff0080 92%, red 100%);
+  /* W3C */ }
+
+.colorpicker.colorpicker-horizontal .colorpicker-alpha {
+  background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), white;
+  background-size: 10px 10px;
+  background-position: 0 0, 5px 5px; }
+
+.colorpicker-inline:before,
+.colorpicker-no-arrow:before,
+.colorpicker-popup.colorpicker-bs-popover-content:before {
+  content: none;
+  display: none; }
+
+.colorpicker-inline:after,
+.colorpicker-no-arrow:after,
+.colorpicker-popup.colorpicker-bs-popover-content:after {
+  content: none;
+  display: none; }
+
+.colorpicker-alpha,
+.colorpicker-saturation,
+.colorpicker-hue {
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none; }
+
+.colorpicker.colorpicker-visible,
+.colorpicker-alpha.colorpicker-visible,
+.colorpicker-saturation.colorpicker-visible,
+.colorpicker-hue.colorpicker-visible,
+.colorpicker-bar.colorpicker-visible {
+  display: block; }
+
+.colorpicker.colorpicker-hidden,
+.colorpicker-alpha.colorpicker-hidden,
+.colorpicker-saturation.colorpicker-hidden,
+.colorpicker-hue.colorpicker-hidden,
+.colorpicker-bar.colorpicker-hidden {
+  display: none; }
+
+.colorpicker-inline.colorpicker-visible {
+  display: inline-block; }
+
+.colorpicker.colorpicker-disabled:after {
+  border: none;
+  content: '';
+  display: block;
+  width: 100%;
+  height: 100%;
+  background: rgba(233, 236, 239, 0.33);
+  top: 0;
+  left: 0;
+  right: auto;
+  z-index: 2;
+  position: absolute; }
+
+.colorpicker.colorpicker-disabled .colorpicker-guide {
+  display: none; }
+
+/** EXTENSIONS **/
+.colorpicker-preview {
+  background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), white;
+  background-size: 10px 10px;
+  background-position: 0 0, 5px 5px; }
+
+.colorpicker-preview > div {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%; }
+
+.colorpicker-bar.colorpicker-swatches {
+  -webkit-box-shadow: none;
+          box-shadow: none;
+  height: auto; }
+
+.colorpicker-swatches--inner {
+  clear: both;
+  margin-top: -6px; }
+
+.colorpicker-swatch {
+  position: relative;
+  cursor: pointer;
+  float: left;
+  height: 16px;
+  width: 16px;
+  margin-right: 6px;
+  margin-top: 6px;
+  margin-left: 0;
+  display: block;
+  -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
+          box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
+  background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0), white;
+  background-size: 10px 10px;
+  background-position: 0 0, 5px 5px; }
+
+.colorpicker-swatch--inner {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%; }
+
+.colorpicker-swatch:nth-of-type(7n+0) {
+  margin-right: 0; }
+
+.colorpicker-with-alpha .colorpicker-swatch:nth-of-type(7n+0) {
+  margin-right: 6px; }
+
+.colorpicker-with-alpha .colorpicker-swatch:nth-of-type(8n+0) {
+  margin-right: 0; }
+
+.colorpicker-horizontal .colorpicker-swatch:nth-of-type(6n+0) {
+  margin-right: 0; }
+
+.colorpicker-horizontal .colorpicker-swatch:nth-of-type(7n+0) {
+  margin-right: 6px; }
+
+.colorpicker-horizontal .colorpicker-swatch:nth-of-type(8n+0) {
+  margin-right: 6px; }
+
+.colorpicker-swatch:last-of-type:after {
+  content: "";
+  display: table;
+  clear: both; }
+
+*[dir='rtl'] .colorpicker-element input,
+.colorpicker-element[dir='rtl'] input,
+.colorpicker-element input[dir='rtl'] {
+  direction: ltr;
+  text-align: right; }
+
+/*# sourceMappingURL=bootstrap-colorpicker.css.map */

plugins/bootstrap-slider/css/bootstrap-slider.css

@@ -0,0 +1,328 @@
+/*! =======================================================
+                      VERSION  10.6.1              
+========================================================= */
+/*! =========================================================
+ * bootstrap-slider.js
+ *
+ * Maintainers:
+ *		Kyle Kemp
+ *			- Twitter: @seiyria
+ *			- Github:  seiyria
+ *		Rohit Kalkur
+ *			- Twitter: @Rovolutionary
+ *			- Github:  rovolution
+ *
+ * =========================================================
+  *
+ * bootstrap-slider is released under the MIT License
+ * Copyright (c) 2019 Kyle Kemp, Rohit Kalkur, and contributors
+ * 
+ * Permission is hereby granted, free of charge, to any person
+ * obtaining a copy of this software and associated documentation
+ * files (the "Software"), to deal in the Software without
+ * restriction, including without limitation the rights to use,
+ * copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the
+ * Software is furnished to do so, subject to the following
+ * conditions:
+ * 
+ * The above copyright notice and this permission notice shall be
+ * included in all copies or substantial portions of the Software.
+ * 
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+ * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+ * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+ * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+ * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+ * OTHER DEALINGS IN THE SOFTWARE.
+ *
+ * ========================================================= */
+.slider {
+  display: inline-block;
+  vertical-align: middle;
+  position: relative;
+}
+.slider.slider-horizontal {
+  width: 210px;
+  height: 20px;
+}
+.slider.slider-horizontal .slider-track {
+  height: 10px;
+  width: 100%;
+  margin-top: -5px;
+  top: 50%;
+  left: 0;
+}
+.slider.slider-horizontal .slider-selection,
+.slider.slider-horizontal .slider-track-low,
+.slider.slider-horizontal .slider-track-high {
+  height: 100%;
+  top: 0;
+  bottom: 0;
+}
+.slider.slider-horizontal .slider-tick,
+.slider.slider-horizontal .slider-handle {
+  margin-left: -10px;
+}
+.slider.slider-horizontal .slider-tick.triangle,
+.slider.slider-horizontal .slider-handle.triangle {
+  position: relative;
+  top: 50%;
+  -ms-transform: translateY(-50%);
+  transform: translateY(-50%);
+  border-width: 0 10px 10px 10px;
+  width: 0;
+  height: 0;
+  border-bottom-color: #2e6da4;
+  margin-top: 0;
+}
+.slider.slider-horizontal .slider-tick-container {
+  white-space: nowrap;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+}
+.slider.slider-horizontal .slider-tick-label-container {
+  white-space: nowrap;
+  margin-top: 20px;
+}
+.slider.slider-horizontal .slider-tick-label-container .slider-tick-label {
+  padding-top: 4px;
+  display: inline-block;
+  text-align: center;
+}
+.slider.slider-horizontal .tooltip {
+  -ms-transform: translateX(-50%);
+  transform: translateX(-50%);
+}
+.slider.slider-horizontal.slider-rtl .slider-track {
+  left: initial;
+  right: 0;
+}
+.slider.slider-horizontal.slider-rtl .slider-tick,
+.slider.slider-horizontal.slider-rtl .slider-handle {
+  margin-left: initial;
+  margin-right: -10px;
+}
+.slider.slider-horizontal.slider-rtl .slider-tick-container {
+  left: initial;
+  right: 0;
+}
+.slider.slider-horizontal.slider-rtl .tooltip {
+  -ms-transform: translateX(50%);
+  transform: translateX(50%);
+}
+.slider.slider-vertical {
+  height: 210px;
+  width: 20px;
+}
+.slider.slider-vertical .slider-track {
+  width: 10px;
+  height: 100%;
+  left: 25%;
+  top: 0;
+}
+.slider.slider-vertical .slider-selection {
+  width: 100%;
+  left: 0;
+  top: 0;
+  bottom: 0;
+}
+.slider.slider-vertical .slider-track-low,
+.slider.slider-vertical .slider-track-high {
+  width: 100%;
+  left: 0;
+  right: 0;
+}
+.slider.slider-vertical .slider-tick,
+.slider.slider-vertical .slider-handle {
+  margin-top: -10px;
+}
+.slider.slider-vertical .slider-tick.triangle,
+.slider.slider-vertical .slider-handle.triangle {
+  border-width: 10px 0 10px 10px;
+  width: 1px;
+  height: 1px;
+  border-left-color: #2e6da4;
+  border-right-color: #2e6da4;
+  margin-left: 0;
+  margin-right: 0;
+}
+.slider.slider-vertical .slider-tick-label-container {
+  white-space: nowrap;
+}
+.slider.slider-vertical .slider-tick-label-container .slider-tick-label {
+  padding-left: 4px;
+}
+.slider.slider-vertical .tooltip {
+  -ms-transform: translateY(-50%);
+  transform: translateY(-50%);
+}
+.slider.slider-vertical.slider-rtl .slider-track {
+  left: initial;
+  right: 25%;
+}
+.slider.slider-vertical.slider-rtl .slider-selection {
+  left: initial;
+  right: 0;
+}
+.slider.slider-vertical.slider-rtl .slider-tick.triangle,
+.slider.slider-vertical.slider-rtl .slider-handle.triangle {
+  border-width: 10px 10px 10px 0;
+}
+.slider.slider-vertical.slider-rtl .slider-tick-label-container .slider-tick-label {
+  padding-left: initial;
+  padding-right: 4px;
+}
+.slider.slider-disabled .slider-handle {
+  background-image: -webkit-linear-gradient(top, #dfdfdf 0%, #bebebe 100%);
+  background-image: -o-linear-gradient(top, #dfdfdf 0%, #bebebe 100%);
+  background-image: linear-gradient(to bottom, #dfdfdf 0%, #bebebe 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdfdfdf', endColorstr='#ffbebebe', GradientType=0);
+}
+.slider.slider-disabled .slider-track {
+  background-image: -webkit-linear-gradient(top, #e5e5e5 0%, #e9e9e9 100%);
+  background-image: -o-linear-gradient(top, #e5e5e5 0%, #e9e9e9 100%);
+  background-image: linear-gradient(to bottom, #e5e5e5 0%, #e9e9e9 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe5e5e5', endColorstr='#ffe9e9e9', GradientType=0);
+  cursor: not-allowed;
+}
+.slider input {
+  display: none;
+}
+.slider .tooltip {
+  pointer-events: none;
+}
+.slider .tooltip.top {
+  margin-top: -36px;
+}
+.slider .tooltip-inner {
+  white-space: nowrap;
+  max-width: none;
+}
+.slider .hide {
+  display: none;
+}
+.slider-track {
+  position: absolute;
+  cursor: pointer;
+  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #f9f9f9 100%);
+  background-image: -o-linear-gradient(top, #f5f5f5 0%, #f9f9f9 100%);
+  background-image: linear-gradient(to bottom, #f5f5f5 0%, #f9f9f9 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#fff9f9f9', GradientType=0);
+  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+  border-radius: 4px;
+}
+.slider-selection {
+  position: absolute;
+  background-image: -webkit-linear-gradient(top, #f9f9f9 0%, #f5f5f5 100%);
+  background-image: -o-linear-gradient(top, #f9f9f9 0%, #f5f5f5 100%);
+  background-image: linear-gradient(to bottom, #f9f9f9 0%, #f5f5f5 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff9f9f9', endColorstr='#fff5f5f5', GradientType=0);
+  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  border-radius: 4px;
+}
+.slider-selection.tick-slider-selection {
+  background-image: -webkit-linear-gradient(top, #8ac1ef 0%, #82b3de 100%);
+  background-image: -o-linear-gradient(top, #8ac1ef 0%, #82b3de 100%);
+  background-image: linear-gradient(to bottom, #8ac1ef 0%, #82b3de 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8ac1ef', endColorstr='#ff82b3de', GradientType=0);
+}
+.slider-track-low,
+.slider-track-high {
+  position: absolute;
+  background: transparent;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  border-radius: 4px;
+}
+.slider-handle {
+  position: absolute;
+  top: 0;
+  width: 20px;
+  height: 20px;
+  background-color: #337ab7;
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+  background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+  background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
+  filter: none;
+  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
+  box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
+  border: 0px solid transparent;
+}
+.slider-handle:hover {
+  cursor: pointer;
+}
+.slider-handle.round {
+  border-radius: 50%;
+}
+.slider-handle.triangle {
+  background: transparent none;
+}
+.slider-handle.custom {
+  background: transparent none;
+}
+.slider-handle.custom::before {
+  line-height: 20px;
+  font-size: 20px;
+  content: '\2605';
+  color: #726204;
+}
+.slider-tick {
+  position: absolute;
+  cursor: pointer;
+  width: 20px;
+  height: 20px;
+  background-image: -webkit-linear-gradient(top, #f9f9f9 0%, #f5f5f5 100%);
+  background-image: -o-linear-gradient(top, #f9f9f9 0%, #f5f5f5 100%);
+  background-image: linear-gradient(to bottom, #f9f9f9 0%, #f5f5f5 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff9f9f9', endColorstr='#fff5f5f5', GradientType=0);
+  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  filter: none;
+  opacity: 0.8;
+  border: 0px solid transparent;
+}
+.slider-tick.round {
+  border-radius: 50%;
+}
+.slider-tick.triangle {
+  background: transparent none;
+}
+.slider-tick.custom {
+  background: transparent none;
+}
+.slider-tick.custom::before {
+  line-height: 20px;
+  font-size: 20px;
+  content: '\2605';
+  color: #726204;
+}
+.slider-tick.in-selection {
+  background-image: -webkit-linear-gradient(top, #8ac1ef 0%, #82b3de 100%);
+  background-image: -o-linear-gradient(top, #8ac1ef 0%, #82b3de 100%);
+  background-image: linear-gradient(to bottom, #8ac1ef 0%, #82b3de 100%);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8ac1ef', endColorstr='#ff82b3de', GradientType=0);
+  opacity: 1;
+}

plugins/bootstrap-slider/slider.css

@@ -1,169 +0,0 @@
-/*!
- * Slider for Bootstrap
- *
- * Copyright 2012 Stefan Petre
- * Licensed under the Apache License v2.0
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- */
-.slider {
-    display: block;
-    vertical-align: middle;
-    position: relative;
-
-}
-.slider.slider-horizontal {
-    width: 100%;
-    height: 20px;
-    margin-bottom: 20px;
-}
-.slider.slider-horizontal:last-of-type {
-    margin-bottom: 0;
-}
-.slider.slider-horizontal .slider-track {
-    height: 10px;
-    width: 100%;
-    margin-top: -5px;
-    top: 50%;
-    left: 0;
-}
-.slider.slider-horizontal .slider-selection {
-    height: 100%;
-    top: 0;
-    bottom: 0;
-}
-.slider.slider-horizontal .slider-handle {
-    margin-left: -10px;
-    margin-top: -5px;
-}
-.slider.slider-horizontal .slider-handle.triangle {
-    border-width: 0 10px 10px 10px;
-    width: 0;
-    height: 0;
-    border-bottom-color: #0480be;
-    margin-top: 0;
-}
-.slider.slider-vertical {
-    height: 230px;
-    width: 20px;
-    margin-right: 20px;
-    display: inline-block;
-}
-.slider.slider-vertical:last-of-type {
-    margin-right: 0;
-}
-.slider.slider-vertical .slider-track {
-    width: 10px;
-    height: 100%;
-    margin-left: -5px;
-    left: 50%;
-    top: 0;
-}
-.slider.slider-vertical .slider-selection {
-    width: 100%;
-    left: 0;
-    top: 0;
-    bottom: 0;
-}
-.slider.slider-vertical .slider-handle {
-    margin-left: -5px;
-    margin-top: -10px;
-}
-.slider.slider-vertical .slider-handle.triangle {
-    border-width: 10px 0 10px 10px;
-    width: 1px;
-    height: 1px;
-    border-left-color: #0480be;
-    margin-left: 0;
-}
-.slider input {
-    display: none;
-}
-.slider .tooltip-inner {
-    white-space: nowrap;
-}
-.slider-track {
-    position: absolute;
-    cursor: pointer;
-    background-color: #f7f7f7;
-    background-image: -moz-linear-gradient(top, #f0f0f0, #f9f9f9);
-    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f0f0f0), to(#f9f9f9));
-    background-image: -webkit-linear-gradient(top, #f0f0f0, #f9f9f9);
-    background-image: -o-linear-gradient(top, #f0f0f0, #f9f9f9);
-    background-image: linear-gradient(to bottom, #f0f0f0, #f9f9f9);
-    background-repeat: repeat-x;
-    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0f0f0', endColorstr='#fff9f9f9', GradientType=0);
-    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-    -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-    -webkit-border-radius: 4px;
-    -moz-border-radius: 4px;
-    border-radius: 4px;
-}
-.slider-selection {
-    position: absolute;
-    background-color: #f7f7f7;
-    background-image: -moz-linear-gradient(top, #f9f9f9, #f5f5f5);
-    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f9f9f9), to(#f5f5f5));
-    background-image: -webkit-linear-gradient(top, #f9f9f9, #f5f5f5);
-    background-image: -o-linear-gradient(top, #f9f9f9, #f5f5f5);
-    background-image: linear-gradient(to bottom, #f9f9f9, #f5f5f5);
-    background-repeat: repeat-x;
-    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff9f9f9', endColorstr='#fff5f5f5', GradientType=0);
-    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-    -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box;
-    -webkit-border-radius: 4px;
-    -moz-border-radius: 4px;
-    border-radius: 4px;
-}
-.slider-handle {
-    position: absolute;
-    width: 20px;
-    height: 20px;
-    background-color: #444;
-    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
-    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
-    box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
-    opacity: 1;
-    border: 0px solid transparent;
-}
-.slider-handle.round {
-    -webkit-border-radius: 20px;
-    -moz-border-radius: 20px;
-    border-radius: 20px;
-}
-.slider-handle.triangle {
-    background: transparent none;
-}
-
-.slider-disabled .slider-selection {
-    opacity: 0.5;
-}
-
-#red .slider-selection {
-    background: #f56954;
-}
-
-#blue .slider-selection {
-    background: #3c8dbc;
-}
-
-#green .slider-selection {
-    background: #00a65a;
-}
-
-#yellow .slider-selection {
-    background: #f39c12;
-}
-
-#aqua .slider-selection {
-    background: #00c0ef;
-}
-
-#purple .slider-selection {
-    background: #932ab6;
-}

plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.css

@@ -1,117 +0,0 @@
-ul.wysihtml5-toolbar {
-	margin: 0;
-	padding: 0;
-	display: block;
-}
-
-ul.wysihtml5-toolbar::after {
-	clear: both;
-	display: table;
-	content: "";
-}
-
-ul.wysihtml5-toolbar > li {
-	float: left;
-	display: list-item;
-	list-style: none;
-	margin: 0 5px 10px 0;
-}
-
-ul.wysihtml5-toolbar a[data-wysihtml5-command=bold] {
-	font-weight: bold;
-}
-
-ul.wysihtml5-toolbar a[data-wysihtml5-command=italic] {
-	font-style: italic;
-}
-
-ul.wysihtml5-toolbar a[data-wysihtml5-command=underline] {
-	text-decoration: underline;
-}
-
-ul.wysihtml5-toolbar a.btn.wysihtml5-command-active {
-	background-image: none;
-	-webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);
-	-moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);
-	box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);
-	background-color: #E6E6E6;
-	background-color: #D9D9D9;
-	outline: 0;
-}
-
-ul.wysihtml5-commands-disabled .dropdown-menu {
-	display: none !important;
-}
-
-ul.wysihtml5-toolbar div.wysihtml5-colors {
-  display:block;
-  width: 50px;
-  height: 20px;
-  margin-top: 2px;
-  margin-left: 5px;
-  position: absolute;
-  pointer-events: none;
-}
-
-ul.wysihtml5-toolbar a.wysihtml5-colors-title {
-  padding-left: 70px;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="black"] {
-  background: black !important;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="silver"] {
-  background: silver !important;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="gray"] {
-  background: gray !important;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="maroon"] {
-  background: maroon !important;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="red"] {
-  background: red !important;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="purple"] {
-  background: purple !important;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="green"] {
-  background: green !important;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="olive"] {
-  background: olive !important;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="navy"] {
-  background: navy !important;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="blue"] {
-  background: blue !important;
-}
-
-ul.wysihtml5-toolbar div[data-wysihtml5-command-value="orange"] {
-  background: orange !important;
-}
-
-.glyphicon-quote:before {
-  content: "\201C";
-  font-family: Georgia, serif;
-  font-size: 50px;
-  position: absolute;
-  top: -4px;
-  left: -3px;
-  max-height: 100%;
-}
-
-.glyphicon-quote:after {
-  content: "\0000a0";
-}
-

plugins/bootstrap/css/bootstrap-reboot.css

@@ -1,331 +0,0 @@
-/*!
- * Bootstrap Reboot v4.3.1 (https://getbootstrap.com/)
- * Copyright 2011-2019 The Bootstrap Authors
- * Copyright 2011-2019 Twitter, Inc.
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
- */
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-}
-
-html {
-  font-family: sans-serif;
-  line-height: 1.15;
-  -webkit-text-size-adjust: 100%;
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-}
-
-article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
-  display: block;
-}
-
-body {
-  margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-  font-size: 1rem;
-  font-weight: 400;
-  line-height: 1.5;
-  color: #212529;
-  text-align: left;
-  background-color: #fff;
-}
-
-[tabindex="-1"]:focus {
-  outline: 0 !important;
-}
-
-hr {
-  box-sizing: content-box;
-  height: 0;
-  overflow: visible;
-}
-
-h1, h2, h3, h4, h5, h6 {
-  margin-top: 0;
-  margin-bottom: 0.5rem;
-}
-
-p {
-  margin-top: 0;
-  margin-bottom: 1rem;
-}
-
-abbr[title],
-abbr[data-original-title] {
-  text-decoration: underline;
-  -webkit-text-decoration: underline dotted;
-  text-decoration: underline dotted;
-  cursor: help;
-  border-bottom: 0;
-  -webkit-text-decoration-skip-ink: none;
-  text-decoration-skip-ink: none;
-}
-
-address {
-  margin-bottom: 1rem;
-  font-style: normal;
-  line-height: inherit;
-}
-
-ol,
-ul,
-dl {
-  margin-top: 0;
-  margin-bottom: 1rem;
-}
-
-ol ol,
-ul ul,
-ol ul,
-ul ol {
-  margin-bottom: 0;
-}
-
-dt {
-  font-weight: 700;
-}
-
-dd {
-  margin-bottom: .5rem;
-  margin-left: 0;
-}
-
-blockquote {
-  margin: 0 0 1rem;
-}
-
-b,
-strong {
-  font-weight: bolder;
-}
-
-small {
-  font-size: 80%;
-}
-
-sub,
-sup {
-  position: relative;
-  font-size: 75%;
-  line-height: 0;
-  vertical-align: baseline;
-}
-
-sub {
-  bottom: -.25em;
-}
-
-sup {
-  top: -.5em;
-}
-
-a {
-  color: #007bff;
-  text-decoration: none;
-  background-color: transparent;
-}
-
-a:hover {
-  color: #0056b3;
-  text-decoration: underline;
-}
-
-a:not([href]):not([tabindex]) {
-  color: inherit;
-  text-decoration: none;
-}
-
-a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus {
-  color: inherit;
-  text-decoration: none;
-}
-
-a:not([href]):not([tabindex]):focus {
-  outline: 0;
-}
-
-pre,
-code,
-kbd,
-samp {
-  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-  font-size: 1em;
-}
-
-pre {
-  margin-top: 0;
-  margin-bottom: 1rem;
-  overflow: auto;
-}
-
-figure {
-  margin: 0 0 1rem;
-}
-
-img {
-  vertical-align: middle;
-  border-style: none;
-}
-
-svg {
-  overflow: hidden;
-  vertical-align: middle;
-}
-
-table {
-  border-collapse: collapse;
-}
-
-caption {
-  padding-top: 0.75rem;
-  padding-bottom: 0.75rem;
-  color: #6c757d;
-  text-align: left;
-  caption-side: bottom;
-}
-
-th {
-  text-align: inherit;
-}
-
-label {
-  display: inline-block;
-  margin-bottom: 0.5rem;
-}
-
-button {
-  border-radius: 0;
-}
-
-button:focus {
-  outline: 1px dotted;
-  outline: 5px auto -webkit-focus-ring-color;
-}
-
-input,
-button,
-select,
-optgroup,
-textarea {
-  margin: 0;
-  font-family: inherit;
-  font-size: inherit;
-  line-height: inherit;
-}
-
-button,
-input {
-  overflow: visible;
-}
-
-button,
-select {
-  text-transform: none;
-}
-
-select {
-  word-wrap: normal;
-}
-
-button,
-[type="button"],
-[type="reset"],
-[type="submit"] {
-  -webkit-appearance: button;
-}
-
-button:not(:disabled),
-[type="button"]:not(:disabled),
-[type="reset"]:not(:disabled),
-[type="submit"]:not(:disabled) {
-  cursor: pointer;
-}
-
-button::-moz-focus-inner,
-[type="button"]::-moz-focus-inner,
-[type="reset"]::-moz-focus-inner,
-[type="submit"]::-moz-focus-inner {
-  padding: 0;
-  border-style: none;
-}
-
-input[type="radio"],
-input[type="checkbox"] {
-  box-sizing: border-box;
-  padding: 0;
-}
-
-input[type="date"],
-input[type="time"],
-input[type="datetime-local"],
-input[type="month"] {
-  -webkit-appearance: listbox;
-}
-
-textarea {
-  overflow: auto;
-  resize: vertical;
-}
-
-fieldset {
-  min-width: 0;
-  padding: 0;
-  margin: 0;
-  border: 0;
-}
-
-legend {
-  display: block;
-  width: 100%;
-  max-width: 100%;
-  padding: 0;
-  margin-bottom: .5rem;
-  font-size: 1.5rem;
-  line-height: inherit;
-  color: inherit;
-  white-space: normal;
-}
-
-progress {
-  vertical-align: baseline;
-}
-
-[type="number"]::-webkit-inner-spin-button,
-[type="number"]::-webkit-outer-spin-button {
-  height: auto;
-}
-
-[type="search"] {
-  outline-offset: -2px;
-  -webkit-appearance: none;
-}
-
-[type="search"]::-webkit-search-decoration {
-  -webkit-appearance: none;
-}
-
-::-webkit-file-upload-button {
-  font: inherit;
-  -webkit-appearance: button;
-}
-
-output {
-  display: inline-block;
-}
-
-summary {
-  display: list-item;
-  cursor: pointer;
-}
-
-template {
-  display: none;
-}
-
-[hidden] {
-  display: none !important;
-}
-/*# sourceMappingURL=bootstrap-reboot.css.map */

plugins/colorpicker/bootstrap-colorpicker.css

@@ -1,214 +0,0 @@
-/*!
- * Bootstrap Colorpicker
- * http://mjolnic.github.io/bootstrap-colorpicker/
- *
- * Originally written by (c) 2012 Stefan Petre
- * Licensed under the Apache License v2.0
- * http://www.apache.org/licenses/LICENSE-2.0.txt
- *
- */
-
-.colorpicker-saturation {
-  float: left;
-  width: 100px;
-  height: 100px;
-  cursor: crosshair;
-  background-image: url("img/saturation.png");
-}
-
-.colorpicker-saturation i {
-  position: absolute;
-  top: 0;
-  left: 0;
-  display: block;
-  width: 5px;
-  height: 5px;
-  margin: -4px 0 0 -4px;
-  border: 1px solid #000;
-  -webkit-border-radius: 5px;
-     -moz-border-radius: 5px;
-          border-radius: 5px;
-}
-
-.colorpicker-saturation i b {
-  display: block;
-  width: 5px;
-  height: 5px;
-  border: 1px solid #fff;
-  -webkit-border-radius: 5px;
-     -moz-border-radius: 5px;
-          border-radius: 5px;
-}
-
-.colorpicker-hue,
-.colorpicker-alpha {
-  float: left;
-  width: 15px;
-  height: 100px;
-  margin-bottom: 4px;
-  margin-left: 4px;
-  cursor: row-resize;
-}
-
-.colorpicker-hue i,
-.colorpicker-alpha i {
-  position: absolute;
-  top: 0;
-  left: 0;
-  display: block;
-  width: 100%;
-  height: 1px;
-  margin-top: -1px;
-  background: #000;
-  border-top: 1px solid #fff;
-}
-
-.colorpicker-hue {
-  background-image: url("img/hue.png");
-}
-
-.colorpicker-alpha {
-  display: none;
-  background-image: url("img/alpha.png");
-}
-
-.colorpicker {
-  top: 0;
-  left: 0;
-  z-index: 2500;
-  min-width: 130px;
-  padding: 4px;
-  margin-top: 1px;
-  -webkit-border-radius: 4px;
-     -moz-border-radius: 4px;
-          border-radius: 4px;
-  *zoom: 1;
-}
-
-.colorpicker:before,
-.colorpicker:after {
-  display: table;
-  line-height: 0;
-  content: "";
-}
-
-.colorpicker:after {
-  clear: both;
-}
-
-.colorpicker:before {
-  position: absolute;
-  top: -7px;
-  left: 6px;
-  display: inline-block;
-  border-right: 7px solid transparent;
-  border-bottom: 7px solid #ccc;
-  border-left: 7px solid transparent;
-  border-bottom-color: rgba(0, 0, 0, 0.2);
-  content: '';
-}
-
-.colorpicker:after {
-  position: absolute;
-  top: -6px;
-  left: 7px;
-  display: inline-block;
-  border-right: 6px solid transparent;
-  border-bottom: 6px solid #ffffff;
-  border-left: 6px solid transparent;
-  content: '';
-}
-
-.colorpicker div {
-  position: relative;
-}
-
-.colorpicker.colorpicker-with-alpha {
-  min-width: 140px;
-}
-
-.colorpicker.colorpicker-with-alpha .colorpicker-alpha {
-  display: block;
-}
-
-.colorpicker-color {
-  height: 10px;
-  margin-top: 5px;
-  clear: both;
-  background-image: url("img/alpha.png");
-  background-position: 0 100%;
-}
-
-.colorpicker-color div {
-  height: 10px;
-}
-
-.colorpicker-element .input-group-addon i {
-  display: block;
-  width: 16px;
-  height: 16px;
-  cursor: pointer;
-}
-
-.colorpicker.colorpicker-inline {
-  position: relative;
-  display: inline-block;
-  float: none;
-}
-
-.colorpicker.colorpicker-horizontal {
-  width: 110px;
-  height: auto;
-  min-width: 110px;
-}
-
-.colorpicker.colorpicker-horizontal .colorpicker-saturation {
-  margin-bottom: 4px;
-}
-
-.colorpicker.colorpicker-horizontal .colorpicker-color {
-  width: 100px;
-}
-
-.colorpicker.colorpicker-horizontal .colorpicker-hue,
-.colorpicker.colorpicker-horizontal .colorpicker-alpha {
-  float: left;
-  width: 100px;
-  height: 15px;
-  margin-bottom: 4px;
-  margin-left: 0;
-  cursor: col-resize;
-}
-
-.colorpicker.colorpicker-horizontal .colorpicker-hue i,
-.colorpicker.colorpicker-horizontal .colorpicker-alpha i {
-  position: absolute;
-  top: 0;
-  left: 0;
-  display: block;
-  width: 1px;
-  height: 15px;
-  margin-top: 0;
-  background: #ffffff;
-  border: none;
-}
-
-.colorpicker.colorpicker-horizontal .colorpicker-hue {
-  background-image: url("img/hue-horizontal.png");
-}
-
-.colorpicker.colorpicker-horizontal .colorpicker-alpha {
-  background-image: url("img/alpha-horizontal.png");
-}
-
-.colorpicker.colorpicker-hidden {
-  display: none;
-}
-
-.colorpicker.colorpicker-visible {
-  display: block;
-}
-
-.colorpicker-inline.colorpicker-visible {
-  display: inline-block;
-}

plugins/colorpicker/bootstrap-colorpicker.js

@@ -1,949 +0,0 @@
-/*!
- * Bootstrap Colorpicker
- * http://mjolnic.github.io/bootstrap-colorpicker/
- *
- * Originally written by (c) 2012 Stefan Petre
- * Licensed under the Apache License v2.0
- * http://www.apache.org/licenses/LICENSE-2.0.txt
- *
- * @todo Update DOCS
- */
-(function($) {
-    'use strict';
-
-    // Color object
-    var Color = function(val) {
-        this.value = {
-            h: 0,
-            s: 0,
-            b: 0,
-            a: 1
-        };
-        this.origFormat = null; // original string format
-        if (val) {
-            if (val.toLowerCase !== undefined) {
-                this.setColor(val);
-            } else if (val.h !== undefined) {
-                this.value = val;
-            }
-        }
-    };
-
-    Color.prototype = {
-        constructor: Color,
-        _sanitizeNumber: function(val) {
-            if (typeof val === 'number') {
-                return val;
-            }
-            if (isNaN(val) || (val === null) || (val === '') || (val === undefined)) {
-                return 1;
-            }
-            if (val.toLowerCase !== undefined) {
-                return parseFloat(val);
-            }
-            return 1;
-        },
-        //parse a string to HSB
-        setColor: function(strVal) {
-            strVal = strVal.toLowerCase();
-            this.value = this.stringToHSB(strVal) ||  {
-                h: 0,
-                s: 0,
-                b: 0,
-                a: 1
-            };
-        },
-        stringToHSB: function(strVal) {
-            strVal = strVal.toLowerCase();
-            var that = this,
-                result = false;
-            $.each(this.stringParsers, function(i, parser) {
-                var match = parser.re.exec(strVal),
-                    values = match && parser.parse.apply(that, [match]),
-                    format = parser.format || 'rgba';
-                if (values) {
-                    if (format.match(/hsla?/)) {
-                        result = that.RGBtoHSB.apply(that, that.HSLtoRGB.apply(that, values));
-                    } else {
-                        result = that.RGBtoHSB.apply(that, values);
-                    }
-                    that.origFormat = format;
-                    return false;
-                }
-                return true;
-            });
-            return result;
-        },
-        setHue: function(h) {
-            this.value.h = 1 - h;
-        },
-        setSaturation: function(s) {
-            this.value.s = s;
-        },
-        setBrightness: function(b) {
-            this.value.b = 1 - b;
-        },
-        setAlpha: function(a) {
-            this.value.a = parseInt((1 - a) * 100, 10) / 100;
-        },
-        toRGB: function(h, s, v, a) {
-            h = h || this.value.h;
-            s = s || this.value.s;
-            v = v || this.value.b;
-            a = a || this.value.a;
-
-            var r, g, b, i, f, p, q, t;
-            if (h && s === undefined && v === undefined) {
-                s = h.s, v = h.v, h = h.h;
-            }
-            i = Math.floor(h * 6);
-            f = h * 6 - i;
-            p = v * (1 - s);
-            q = v * (1 - f * s);
-            t = v * (1 - (1 - f) * s);
-            switch (i % 6) {
-                case 0:
-                    r = v, g = t, b = p;
-                    break;
-                case 1:
-                    r = q, g = v, b = p;
-                    break;
-                case 2:
-                    r = p, g = v, b = t;
-                    break;
-                case 3:
-                    r = p, g = q, b = v;
-                    break;
-                case 4:
-                    r = t, g = p, b = v;
-                    break;
-                case 5:
-                    r = v, g = p, b = q;
-                    break;
-            }
-            return {
-                r: Math.floor(r * 255),
-                g: Math.floor(g * 255),
-                b: Math.floor(b * 255),
-                a: a
-            };
-        },
-        toHex: function(h, s, b, a) {
-            var rgb = this.toRGB(h, s, b, a);
-            return '#' + ((1 << 24) | (parseInt(rgb.r) << 16) | (parseInt(rgb.g) << 8) | parseInt(rgb.b)).toString(16).substr(1);
-        },
-        toHSL: function(h, s, b, a) {
-            h = h || this.value.h;
-            s = s || this.value.s;
-            b = b || this.value.b;
-            a = a || this.value.a;
-
-            var H = h,
-                L = (2 - s) * b,
-                S = s * b;
-            if (L > 0 && L <= 1) {
-                S /= L;
-            } else {
-                S /= 2 - L;
-            }
-            L /= 2;
-            if (S > 1) {
-                S = 1;
-            }
-            return {
-                h: H,
-                s: S,
-                l: L,
-                a: a
-            };
-        },
-        RGBtoHSB: function(r, g, b, a) {
-            r /= 255;
-            g /= 255;
-            b /= 255;
-
-            var H, S, V, C;
-            V = Math.max(r, g, b);
-            C = V - Math.min(r, g, b);
-            H = (C === 0 ? null :
-                V === r ? (g - b) / C :
-                V === g ? (b - r) / C + 2 :
-                (r - g) / C + 4
-            );
-            H = ((H + 360) % 6) * 60 / 360;
-            S = C === 0 ? 0 : C / V;
-            return {
-                h: this._sanitizeNumber(H),
-                s: S,
-                b: V,
-                a: this._sanitizeNumber(a)
-            };
-        },
-        HueToRGB: function(p, q, h) {
-            if (h < 0) {
-                h += 1;
-            } else if (h > 1) {
-                h -= 1;
-            }
-            if ((h * 6) < 1) {
-                return p + (q - p) * h * 6;
-            } else if ((h * 2) < 1) {
-                return q;
-            } else if ((h * 3) < 2) {
-                return p + (q - p) * ((2 / 3) - h) * 6;
-            } else {
-                return p;
-            }
-        },
-        HSLtoRGB: function(h, s, l, a) {
-            if (s < 0) {
-                s = 0;
-            }
-            var q;
-            if (l <= 0.5) {
-                q = l * (1 + s);
-            } else {
-                q = l + s - (l * s);
-            }
-
-            var p = 2 * l - q;
-
-            var tr = h + (1 / 3);
-            var tg = h;
-            var tb = h - (1 / 3);
-
-            var r = Math.round(this.HueToRGB(p, q, tr) * 255);
-            var g = Math.round(this.HueToRGB(p, q, tg) * 255);
-            var b = Math.round(this.HueToRGB(p, q, tb) * 255);
-            return [r, g, b, this._sanitizeNumber(a)];
-        },
-        toString: function(format) {
-            format = format ||  'rgba';
-            switch (format) {
-                case 'rgb':
-                    {
-                        var rgb = this.toRGB();
-                        return 'rgb(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ')';
-                    }
-                    break;
-                case 'rgba':
-                    {
-                        var rgb = this.toRGB();
-                        return 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + rgb.a + ')';
-                    }
-                    break;
-                case 'hsl':
-                    {
-                        var hsl = this.toHSL();
-                        return 'hsl(' + Math.round(hsl.h * 360) + ',' + Math.round(hsl.s * 100) + '%,' + Math.round(hsl.l * 100) + '%)';
-                    }
-                    break;
-                case 'hsla':
-                    {
-                        var hsl = this.toHSL();
-                        return 'hsla(' + Math.round(hsl.h * 360) + ',' + Math.round(hsl.s * 100) + '%,' + Math.round(hsl.l * 100) + '%,' + hsl.a + ')';
-                    }
-                    break;
-                case 'hex':
-                    {
-                        return this.toHex();
-                    }
-                    break;
-                default:
-                    {
-                        return false;
-                    }
-                    break;
-            }
-        },
-        // a set of RE's that can match strings and generate color tuples.
-        // from John Resig color plugin
-        // https://github.com/jquery/jquery-color/
-        stringParsers: [{
-            re: /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/,
-            format: 'hex',
-            parse: function(execResult) {
-                return [
-                    parseInt(execResult[1], 16),
-                    parseInt(execResult[2], 16),
-                    parseInt(execResult[3], 16),
-                    1
-                ];
-            }
-        }, {
-            re: /#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/,
-            format: 'hex',
-            parse: function(execResult) {
-                return [
-                    parseInt(execResult[1] + execResult[1], 16),
-                    parseInt(execResult[2] + execResult[2], 16),
-                    parseInt(execResult[3] + execResult[3], 16),
-                    1
-                ];
-            }
-        }, {
-            re: /rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*?\)/,
-            format: 'rgb',
-            parse: function(execResult) {
-                return [
-                    execResult[1],
-                    execResult[2],
-                    execResult[3],
-                    1
-                ];
-            }
-        }, {
-            re: /rgb\(\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*?\)/,
-            format: 'rgb',
-            parse: function(execResult) {
-                return [
-                    2.55 * execResult[1],
-                    2.55 * execResult[2],
-                    2.55 * execResult[3],
-                    1
-                ];
-            }
-        }, {
-            re: /rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,
-            format: 'rgba',
-            parse: function(execResult) {
-                return [
-                    execResult[1],
-                    execResult[2],
-                    execResult[3],
-                    execResult[4]
-                ];
-            }
-        }, {
-            re: /rgba\(\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,
-            format: 'rgba',
-            parse: function(execResult) {
-                return [
-                    2.55 * execResult[1],
-                    2.55 * execResult[2],
-                    2.55 * execResult[3],
-                    execResult[4]
-                ];
-            }
-        }, {
-            re: /hsl\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*?\)/,
-            format: 'hsl',
-            parse: function(execResult) {
-                return [
-                    execResult[1] / 360,
-                    execResult[2] / 100,
-                    execResult[3] / 100,
-                    execResult[4]
-                ];
-            }
-        }, {
-            re: /hsla\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,
-            format: 'hsla',
-            parse: function(execResult) {
-                return [
-                    execResult[1] / 360,
-                    execResult[2] / 100,
-                    execResult[3] / 100,
-                    execResult[4]
-                ];
-            }
-        }, {
-            //predefined color name
-            re: /^([a-z]{3,})$/,
-            format: 'alias',
-            parse: function(execResult) {
-                var hexval = this.colorNameToHex(execResult[0]) ||  '#000000';
-                var match = this.stringParsers[0].re.exec(hexval),
-                    values = match && this.stringParsers[0].parse.apply(this, [match]);
-                return values;
-            }
-        }],
-        colorNameToHex: function(name) {
-            // 140 predefined colors from the HTML Colors spec
-            var colors = {
-                "aliceblue": "#f0f8ff",
-                "antiquewhite": "#faebd7",
-                "aqua": "#00ffff",
-                "aquamarine": "#7fffd4",
-                "azure": "#f0ffff",
-                "beige": "#f5f5dc",
-                "bisque": "#ffe4c4",
-                "black": "#000000",
-                "blanchedalmond": "#ffebcd",
-                "blue": "#0000ff",
-                "blueviolet": "#8a2be2",
-                "brown": "#a52a2a",
-                "burlywood": "#deb887",
-                "cadetblue": "#5f9ea0",
-                "chartreuse": "#7fff00",
-                "chocolate": "#d2691e",
-                "coral": "#ff7f50",
-                "cornflowerblue": "#6495ed",
-                "cornsilk": "#fff8dc",
-                "crimson": "#dc143c",
-                "cyan": "#00ffff",
-                "darkblue": "#00008b",
-                "darkcyan": "#008b8b",
-                "darkgoldenrod": "#b8860b",
-                "darkgray": "#a9a9a9",
-                "darkgreen": "#006400",
-                "darkkhaki": "#bdb76b",
-                "darkmagenta": "#8b008b",
-                "darkolivegreen": "#556b2f",
-                "darkorange": "#ff8c00",
-                "darkorchid": "#9932cc",
-                "darkred": "#8b0000",
-                "darksalmon": "#e9967a",
-                "darkseagreen": "#8fbc8f",
-                "darkslateblue": "#483d8b",
-                "darkslategray": "#2f4f4f",
-                "darkturquoise": "#00ced1",
-                "darkviolet": "#9400d3",
-                "deeppink": "#ff1493",
-                "deepskyblue": "#00bfff",
-                "dimgray": "#696969",
-                "dodgerblue": "#1e90ff",
-                "firebrick": "#b22222",
-                "floralwhite": "#fffaf0",
-                "forestgreen": "#228b22",
-                "fuchsia": "#ff00ff",
-                "gainsboro": "#dcdcdc",
-                "ghostwhite": "#f8f8ff",
-                "gold": "#ffd700",
-                "goldenrod": "#daa520",
-                "gray": "#808080",
-                "green": "#008000",
-                "greenyellow": "#adff2f",
-                "honeydew": "#f0fff0",
-                "hotpink": "#ff69b4",
-                "indianred ": "#cd5c5c",
-                "indigo ": "#4b0082",
-                "ivory": "#fffff0",
-                "khaki": "#f0e68c",
-                "lavender": "#e6e6fa",
-                "lavenderblush": "#fff0f5",
-                "lawngreen": "#7cfc00",
-                "lemonchiffon": "#fffacd",
-                "lightblue": "#add8e6",
-                "lightcoral": "#f08080",
-                "lightcyan": "#e0ffff",
-                "lightgoldenrodyellow": "#fafad2",
-                "lightgrey": "#d3d3d3",
-                "lightgreen": "#90ee90",
-                "lightpink": "#ffb6c1",
-                "lightsalmon": "#ffa07a",
-                "lightseagreen": "#20b2aa",
-                "lightskyblue": "#87cefa",
-                "lightslategray": "#778899",
-                "lightsteelblue": "#b0c4de",
-                "lightyellow": "#ffffe0",
-                "lime": "#00ff00",
-                "limegreen": "#32cd32",
-                "linen": "#faf0e6",
-                "magenta": "#ff00ff",
-                "maroon": "#800000",
-                "mediumaquamarine": "#66cdaa",
-                "mediumblue": "#0000cd",
-                "mediumorchid": "#ba55d3",
-                "mediumpurple": "#9370d8",
-                "mediumseagreen": "#3cb371",
-                "mediumslateblue": "#7b68ee",
-                "mediumspringgreen": "#00fa9a",
-                "mediumturquoise": "#48d1cc",
-                "mediumvioletred": "#c71585",
-                "midnightblue": "#191970",
-                "mintcream": "#f5fffa",
-                "mistyrose": "#ffe4e1",
-                "moccasin": "#ffe4b5",
-                "navajowhite": "#ffdead",
-                "navy": "#000080",
-                "oldlace": "#fdf5e6",
-                "olive": "#808000",
-                "olivedrab": "#6b8e23",
-                "orange": "#ffa500",
-                "orangered": "#ff4500",
-                "orchid": "#da70d6",
-                "palegoldenrod": "#eee8aa",
-                "palegreen": "#98fb98",
-                "paleturquoise": "#afeeee",
-                "palevioletred": "#d87093",
-                "papayawhip": "#ffefd5",
-                "peachpuff": "#ffdab9",
-                "peru": "#cd853f",
-                "pink": "#ffc0cb",
-                "plum": "#dda0dd",
-                "powderblue": "#b0e0e6",
-                "purple": "#800080",
-                "red": "#ff0000",
-                "rosybrown": "#bc8f8f",
-                "royalblue": "#4169e1",
-                "saddlebrown": "#8b4513",
-                "salmon": "#fa8072",
-                "sandybrown": "#f4a460",
-                "seagreen": "#2e8b57",
-                "seashell": "#fff5ee",
-                "sienna": "#a0522d",
-                "silver": "#c0c0c0",
-                "skyblue": "#87ceeb",
-                "slateblue": "#6a5acd",
-                "slategray": "#708090",
-                "snow": "#fffafa",
-                "springgreen": "#00ff7f",
-                "steelblue": "#4682b4",
-                "tan": "#d2b48c",
-                "teal": "#008080",
-                "thistle": "#d8bfd8",
-                "tomato": "#ff6347",
-                "turquoise": "#40e0d0",
-                "violet": "#ee82ee",
-                "wheat": "#f5deb3",
-                "white": "#ffffff",
-                "whitesmoke": "#f5f5f5",
-                "yellow": "#ffff00",
-                "yellowgreen": "#9acd32"
-            };
-
-            if (typeof colors[name.toLowerCase()] !== 'undefined') {
-                return colors[name.toLowerCase()];
-            }
-            return false;
-        }
-    };
-
-
-    var defaults = {
-        horizontal: false, // horizontal mode layout ?
-        inline: false, //forces to show the colorpicker as an inline element
-        color: false, //forces a color
-        format: false, //forces a format
-        input: 'input', // children input selector
-        container: false, // container selector
-        component: '.add-on, .input-group-addon', // children component selector
-        sliders: {
-            saturation: {
-                maxLeft: 100,
-                maxTop: 100,
-                callLeft: 'setSaturation',
-                callTop: 'setBrightness'
-            },
-            hue: {
-                maxLeft: 0,
-                maxTop: 100,
-                callLeft: false,
-                callTop: 'setHue'
-            },
-            alpha: {
-                maxLeft: 0,
-                maxTop: 100,
-                callLeft: false,
-                callTop: 'setAlpha'
-            }
-        },
-        slidersHorz: {
-            saturation: {
-                maxLeft: 100,
-                maxTop: 100,
-                callLeft: 'setSaturation',
-                callTop: 'setBrightness'
-            },
-            hue: {
-                maxLeft: 100,
-                maxTop: 0,
-                callLeft: 'setHue',
-                callTop: false
-            },
-            alpha: {
-                maxLeft: 100,
-                maxTop: 0,
-                callLeft: 'setAlpha',
-                callTop: false
-            }
-        },
-        template: '<div class="colorpicker dropdown-menu">' +
-            '<div class="colorpicker-saturation"><i><b></b></i></div>' +
-            '<div class="colorpicker-hue"><i></i></div>' +
-            '<div class="colorpicker-alpha"><i></i></div>' +
-            '<div class="colorpicker-color"><div /></div>' +
-            '</div>'
-    };
-
-    var Colorpicker = function(element, options) {
-        this.element = $(element).addClass('colorpicker-element');
-        this.options = $.extend({}, defaults, this.element.data(), options);
-        this.component = this.options.component;
-        this.component = (this.component !== false) ? this.element.find(this.component) : false;
-        if (this.component && (this.component.length === 0)) {
-            this.component = false;
-        }
-        this.container = (this.options.container === true) ? this.element : this.options.container;
-        this.container = (this.container !== false) ? $(this.container) : false;
-
-        // Is the element an input? Should we search inside for any input?
-        this.input = this.element.is('input') ? this.element : (this.options.input ?
-            this.element.find(this.options.input) : false);
-        if (this.input && (this.input.length === 0)) {
-            this.input = false;
-        }
-        // Set HSB color
-        this.color = new Color(this.options.color !== false ? this.options.color : this.getValue());
-        this.format = this.options.format !== false ? this.options.format : this.color.origFormat;
-
-        // Setup picker
-        this.picker = $(this.options.template);
-        if (this.options.inline) {
-            this.picker.addClass('colorpicker-inline colorpicker-visible');
-        } else {
-            this.picker.addClass('colorpicker-hidden');
-        }
-        if (this.options.horizontal) {
-            this.picker.addClass('colorpicker-horizontal');
-        }
-        if (this.format === 'rgba' || this.format === 'hsla') {
-            this.picker.addClass('colorpicker-with-alpha');
-        }
-        this.picker.on('mousedown.colorpicker', $.proxy(this.mousedown, this));
-        this.picker.appendTo(this.container ? this.container : $('body'));
-
-        // Bind events
-        if (this.input !== false) {
-            this.input.on({
-                'keyup.colorpicker': $.proxy(this.keyup, this)
-            });
-            if (this.component === false) {
-                this.element.on({
-                    'focus.colorpicker': $.proxy(this.show, this)
-                });
-            }
-            if (this.options.inline === false) {
-                this.element.on({
-                    'focusout.colorpicker': $.proxy(this.hide, this)
-                });
-            }
-        }
-
-        if (this.component !== false) {
-            this.component.on({
-                'click.colorpicker': $.proxy(this.show, this)
-            });
-        }
-
-        if ((this.input === false) && (this.component === false)) {
-            this.element.on({
-                'click.colorpicker': $.proxy(this.show, this)
-            });
-        }
-        this.update();
-
-        $($.proxy(function() {
-            this.element.trigger('create');
-        }, this));
-    };
-
-    Colorpicker.version = '2.0.0-beta';
-
-    Colorpicker.Color = Color;
-
-    Colorpicker.prototype = {
-        constructor: Colorpicker,
-        destroy: function() {
-            this.picker.remove();
-            this.element.removeData('colorpicker').off('.colorpicker');
-            if (this.input !== false) {
-                this.input.off('.colorpicker');
-            }
-            if (this.component !== false) {
-                this.component.off('.colorpicker');
-            }
-            this.element.removeClass('colorpicker-element');
-            this.element.trigger({
-                type: 'destroy'
-            });
-        },
-        reposition: function() {
-            if (this.options.inline !== false) {
-                return false;
-            }
-            var offset = this.component ? this.component.offset() : this.element.offset();
-            this.picker.css({
-                top: offset.top + (this.component ? this.component.outerHeight() : this.element.outerHeight()),
-                left: offset.left
-            });
-        },
-        show: function(e) {
-            if (this.isDisabled()) {
-                return false;
-            }
-            this.picker.addClass('colorpicker-visible').removeClass('colorpicker-hidden');
-            this.reposition();
-            $(window).on('resize.colorpicker', $.proxy(this.reposition, this));
-            if (!this.hasInput() && e) {
-                if (e.stopPropagation && e.preventDefault) {
-                    e.stopPropagation();
-                    e.preventDefault();
-                }
-            }
-            if (this.options.inline === false) {
-                $(window.document).on({
-                    'mousedown.colorpicker': $.proxy(this.hide, this)
-                });
-            }
-            this.element.trigger({
-                type: 'showPicker',
-                color: this.color
-            });
-        },
-        hide: function() {
-            this.picker.addClass('colorpicker-hidden').removeClass('colorpicker-visible');
-            $(window).off('resize.colorpicker', this.reposition);
-            $(document).off({
-                'mousedown.colorpicker': this.hide
-            });
-            this.update();
-            this.element.trigger({
-                type: 'hidePicker',
-                color: this.color
-            });
-        },
-        updateData: function(val) {
-            val = val ||  this.color.toString(this.format);
-            this.element.data('color', val);
-            return val;
-        },
-        updateInput: function(val) {
-            val = val ||  this.color.toString(this.format);
-            if (this.input !== false) {
-                this.input.prop('value', val);
-            }
-            return val;
-        },
-        updatePicker: function(val) {
-            if (val !== undefined) {
-                this.color = new Color(val);
-            }
-            var sl = (this.options.horizontal === false) ? this.options.sliders : this.options.slidersHorz;
-            var icns = this.picker.find('i');
-            if (icns.length === 0) {
-                return;
-            }
-            if (this.options.horizontal === false) {
-                sl = this.options.sliders;
-                icns.eq(1).css('top', sl.hue.maxTop * (1 - this.color.value.h)).end()
-                    .eq(2).css('top', sl.alpha.maxTop * (1 - this.color.value.a));
-            } else {
-                sl = this.options.slidersHorz;
-                icns.eq(1).css('left', sl.hue.maxLeft * (1 - this.color.value.h)).end()
-                    .eq(2).css('left', sl.alpha.maxLeft * (1 - this.color.value.a));
-            }
-            icns.eq(0).css({
-                'top': sl.saturation.maxTop - this.color.value.b * sl.saturation.maxTop,
-                'left': this.color.value.s * sl.saturation.maxLeft
-            });
-            this.picker.find('.colorpicker-saturation').css('backgroundColor', this.color.toHex(this.color.value.h, 1, 1, 1));
-            this.picker.find('.colorpicker-alpha').css('backgroundColor', this.color.toHex());
-            this.picker.find('.colorpicker-color, .colorpicker-color div').css('backgroundColor', this.color.toString(this.format));
-            return val;
-        },
-        updateComponent: function(val) {
-            val = val ||  this.color.toString(this.format);
-            if (this.component !== false) {
-                var icn = this.component.find('i').eq(0);
-                if (icn.length > 0) {
-                    icn.css({
-                        'backgroundColor': val
-                    });
-                } else {
-                    this.component.css({
-                        'backgroundColor': val
-                    });
-                }
-            }
-            return val;
-        },
-        update: function(force) {
-            var val = this.updateComponent();
-            if ((this.getValue(false) !== false) || (force === true)) {
-                // Update input/data only if the current value is not blank
-                this.updateInput(val);
-                this.updateData(val);
-            }
-            this.updatePicker();
-            return val;
-
-        },
-        setValue: function(val) { // set color manually
-            this.color = new Color(val);
-            this.update();
-            this.element.trigger({
-                type: 'changeColor',
-                color: this.color,
-                value: val
-            });
-        },
-        getValue: function(defaultValue) {
-            defaultValue = (defaultValue === undefined) ? '#000000' : defaultValue;
-            var val;
-            if (this.hasInput()) {
-                val = this.input.val();
-            } else {
-                val = this.element.data('color');
-            }
-            if ((val === undefined) || (val === '') || (val === null)) {
-                // if not defined or empty, return default
-                val = defaultValue;
-            }
-            return val;
-        },
-        hasInput: function() {
-            return (this.input !== false);
-        },
-        isDisabled: function() {
-            if (this.hasInput()) {
-                return (this.input.prop('disabled') === true);
-            }
-            return false;
-        },
-        disable: function() {
-            if (this.hasInput()) {
-                this.input.prop('disabled', true);
-                return true;
-            }
-            return false;
-        },
-        enable: function() {
-            if (this.hasInput()) {
-                this.input.prop('disabled', false);
-                return true;
-            }
-            return false;
-        },
-        currentSlider: null,
-        mousePointer: {
-            left: 0,
-            top: 0
-        },
-        mousedown: function(e) {
-            e.stopPropagation();
-            e.preventDefault();
-
-            var target = $(e.target);
-
-            //detect the slider and set the limits and callbacks
-            var zone = target.closest('div');
-            var sl = this.options.horizontal ? this.options.slidersHorz : this.options.sliders;
-            if (!zone.is('.colorpicker')) {
-                if (zone.is('.colorpicker-saturation')) {
-                    this.currentSlider = $.extend({}, sl.saturation);
-                } else if (zone.is('.colorpicker-hue')) {
-                    this.currentSlider = $.extend({}, sl.hue);
-                } else if (zone.is('.colorpicker-alpha')) {
-                    this.currentSlider = $.extend({}, sl.alpha);
-                } else {
-                    return false;
-                }
-                var offset = zone.offset();
-                //reference to guide's style
-                this.currentSlider.guide = zone.find('i')[0].style;
-                this.currentSlider.left = e.pageX - offset.left;
-                this.currentSlider.top = e.pageY - offset.top;
-                this.mousePointer = {
-                    left: e.pageX,
-                    top: e.pageY
-                };
-                //trigger mousemove to move the guide to the current position
-                $(document).on({
-                    'mousemove.colorpicker': $.proxy(this.mousemove, this),
-                    'mouseup.colorpicker': $.proxy(this.mouseup, this)
-                }).trigger('mousemove');
-            }
-            return false;
-        },
-        mousemove: function(e) {
-            e.stopPropagation();
-            e.preventDefault();
-            var left = Math.max(
-                0,
-                Math.min(
-                    this.currentSlider.maxLeft,
-                    this.currentSlider.left + ((e.pageX || this.mousePointer.left) - this.mousePointer.left)
-                )
-            );
-            var top = Math.max(
-                0,
-                Math.min(
-                    this.currentSlider.maxTop,
-                    this.currentSlider.top + ((e.pageY || this.mousePointer.top) - this.mousePointer.top)
-                )
-            );
-            this.currentSlider.guide.left = left + 'px';
-            this.currentSlider.guide.top = top + 'px';
-            if (this.currentSlider.callLeft) {
-                this.color[this.currentSlider.callLeft].call(this.color, left / 100);
-            }
-            if (this.currentSlider.callTop) {
-                this.color[this.currentSlider.callTop].call(this.color, top / 100);
-            }
-            this.update(true);
-
-            this.element.trigger({
-                type: 'changeColor',
-                color: this.color
-            });
-            return false;
-        },
-        mouseup: function(e) {
-            e.stopPropagation();
-            e.preventDefault();
-            $(document).off({
-                'mousemove.colorpicker': this.mousemove,
-                'mouseup.colorpicker': this.mouseup
-            });
-            return false;
-        },
-        keyup: function(e) {
-            if ((e.keyCode === 38)) {
-                if (this.color.value.a < 1) {
-                    this.color.value.a = Math.round((this.color.value.a + 0.01) * 100) / 100;
-                }
-                this.update(true);
-            } else if ((e.keyCode === 40)) {
-                if (this.color.value.a > 0) {
-                    this.color.value.a = Math.round((this.color.value.a - 0.01) * 100) / 100;
-                }
-                this.update(true);
-            } else {
-                var val = this.input.val();
-                this.color = new Color(val);
-                if (this.getValue(false) !== false) {
-                    this.updateData();
-                    this.updateComponent();
-                    this.updatePicker();
-                }
-            }
-            this.element.trigger({
-                type: 'changeColor',
-                color: this.color,
-                value: val
-            });
-        }
-    };
-
-    $.colorpicker = Colorpicker;
-
-    $.fn.colorpicker = function(option) {
-        return this.each(function() {
-            var $this = $(this),
-                inst = $this.data('colorpicker'),
-                options = ((typeof option === 'object') ? option : {});
-            if ((!inst) && (typeof option !== 'string')) {
-                $this.data('colorpicker', new Colorpicker(this, options));
-            } else {
-                if (typeof option === 'string') {
-                    inst[option].apply(inst, Array.prototype.slice.call(arguments, 1));
-                }
-            }
-        });
-    };
-
-    $.fn.colorpicker.constructor = Colorpicker;
-
-})(window.jQuery);