Color Admin

“Default Flat Design” Documentation by “Sean Ngu” v4.3

Created: 31/October/2014
By: Sean Ngu
Email: nguoksiong@live.co.uk

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email your question to my email nguoksiong@live.co.uk. Thanks so much!

This template can be used as an fluid layout with a max of 12 columns next to each other. The general template structure is the same throughout the template. Here is the general structure.

<!-- begin #page-loader -->
<div id="page-loader" class="fade show"><span class="spinner"></span></div>
<!-- end #page-loader -->

<!-- begin #page-container -->
<div id="page-container" class="page-container fade page-sidebar-fixed page-header-fixed">
  <!-- begin #header -->
  <div id="header" class="header navbar-default"></div>
  <!-- end #header -->
  
  <!-- begin #sidebar -->
  <div id="sidebar" class="sidebar"></div>
  <div class="sidebar-bg"></div>
  <!-- end #sidebar -->
  
  <!-- begin #content -->
  <div id="content" class="content"></div>
  <!-- end #content -->
  
  <!-- begin theme-panel -->
  <div class="theme-panel"></div>
  <!-- end theme-panel -->
    
  <!-- begin scroll to top btn -->
  <a href="javascript:;" class="btn btn-icon btn-circle btn-success btn-scroll-to-top fade" 
    data-click="scroll-top">
    <i class="fa fa-angle-up"></i>
  </a>
  <!-- end scroll to top btn -->
</div>
<!-- end page container -->

Below code is used to detect the internet explorer for browser compatibility & styling setting usage.

<!DOCTYPE html>
<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en">
<!--<![endif]-->

Page head contains metadata, javascript and css files:

<head>
  <meta charset="utf-8" />
  <title>Color Admin | Default Design</title>
  <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" 
        name="viewport" />
  <meta content="" name="description" />
  <meta content="" name="author" />
  
  <!-- ================== BEGIN BASE CSS STYLE ================== -->
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" rel="stylesheet" />
  <link href="../assets/plugins/jquery-ui/jquery-ui.min.css" rel="stylesheet" />
  <link href="../assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
  <link href="../assets/plugins/font-awesome/css/all.min.css" rel="stylesheet" />
  <link href="../assets/plugins/animate/animate.min.css" rel="stylesheet" />
  <link href="../assets/css/default/style.min.css" rel="stylesheet" />
  <link href="../assets/css/default/style-responsive.min.css" rel="stylesheet" />
  <link href="../assets/css/default/theme/default.css" rel="stylesheet" id="theme" />
  <!-- ================== END BASE CSS STYLE ================== -->
  
  <!-- ================== BEGIN BASE JS ================== -->
  <script src="../assets/plugins/pace/pace.min.js"></script>
  <!-- ================== END BASE JS ================== -->
</head>
<!-- begin #header -->
<div id="header" class="header navbar-default">
  <!-- begin navbar-header -->
  <div class="navbar-header">
    <a href="index.html" class="navbar-brand">
      <span class="navbar-logo"></span> 
      <b>Color</b> Admin
    </a>
    <button type="button" class="navbar-toggle" data-click="sidebar-toggled">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
  </div>
  <!-- end navbar-header -->
  
  <!-- begin header-nav -->
  <ul class="navbar-nav navbar-right">
    <li>
      <form class="navbar-form">
        <div class="form-group">
          <input type="text" class="form-control" placeholder="Enter keyword" />
          <button type="submit" class="btn btn-search"><i class="fa fa-search"></i></button>
        </div>
      </form>
    </li>
    <li class="dropdown">
      <a href="javascript:;" data-toggle="dropdown" class="dropdown-toggle f-s-14">
        <i class="fa fa-bell"></i>
        <span class="label">5</span>
      </a>
      <ul class="dropdown-menu media-list dropdown-menu-right">
        <li class="dropdown-header">NOTIFICATIONS (5)</li>
        <li class="media">
          <a href="javascript:;">
            <div class="media-left">
              <i class="fa fa-bug media-object bg-silver-darker"></i>
            </div>
            <div class="media-body">
              <h6 class="media-heading">
                Server Error Reports 
                <i class="fa fa-exclamation-circle text-danger"></i>
              </h6>
              <div class="text-muted f-s-11">3 minutes ago</div>
            </div>
          </a>
        </li>
        ...
        <li class="dropdown-footer text-center">
          <a href="javascript:;">View more</a>
        </li>
      </ul>
    </li>
    <li class="dropdown navbar-user">
      <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown">
        <img src="../assets/img/user/user-13.jpg" alt="" /> 
        <!-- or -->
        <div class="image image-icon bg-black text-grey-darker">
          <i class="fa fa-user"></i>
        </div>
        <span class="d-none d-md-inline">Adam Schwartz</span> <b class="caret"></b>
      </a>
      <div class="dropdown-menu dropdown-menu-right">
        <a href="javascript:;" class="dropdown-item">Edit Profile</a>
        ...
      </div>
    </li>
  </ul>
  <!-- end header navigation right -->
</div>
<!-- end #header -->
<!-- begin #sidebar -->
<div id="sidebar" class="sidebar">
  <!-- begin sidebar scrollbar -->
  <div data-scrollbar="true" data-height="100%">
    <!-- begin sidebar user -->
    <ul class="nav">
      <li class="nav-profile">
        <a href="javascript:;" data-toggle="nav-profile">
          <div class="cover with-shadow"></div>
          <div class="image">
            <img src="../assets/img/user/user-13.jpg" alt="" />
          </div>
          <!-- or -->
          <div class="image image-icon bg-black text-grey-darker">
            <i class="fa fa-user"></i>
          </div>
          <div class="info">
            <b class="caret pull-right"></b>
            Sean Ngu
            <small>Front end developer</small>
          </div>
        </a>
      </li>
      <li>
        <ul class="nav nav-profile">
          <li><a href="javascript:;"><i class="fa fa-cog"></i> Settings</a></li>
          <li><a href="javascript:;"><i class="fa fa-pencil-alt"></i> Send Feedback</a></li>
          <li><a href="javascript:;"><i class="fa fa-question-circle"></i> Helps</a></li>
        </ul>
      </li>
    </ul>
    <!-- end sidebar user -->
    <!-- begin sidebar nav -->
    <ul class="nav">
      <li class="nav-header">Navigation</li>
      <li class="has-sub">
        <a href="javascript:;">
          <b class="caret"></b>
          <i class="fa fa-th-large"></i>
          <span>Dashboard</span>
        </a>
        <ul class="sub-menu">
          <li><a href="index.html">Dashboard v1</a></li>
          <li><a href="index_v2.html">Dashboard v2</a></li>
        </ul>
      </li>
      ...
      <!-- begin sidebar minify button -->
      <li>
        <a href="javascript:;" class="sidebar-minify-btn" data-click="sidebar-minify">
          <i class="fa fa-angle-double-left"></i>
        </a>
      </li>
      <!-- end sidebar minify button -->
    </ul>
    <!-- end sidebar nav -->
  </div>
  <!-- end sidebar scrollbar -->
</div>
<div class="sidebar-bg"></div>
<!-- end #sidebar -->

Page content consists of page title, breadcrumbs and page's main body. HTML code of Content container as shown below:

<!-- begin #content -->
<div id="content" class="content">
  <!-- begin breadcrumb -->
  <ol class="breadcrumb pull-right">
    <li><a href="javascript:;">Home</a></li>
    <li><a href="javascript:;">Page Options</a></li>
    <li class="active">Blank Page</li>
  </ol>
  <!-- end breadcrumb -->
  <!-- begin page-header -->
  <h1 class="page-header">Blank Page <small>header small text goes here...</small></h1>
  <!-- end page-header -->
  
  <!-- Page Content Here -->  
</div>
<!-- end #content -->

Widget Box used for separate the content clearly by section.

<!-- begin panel -->
<div class="panel panel-inverse">
  <div class="panel-heading">
    <div class="panel-heading-btn">
      <a href="javascript:;" class="btn btn-xs btn-icon btn-circle btn-default" 
        data-click="panel-expand">
        <i class="fa fa-expand"></i>
      </a>
      <a href="javascript:;" class="btn btn-xs btn-icon btn-circle btn-success" 
        data-click="panel-reload">
        <i class="fa fa-repeat"></i>
      </a>
      <a href="javascript:;" class="btn btn-xs btn-icon btn-circle btn-warning" 
        data-click="panel-collapse">
        <i class="fa fa-minus"></i>
      </a>
      <a href="javascript:;" class="btn btn-xs btn-icon btn-circle btn-danger" 
        data-click="panel-remove">
        <i class="fa fa-times"></i>
      </a>
    </div>
    <h4 class="panel-title">Panel Title here</h4>
  </div>
  <div class="panel-body">
    Panel Content Here
  </div>
</div>
<!-- end panel -->

Panel Theme used to customize the overall layout options.

<!-- begin theme-panel -->
<div class="theme-panel theme-panel-lg">
  <a href="javascript:;" data-click="theme-panel-expand" class="theme-collapse-btn">
    <i class="fa fa-cog"></i>
  </a>
  <div class="theme-panel-content">
    <h5 class="m-t-0">Color Theme</h5>
    <ul class="theme-list clearfix">
      <li>
        <a href="javascript:;" class="bg-red" data-theme="red" 
          data-theme-file="../assets/css/default/theme/red.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Red"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-pink" data-theme="pink" 
          data-theme-file="../assets/css/default/theme/pink.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Pink"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-orange" data-theme="orange" 
          data-theme-file="../assets/css/default/theme/orange.css" 
          data-click="theme-selector" data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Orange"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-yellow" data-theme="yellow" 
          data-theme-file="../assets/css/default/theme/yellow.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Yellow"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-lime" data-theme="lime" 
          data-theme-file="../assets/css/default/theme/lime.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Lime"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-green" data-theme="green" 
          data-theme-file="../assets/css/default/theme/green.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Green"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-teal" data-theme="default" 
          data-theme-file="../assets/css/default/theme/default.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Default"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-aqua" data-theme="aqua" 
          data-theme-file="../assets/css/default/theme/aqua.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Aqua"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-blue" data-theme="blue" 
          data-theme-file="../assets/css/default/theme/blue.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Blue"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-purple" data-theme="purple" 
          data-theme-file="../assets/css/default/theme/purple.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Purple"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-indigo" data-theme="indigo" 
          data-theme-file="../assets/css/default/theme/indigo.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Indigo"> </a>
      </li>
      <li>
        <a href="javascript:;" class="bg-black" data-theme="black" 
          data-theme-file="../assets/css/default/theme/black.css" 
          data-click="theme-selector" 
          data-toggle="tooltip" 
          data-trigger="hover" 
          data-container="body" 
          data-title="Black"> </a>
      </li>
    </ul>
    <div class="divider"></div>
    <div class="row m-t-10">
      <div class="col-md-6 control-label text-inverse f-w-600">Header Styling</div>
      <div class="col-md-6">
        <select name="header-styling" class="form-control form-control-sm">
          <option value="1">default</option>
          <option value="2">inverse</option>
        </select>
      </div>
    </div>
    <div class="row m-t-10">
      <div class="col-md-6 control-label text-inverse f-w-600">Header</div>
      <div class="col-md-6">
        <select name="header-fixed" class="form-control form-control-sm">
          <option value="1">fixed</option>
          <option value="2">default</option>
        </select>
      </div>
    </div>
    <div class="row m-t-10">
      <div class="col-md-6 control-label text-inverse f-w-600">Sidebar Styling</div>
      <div class="col-md-6">
        <select name="sidebar-styling" class="form-control form-control-sm">
          <option value="1">default</option>
          <option value="2">grid</option>
        </select>
      </div>
    </div>
    <div class="row m-t-10">
      <div class="col-md-6 control-label text-inverse f-w-600">Sidebar</div>
      <div class="col-md-6">
        <select name="sidebar-fixed" class="form-control form-control-sm">
          <option value="1">fixed</option>
          <option value="2">default</option>
        </select>
      </div>
    </div>
    <div class="row m-t-10">
      <div class="col-md-6 control-label text-inverse f-w-600">Sidebar Gradient</div>
      <div class="col-md-6">
        <select name="content-gradient" class="form-control form-control-sm">
          <option value="1">disabled</option>
          <option value="2">enabled</option>
        </select>
      </div>
    </div>
    <div class="row m-t-10">
      <div class="col-md-6 control-label text-inverse f-w-600">Content Styling</div>
      <div class="col-md-6">
        <select name="content-styling" class="form-control form-control-sm">
          <option value="1">default</option>
          <option value="2">black</option>
        </select>
      </div>
    </div>
    <div class="row m-t-10">
      <div class="col-md-6 control-label text-inverse f-w-600">Direction</div>
      <div class="col-md-6">
        <select name="direction" class="form-control form-control-sm">
          <option value="1">LTR</option>
          <option value="2">RTL</option>
        </select>
      </div>
    </div>
    <div class="divider"></div>
    <h5>THEME VERSION</h5>
    <div class="theme-version">
      <a href="../template_html/index_v2.html" class="active">
        <span style="background-image: url(../assets/img/theme/default.jpg);"></span>
      </a>
      <a href="../template_transparent/index_v2.html">
        <span style="background-image: url(../assets/img/theme/transparent.jpg);"></span>
      </a>
    </div>
    <div class="theme-version">
      <a href="../template_apple/index_v2.html">
        <span style="background-image: url(../assets/img/theme/apple.jpg);"></span>
      </a>
      <a href="../template_material/index_v2.html">
        <span style="background-image: url(../assets/img/theme/material.jpg);"></span>
      </a>
    </div>
    <div class="theme-version">
      <a href="../template_facebook/index_v2.html">
        <span style="background-image: url(../assets/img/theme/facebook.jpg);"></span>
      </a>
    </div>
    <div class="divider"></div>
    <div class="row m-t-10">
      <div class="col-md-12">
        <a href="javascript:;" class="btn btn-inverse btn-block btn-rounded" data-click="reset-local-storage"><b>Reset Local Storage</b></a>
      </div>
    </div>
  </div>
</div>
<!-- end theme-panel -->

Javascript files loaded in the end of page. This will reduce page load time.

  <!-- ================== BEGIN BASE JS ================== -->
  <script src="../assets/plugins/jquery/jquery-3.3.1.min.js"></script>
  <script src="../assets/plugins/jquery-ui/jquery-ui.min.js"></script>
  <script src="../assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
  <!--[if lt IE 9]>
    <script src="../assets/crossbrowserjs/html5shiv.js"></script>
    <script src="../assets/crossbrowserjs/respond.min.js"></script>
    <script src="../assets/crossbrowserjs/excanvas.min.js"></script>
  <![endif]-->
  <script src="../assets/plugins/slimscroll/jquery.slimscroll.min.js"></script>
  <script src="../assets/plugins/js-cookie/js.cookie.js"></script>
  <script src="../assets/js/theme/default.min.js"></script>
  <script src="../assets/js/apps.min.js"></script>
  <!-- ================== END BASE JS ================== -->
  
  <script>
    $(document).ready(function() {
      App.init();
    });
  </script>
</body>
</html>

Select the css theme from the ../assets/css/theme/default/ folder.

Available Theme Options

<!-- DEFAULT - GREEN -->
<link href="../assets/css/default/theme/default.css" rel="stylesheet" />
<!-- BLUE -->
<link href="../assets/css/default/theme/blue.css" rel="stylesheet" />
<!-- PURPLE -->
<link href="../assets/css/default/theme/purple.css" rel="stylesheet" />
<!-- RED -->
<link href="../assets/css/default/theme/red.css" rel="stylesheet" />
<!-- ORANGE -->
<link href="../assets/css/default/theme/orange.css" rel="stylesheet" />
<!-- BLACK -->
<link href="../assets/css/default/theme/black.css" rel="stylesheet" />

<!-- AQUA -->
<link href="../assets/css/default/theme/aqua.css" rel="stylesheet" />
<!-- GREEN -->
<link href="../assets/css/default/theme/green.css" rel="stylesheet" />
<!-- LIME -->
<link href="../assets/css/default/theme/lime.css" rel="stylesheet" />
<!-- YELLOW -->
<link href="../assets/css/default/theme/yellow.css" rel="stylesheet" />
<!-- PINK -->
<link href="../assets/css/default/theme/pink.css" rel="stylesheet" />
<!-- INDIGO -->
<link href="../assets/css/default/theme/indigo.css" rel="stylesheet" />

Here is the general structure for the each case of page options.

RTL Mode NEW

<body class="rtl-mode">

Page Content Theme (Flat Black) NEW

<body class="flat-black">

Page Without Sidebar

<!-- begin #page-container -->
<div id="page-container" class="fade page-without-sidebar">
  <!-- begin #sidebar -->
  <div id="sidebar" class="sidebar">

Page With Two Sidebar

<!-- begin #page-container -->
<div id="page-container" class="fade page-with-two-sidebar">
  <!-- begin #sidebar -->
  <div id="sidebar" class="sidebar"></div>
  <div class="sidebar-bg"></div>
  <!-- end #sidebar -->
  <!-- begin #sidebar-right -->
  <div id="sidebar-right" class="sidebar sidebar-right"></div>
  <div class="sidebar-bg sidebar-right"></div>
  <!-- end #sidebar-right -->

Page With Footer

<!-- begin #page-container -->
<div id="page-container" class="fade">
  <!-- begin #footer -->
  <div id="footer" class="footer">
    <!-- Footer Here -->
  </div>
  <!-- end #footer -->

Top Navigation Default

<!-- begin #page-container -->
<div id="page-container" class="fade">
  <!-- begin #header -->
  <div id="header" class="header navbar navbar-default">

Top Navigation Fixed

<!-- begin #page-container -->
<div id="page-container" class="fade page-header-fixed">
  <!-- begin #header -->
  <div id="header" class="header navbar navbar-default navbar-fixed-top">

Top Navigation Inverse Styling

<!-- begin #page-container -->
<div id="page-container" class="fade">
  <!-- begin #header -->
  <div id="header" class="header navbar navbar-inverse">

Sidebar Default

<!-- begin #page-container -->
<div id="page-container" class="fade">
  <!-- begin #sidebar -->
  <div id="sidebar" class="sidebar">
    <!-- Sidebar Here -->
  </div>
  <div class="sidebar-bg"></div>
  <!-- end #sidebar -->

Sidebar Fixed

<!-- begin #page-container -->
<div id="page-container" class="fade page-sidebar-fixed">
  <!-- begin #sidebar -->
  <div id="sidebar" class="sidebar">

Sidebar Minified

<!-- begin #page-container -->
<div id="page-container" class="fade page-sidebar-minified">
  <!-- begin #sidebar -->
  <div id="sidebar" class="sidebar">
    <!-- Sidebar Here -->
  </div>
  <div class="sidebar-bg"></div>
  <!-- end #sidebar -->

Sidebar Position Right

<!-- begin #page-container -->
<div id="page-container" class="fade page-with-right-sidebar">
  <!-- begin #sidebar -->
  <div id="sidebar" class="sidebar">

Sidebar Grid Styling

<!-- begin #sidebar -->
<div id="sidebar" class="sidebar sidebar-grid">

Sidebar Gradient Styling NEW

<!-- begin #page-container -->
<div id="page-container" class="gradient-enabled">

Full Height Page / Table Column Page NEW

<!-- begin #content -->
<div id="content" class="content content-full-width">
  <div class="vertical-box">
    <div class="vertical-box-column width-250">
      <div class="vertical-box">
        <div class="wrapper bg-blue-darker text-white">
          Header
        </div>
        <div class="vertical-box-row bg-blue text-white">
          <div class="vertical-box-cell">
            <div class="vertical-box-inner-cell">
              <div data-scrollbar="true" data-height="100%" class="wrapper">
                <!-- auto adjust vertical box with scrollbar here -->
              </div>
            </div>
          </div>
        </div>
        <div class="wrapper bg-silver bg-blue-darker text-white">
          Footer
        </div>
      </div>
    </div>
  </div>
  <div class="vertical-box">
    <!-- next vertical box column with same / different option like the previous sample code -->
  </div>
</div>
<!-- end #content -->

Page Loading HTML NEW

Loading BS4
<!-- begin #page-loader -->
<div id="page-loader" class="fade show">
  <span class="spinner"></span>
</div>
<!-- end #page-loader -->

<!-- begin #page-container -->
<div id="page-container" class="fade">
</div>
<!-- end #page-container -->
After Loading
<!-- begin #page-loader -->
<div id="page-loader" class="fade">
  <span class="spinner"></span>
</div>
<!-- end #page-loader -->

<!-- begin #page-container -->
<div id="page-container" class="fade show">
</div>
<!-- end #page-container -->
Loading BS3
<!-- begin #page-loader -->
<div id="page-loader" class="fade in">
  <span class="spinner"></span>
</div>
<!-- end #page-loader -->

<!-- begin #page-container -->
<div id="page-container" class="fade">
</div>
<!-- end #page-container -->
After Loading
<!-- begin #page-loader -->
<div id="page-loader" class="fade">
  <span class="spinner"></span>
</div>
<!-- end #page-loader -->

<!-- begin #page-container -->
<div id="page-container" class="fade in">
</div>
<!-- end #page-container -->

Here is the general LESS structure for the Color Admin.

Required Files

<link href="../assets/less/default/styles.less" rel="stylesheet/less" type="text/css" />
<script src="../assets/plugins/less/less.min.js" type="text/javascript"></script>

Less file structure

_page_option_list.less, _page_structure_list.less, _component_list.less, _widget_list.less, _plugin_list.less, _page_list.less used to include all the required less files.

assets/less/default/
├── styles.less
├── _component_list.less
├── _content_flat_black.less
├── _helper.less
├── _mixin.less
├── _page_list.less
├── _page_option_list.less
├── _page_structure_list.less
├── _plugin_list.less
├── _responsive.less
├── _variable.less
├── _widget_list.less
├── components/
├── images/
├── page-option/
├── page-structure/
├── pages/
├── plugins/
├── theme/
└── widget/

Here is the general SCSS structure for the Color Admin. For SASS installation, you may refer to their official website.

Compile using command line

sass --source path--/assets/scss/default/styles.scss --destination path--/styles.css

Less file structure

_page_option_list.scss, _page_structure_list.scss, _component_list.scss, _widget_list.scss, _plugin_list.less, _page_list.scss used to include all the required scss files.

assets/scss/default/
├── styles.scss
├── _component_list.scss
├── _content_flat_black.scss
├── _helper.scss
├── _mixin.scss
├── _page_list.scss
├── _page_option_list.scss
├── _page_structure_list.scss
├── _plugin_list.scss
├── _responsive.scss
├── _variable.scss
├── _widget_list.scss
├── components/
├── images/
├── page-option/
├── page-structure/
├── pages/
├── plugins/
├── theme/
└── widget/

Below is the list of all plugins and external resources used to power this template.

Name CSS Files
jQuery
jQuery 3.3.1

Required JS File

<script src="../assets/plugins/jquery/jquery-3.3.1.min.js"></script>
jQuery 3.2.1

Required JS File

<script src="../assets/plugins/jquery/jquery-3.2.1.min.js"></script>
jQuery 1.9.1

Required JS File

<script src="../assets/plugins/jquery/jquery-1.9.1.min.js"></script>
<script src="../assets/plugins/jquery/jquery-migrate-1.1.0.min.js"></script>
jQuery 1.8.2

Required JS File

<script src="../assets/plugins/jquery/jquery-1.8.2.min.js"></script>

Official Link:
http://jquery.com/

jQuery UI

Required CSS File

<link rel="stylesheet" href="../assets/plugins/jquery-ui/jquery-ui.min.css" />

Required JS File

<script src="../assets/plugins/jquery-ui/jquery-ui.min.js"></script>

Official Link:
http://jqueryui.com/

Bootstrap

Required CSS File

<link rel="stylesheet" href="../assets/plugins/bootstrap/css/bootstrap.min.css" />

Required JS File

<script src="../assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>

Official Link:
http://getbootstrap.com/

Font Awesome

Required CSS File

<link rel="stylesheet" href="../assets/plugins/font-awesome/css/all.min.css" />

Official Link:
https://fontawesome.com/

jvectormap

Required CSS File

<link rel="stylesheet" href="assets/plugins/jquery-jvectormap/jquery-jvectormap.css" />

Required JS File

<script src="../assets/plugins/jquery-jvectormap/jquery-jvectormap.min.js"></script>
<script src="../assets/plugins/jquery-jvectormap/jquery-jvectormap-world-mill-en.js"></script>

Official Link:
http://jvectormap.com/

jQuery slimScroll

Required JS File

<script src="../assets/plugins/slimscroll/jquery.slimscroll.min.js"></script>

Official Link:
http://rocha.la/jQuery-slimScroll

flot charts

Required JS File

<script src="../assets/plugins/flot/jquery.flot.min.js"></script>
<script src="../assets/plugins/flot/jquery.flot.time.min.js"></script>
<script src="../assets/plugins/flot/jquery.flot.resize.min.js"></script>
<script src="../assets/plugins/flot/jquery.flot.pie.min.js"></script>
<script src="../assets/plugins/flot/jquery.flot.stack.min.js"></script>
<script src="../assets/plugins/flot/jquery.flot.crosshair.min.js"></script>
<script src="../assets/plugins/flot/jquery.flot.categories.js"></script>

Official Link:
http://www.flotcharts.org/

fullcalendar

Required CSS File

<link rel="stylesheet" href="../assets/plugins/fullcalendar/fullcalendar/fullcalendar.css" />

Required JS File

<script src="../assets/plugins/fullcalendar/fullcalendar/fullcalendar.js"></script>

Official Link:
https://fullcalendar.io/

Gritter

Required CSS File

<link rel="stylesheet" href="../assets/plugins/gritter/css/jquery.gritter.css" />

Required JS File

<script src="../assets/plugins/gritter/js/jquery.gritter.js"></script>

Official Link:
https://github.com/jboesch/Gritter

Isotope

Required JS File

<script src="../assets/plugins/isotope/jquery.isotope.min.js"></script>

Official Link:
http://isotope.metafizzy.co/

Lightbox 2

Required CSS File

<link rel="stylesheet" href="../assets/plugins/lightbox/css/lightbox.min.css" />

Required JS File

<script src="../assets/plugins/lightbox/js/lightbox.min.js"></script>

Official Link:
http://lokeshdhakar.com/projects/lightbox2/

Bootstrap Datepicker

Required CSS File

<link rel="stylesheet" href="../assets/plugins/bootstrap-datepicker/css/datepicker.css" />
<link rel="stylesheet" href="../assets/plugins/bootstrap-datepicker/css/datepicker3.css" />

Required JS File

<script src="../assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>

Official Link:
http://bootstrap-datepicker.readthedocs.io/en/latest/

Bootstrap Timepicker

Required CSS File

<link rel="stylesheet" href="../assets/plugins/bootstrap-timepicker/css/bootstrap-timepicker.min.css" />

Required JS File

<script src="../assets/plugins/bootstrap-timepicker/js/bootstrap-timepicker.min.js"></script>

Official Link:
http://jdewit.github.io/bootstrap-timepicker/

Bootstrap Colorpicker

Required CSS File

<link rel="stylesheet" href="../assets/plugins/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css" />

Required JS File

<script src="../assets/plugins/bootstrap-colorpicker/js/bootstrap-colorpicker.min.js"></script>

Official Link:
http://www.eyecon.ro/bootstrap-colorpicker

Bootstrap ComboBox

Required CSS File

<link rel="stylesheet" href="../assets/plugins/bootstrap-combobox/css/bootstrap-combobox.css" />

Required JS File

<script src="../assets/plugins/bootstrap-combobox/js/bootstrap-combobox.js"></script>

Official Link:
https://github.com/danielfarrell/bootstrap-combobox

jQuery Tag It

Required CSS File

<link rel="stylesheet" href="../assets/plugins/jquery-tag-it/css/jquery.tagit.css" />

Required JS File

<script src="../assets/plugins/jquery-tag-it/js/tag-it.min.js"></script>

Official Link:
http://aehlke.github.io/tag-it/

Bootstrap Select

Required CSS File

<link rel="stylesheet" href="../assets/plugins/bootstrap-select/bootstrap-select.min.css" />

Required JS File

<script src="../assets/plugins/bootstrap-select/bootstrap-select.min.js"></script>

Official Link:
http://silviomoreto.github.io/bootstrap-select/

Masked Input

Required JS File

<script src="../assets/plugins/masked-input/masked-input.min.js"></script>

Official Link:
https://github.com/digitalBush/jquery.maskedinput

Password Strength Indicator and Generator

Required CSS File

<link rel="stylesheet" href="../assets/plugins/password-indicator/css/password-indicator.css" />

Required JS File

<script src="../assets/plugins/password-indicator/js/password-indicator.js"></script>

Official Link:
http://benjaminsterling.com/password-strength-indicator-and-generator/

Parsley Validation

Required CSS File

<link rel="stylesheet" href="../assets/plugins/parsley/src/parsley.css" />

Required JS File

<script src="../assets/plugins/parsley/dist/parsley.js"></script>

Official Link:
http://parsleyjs.org/index.html

bootstrap Wysihtml5

Required CSS File

<link rel="stylesheet" href="../assets/plugins/bootstrap-wysihtml5/dist/bootstrap3-wysihtml5.min.css" />

Required JS File

<script src="../assets/plugins/bootstrap-wysihtml5/dist/bootstrap3-wysihtml5.all.min.js"></script>

Official Link:
http://jhollingworth.github.io/bootstrap-wysihtml5/

CKEditor

Required JS File

<script src="../assets/plugins/ckeditor/ckeditor.js"></script>

Official Link:
http://ckeditor.com/

Bootstrap Wizard
(Dropped in v4.0)

Required CSS File

<link rel="stylesheet" href="../assets/plugins/bootstrap-wizard/css/bwizard.min.css" />

Required JS File

<script src="../assets/plugins/bootstrap-wizard/js/bwizard.js"></script>

Official Link:
https://github.com/gilluminate/Bootstrap-Wizard

Sparkline

Required JS File

<script src="../assets/plugins/sparkline/jquery.sparkline.min.js"></script>

Official Link:
http://omnipotent.net/jquery.sparkline/

DataTables v1.10.18
(Updated in V4.0.0)

Required CSS File

<link rel="stylesheet" href="../assets/plugins/DataTables/media/css/dataTables.bootstrap.min.css" />

Required JS File

<script src="../assets/plugins/DataTables/media/js/jquery.dataTables.js"></script>
<script src="../assets/plugins/DataTables/media/js/dataTables.bootstrap.min.js"></script>

Official Link:
http://www.datatables.net/

Extension:

- AutoFill
<link rel="stylesheet" href="../assets/plugins/DataTables/extensions/AutoFill/css/autoFill.bootstrap.min.css" />
<script src="../assets/plugins/DataTables/extensions/AutoFill/js/dataTables.autoFill.min.js"></script>
<script src="../assets/plugins/DataTables/extensions/AutoFill/js/autoFill.bootstrap.min.js"></script>
- Buttons
<link rel="stylesheet" href="../assets/plugins/DataTables/extensions/Buttons/css/buttons.bootstrap.min.css" />
<script src="../assets/plugins/DataTables/extensions/Buttons/js/dataTables.buttons.min.js"></script>
<script src="../assets/plugins/DataTables/extensions/Buttons/js/buttons.bootstrap.min.js"></script>
<script src="../assets/plugins/DataTables/extensions/Buttons/js/buttons.flash.min.js"></script>
<script src="../assets/plugins/DataTables/extensions/Buttons/js/jszip.min.js"></script>
<script src="../assets/plugins/DataTables/extensions/Buttons/js/pdfmake.min.js"></script>
<script src="../assets/plugins/DataTables/extensions/Buttons/js/vfs_fonts.min.js"></script>
<script src="../assets/plugins/DataTables/extensions/Buttons/js/buttons.html5.min.js"></script>
<script src="../assets/plugins/DataTables/extensions/Buttons/js/buttons.print.min.js"></script>
<script src="../assets/plugins/DataTables/extensions/Responsive/js/dataTables.responsive.min.js"></script>
- colReorder
<link rel="stylesheet" href="../assets/plugins/DataTables/extensions/ColReorder/css/colReorder.bootstrap.min.css" />
<script src="../assets/plugins/DataTables/extensions/ColReorder/js/dataTables.colReorder.min.js"></script>
- fixedColumns
<link rel="stylesheet" href="../assets/plugins/DataTables/extensions/FixedColumns/css/fixedColumns.bootstrap.min.css" />
<script src="../assets/plugins/DataTables/extensions/FixedColumns/js/dataTables.fixedColumns.min.js"></script>
- fixedHeader
<link rel="stylesheet" href="../assets/plugins/DataTables/extensions/FixedHeader/css/fixedHeader.bootstrap.min.css" />
<script src="../assets/plugins/DataTables/extensions/FixedHeader/js/dataTables.fixedHeader.min.js"></script>
- keyTable
<link rel="stylesheet" href="../assets/plugins/DataTables/media/css/dataTables.bootstrap.min.css" />
<link rel="stylesheet" href="../assets/plugins/DataTables/extensions/KeyTable/css/keyTable.bootstrap.min.css" />
<script src="../assets/plugins/DataTables/extensions/KeyTable/js/dataTables.keyTable.min.js"></script>
- Responsive
<link rel="stylesheet" href="../assets/plugins/DataTables/extensions/Responsive/css/responsive.bootstrap.min.css" />
<script src="../assets/plugins/DataTables/extensions/Responsive/js/dataTables.responsive.min.js"></script>
- rowReorder
<link rel="stylesheet" href="../assets/plugins/DataTables/extensions/RowReorder/css/rowReorder.bootstrap.min.css" />
<script src="../assets/plugins/DataTables/extensions/RowReorder/js/dataTables.rowReorder.min.js"></script>
- scroller
<link rel="stylesheet" href="../assets/plugins/DataTables/extensions/Scroller/css/scroller.bootstrap.min.css" />
<script src="../assets/plugins/DataTables/extensions/Scroller/js/dataTables.scroller.min.js"></script>
- select
<link rel="stylesheet" href="../assets/plugins/DataTables/extensions/Select/css/select.bootstrap.min.css" />
<script src="../assets/plugins/DataTables/extensions/Select/js/dataTables.select.min.js"></script>
Ion Range Slider

Required CSS File

<link rel="stylesheet" href="../assets/plugins/ionRangeSlider/css/ion.rangeSlider.css" />
<link rel="stylesheet" href="../assets/plugins/ionRangeSlider/css/ion.rangeSlider.skinnice.css" />

Required JS File

<script src="../assets/plugins/ionRangeSlider/js/ion-rangeSlider/ion.rangeSlider.min.js"></script>

Official Link:
http://ionden.com/a/plugins/ion.rangeSlider/en.html

Animate.css

Required CSS File

<link rel="stylesheet" href="../assets/plugins/animate/animate.min.css" />

Official Link:
http://daneden.github.io/animate.css/

jQuery Countdown

Required CSS File

<link rel="stylesheet" href="../assets/plugins/jquery.countdown/jquery.countdown.css" />

Required JS File

<script src="../assets/plugins/jquery.countdown/jquery.plugin.js"></script>
<script src="../assets/plugins/jquery.countdown/jquery.countdown.js"></script>

Official Link:
http://keith-wood.name/countdown.html

Zurb Email Template

Official Link:
http://zurb.com/ink/

jQuery Cookie
(Added in V1.2.0)

Required JS File

<script src="../assets/plugins/jquery-cookie/jquery.cookie.js"></script>

Official Link:
https://github.com/carhartl/jquery-cookie

Switchery
(Added in V1.2.0)

Required CSS File

<link rel="stylesheet" href="../assets/plugins/switchery/switchery.min.css" />

Required JS File

<script src="../assets/plugins/switchery/switchery.min.js"></script>

Official Link:
http://abpetkov.github.io/switchery/

Powerange
(Added in V1.2.0)

Required CSS File

<link rel="stylesheet" href="../assets/plugins/powerange/powerange.min.css" />

Required JS File

<script src="../assets/plugins/powerange/powerange.min.js"></script>

Official Link:
http://abpetkov.github.io/powerange/

X-Editable
(Added in V1.2.0)

Required CSS File

<link href="../assets/plugins/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet" />
<link href="../assets/plugins/bootstrap3-editable/inputs-ext/address/address.css" rel="stylesheet" />
<link href="../assets/plugins/bootstrap3-editable/inputs-ext/typeaheadjs/lib/typeahead.css" rel="stylesheet" />
<link href="../assets/plugins/bootstrap3-editable/inputs-ext/bootstrap-datepicker/css/datepicker.css" rel="stylesheet" />
<link href="../assets/plugins/bootstrap3-editable/inputs-ext/bootstrap-datepicker/css/datepicker3.css" rel="stylesheet" />
<link href="../assets/plugins/bootstrap3-editable/inputs-ext/bootstrap-datetimepicker/css/datetimepicker.css" rel="stylesheet" />
<link href="../assets/plugins/bootstrap3-editable/inputs-ext/select2/select2.css" rel="stylesheet" />
<link href="../assets/plugins/bootstrap3-editable/inputs-ext/bootstrap-wysihtml5/src/bootstrap-wysihtml5.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/bootstrap3-editable/js/bootstrap-editable.min.js"></script>
<script src="../assets/plugins/bootstrap3-editable/inputs-ext/address/address.js"></script>
<script src="../assets/plugins/bootstrap3-editable/inputs-ext/typeaheadjs/lib/typeahead.js"></script>
<script src="../assets/plugins/bootstrap3-editable/inputs-ext/typeaheadjs/typeaheadjs.js"></script>
<script src="../assets/plugins/bootstrap3-editable/inputs-ext/bootstrap-wysihtml5/wysihtml5.js"></script>
<script src="../assets/plugins/bootstrap3-editable/inputs-ext/bootstrap-wysihtml5/lib/js/wysihtml5-0.3.0.js"></script>
<script src="../assets/plugins/bootstrap3-editable/inputs-ext/bootstrap-wysihtml5/src/bootstrap-wysihtml5.js"></script>
<script src="../assets/plugins/bootstrap3-editable/inputs-ext/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<script src="../assets/plugins/bootstrap3-editable/inputs-ext/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script src="../assets/plugins/bootstrap3-editable/inputs-ext/select2/select2.min.js"></script>
<script src="../assets/plugins/mockjax/jquery.mockjax.js"></script>
<script src="../assets/plugins/moment/moment.min.js"></script>

Official Link:
http://vitalets.github.io/x-editable/

jQuery File Upload
(Added in V1.2.0)

Required CSS File

<link rel="stylesheet" href="../assets/plugins/jquery-file-upload/blueimp-gallery/blueimp-gallery.min.css" />
<link rel="stylesheet" href="../assets/plugins/jquery-file-upload/css/jquery.fileupload.css" />
<link rel="stylesheet" href="../assets/plugins/jquery-file-upload/css/jquery.fileupload-ui.css" />

Required JS File

<script src="../assets/plugins/jquery-file-upload/js/vendor/jquery.ui.widget.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/vendor/tmpl.min.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/vendor/load-image.min.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/vendor/canvas-to-blob.min.js"></script>
<script src="../assets/plugins/jquery-file-upload/blueimp-gallery/jquery.blueimp-gallery.min.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/jquery.iframe-transport.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/jquery.fileupload.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/jquery.fileupload-process.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/jquery.fileupload-image.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/jquery.fileupload-audio.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/jquery.fileupload-video.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/jquery.fileupload-validate.js"></script>
<script src="../assets/plugins/jquery-file-upload/js/jquery.fileupload-ui.js"></script>
<!--[if (gte IE 8)&(lt IE 10)]>
    <script src="../assets/plugins/jquery-file-upload/js/cors/jquery.xdr-transport.js"></script>
<![endif]-->

Official Link:
http://blueimp.github.io/jQuery-File-Upload/

jQuery-Knob
(Added in V1.2.0)

Required JS File

<script src="../assets/plugins/jquery-knob/js/jquery.knob.js"></script>

Official Link:
http://anthonyterrien.com/knob/

Simple Line Icons
(Added in V1.3.0)

Required CSS File

<link rel="stylesheet" href="../assets/plugins/simple-line-icons/simple-line-icons.css" />

Official Link:
http://graphicburger.com/simple-line-icons-webfont/

Morris Chart
(Added in V1.3.0)

Required CSS File

<link rel="stylesheet" href="../assets/plugins/morris/morris.css" />

Required JS File

<script src="../assets/plugins/morris/raphael.min.js"></script>
<script src="../assets/plugins/morris/morris.js"></script>

Official Link:
http://morrisjs.github.io/morris.js/index.html

Superbox
(Added in V1.3.0)

Required CSS File

<link href="../assets/plugins/superbox/css/superbox.min.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/superbox/js/superbox.js"></script>

Official Link:
http://toddmotto.com/introducing-superbox-the-reimagined-lightbox-gallery/

Chart JS
(Added in V1.6.0)

Required JS File

<script src="../assets/plugins/chart-js/chart.js"></script>

Official Link:
http://www.chartjs.org/

JS Tree
(Added in V1.7.0)

Required CSS File

<link href="../assets/plugins/jstree/dist/themes/default/style.min.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/jstree/dist/jstree.min.js"></script>

Official Link:
http://www.jstree.com/

Bootstrap Date Range Picker
(Added in V1.7.0)

Required CSS File

<link href="../assets/plugins/jstree/dist/themes/default/style.min.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/bootstrap-daterangepicker/moment.js"></script>
<script src="../assets/plugins/bootstrap-daterangepicker/daterangepicker.js"></script>

Official Link:
https://github.com/dangrossman/bootstrap-daterangepicker

Select 2
(Added in V1.7.0)

Required CSS File

<link href="../assets/plugins/select2/dist/css/select2.min.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/select2/dist/js/select2.min.js"></script>

Official Link:
https://select2.github.io/

Flat Icon
(Added in V1.7.0)

Required CSS File

<link href="../assets/plugins/flag-icon/css/flag-icon.css" rel="stylesheet" />

Official Link:
https://github.com/lipis/flag-icon-css

Bootstrap DateTime Picker
(Added in V1.8.0)

Required CSS File

<link href="../assets/plugins/bootstrap-eonasdan-datetimepicker/build/css/bootstrap-datetimepicker.min.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/bootstrap-eonasdan-datetimepicker/build/js/bootstrap-datetimepicker.min.js"></script>

Official Link:
http://eonasdan.github.io/bootstrap-datetimepicker/

Chart d3
(Added in V1.9.0)

Required CSS File

<link href="../assets/plugins/nvd3/build/nv.d3.css" rel="stylesheet" />

Required JS File

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.2/d3.min.js"></script>
<script src="../assets/plugins/nvd3/build/nv.d3.js"></script>

Official Link:
http://nvd3.org/

Boostrap Social
(Added in V2.1.0)

Required CSS File

<link href="../assets/plugins/bootstrap-social/bootstrap-social.css" rel="stylesheet" />

Official Link:
https://lipis.github.io/bootstrap-social/

Intro JS
(Added in V2.1.0)

Required CSS File

<link href="../assets/plugins/intro-js/introjs.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/intro-js/intro.js"></script>

Official Link:
http://introjs.com/

Bootstrap Color Palette
(Added in V2.1.0)

Required CSS File

<link href="../assets/plugins/bootstrap-colorpalette/css/bootstrap-colorpalette.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/bootstrap-colorpalette/js/bootstrap-colorpalette.js"></script>

Official Link:
https://github.com/extremeFE/bootstrap-colorpalette

jQuery Simple Color Picker
(Added in V2.1.0)

Required CSS File

<link href="../assets/plugins/jquery-simplecolorpicker/jquery.simplecolorpicker.css" rel="stylesheet" />
<link href="../assets/plugins/jquery-simplecolorpicker/jquery.simplecolorpicker-fontawesome.css" rel="stylesheet" />
<link href="../assets/plugins/jquery-simplecolorpicker/jquery.simplecolorpicker-glyphicons.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/jquery-simplecolorpicker/jquery.simplecolorpicker.js"></script>

Official Link:
https://github.com/tkrotoff/jquery-simplecolorpicker

Bootstrap Show Password
(Added in V2.1.0)

Required JS File

<script src="../assets/plugins/bootstrap-show-password/bootstrap-show-password.js"></script>

Official Link:
https://github.com/wenzhixin/bootstrap-show-password

Dropzone
(Added in V2.1.0)

Required CSS File

<link href="../assets/plugins/dropzone/min/dropzone.min.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/dropzone/min/dropzone.min.js"></script>

Official Link:
http://www.dropzonejs.com/

Summernote
(Added in V2.1.0)

Required CSS File

<link href="../assets/plugins/summernote/summernote.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/summernote/summernote.min.js"></script>

Official Link:
http://summernote.org/

Bootstrap SweetAlert
(Added in V3.0.0)

Required JS File

<script src="../assets/plugins/bootstrap-sweetalert/sweetalert.min.js"></script>

Official Link:
https://lipis.github.io/bootstrap-sweetalert/

clipboard.js
(Added in V3.0.0)

Required JS File

<script src="../assets/plugins/clipboard/clipboard.min.js"></script>

Official Link:
https://clipboardjs.com/

jQuery Smart Wizards
(Added in V4.0.0)

Required CSS File

<link href="../assets/plugins/jquery-smart-wizard/src/css/smart_wizard.css" rel="stylesheet" />

Required JS File

<script src="../assets/plugins/jquery-smart-wizard/src/js/jquery.smartWizard.js"></script>

Official Link:
http://techlaboratory.net/smartwizard

Highlight JS
(Added in V4.0.0)

Required JS File

<script src="../assets/plugins/highlight/highlight.common.js"></script>

Official Link:
https://highlightjs.org/

I've used the following images, icons or other files as listed.

jQuery Plugins

  1. jvectormap:http://jvectormap.com/
  2. jQuery slimScroll:http://rocha.la/jQuery-slimScroll
  3. flot charts:http://www.flotcharts.org/
  4. fullcalendar:http://arshaw.com/fullcalendar/
  5. Gritter:http://boedesign.com/blog/2009/07/11/growl-for-jquery-gritter/
  6. Isotope:http://isotope.metafizzy.co/
  7. Lightbox 2:http://lokeshdhakar.com/projects/lightbox2/
  8. Bootstrap Datepicker:http://bootstrap-datepicker.readthedocs.org/en/release/
  9. Bootstrap Timepicker:http://jdewit.github.io/bootstrap-timepicker/
  10. Bootstrap Colorpicker:http://www.eyecon.ro/bootstrap-colorpicker
  11. Bootstrap ComboBox:https://github.com/danielfarrell/bootstrap-combobox
  12. Bootstrap Select:http://silviomoreto.github.io/bootstrap-select/
  13. Masked Input:http://digitalbush.com/projects/masked-input-plugin/
  14. Password Strength Indicator and Generator:http://benjaminsterling.com/password-strength-indicator-and-generator/
  15. Parsley:http://parsleyjs.org/index.html
  16. Bootstrap WYSIHTML5:http://jhollingworth.github.io/bootstrap-wysihtml5/
  17. CKEditor:http://ckeditor.com/
  18. Bootstrap Wizard:https://github.com/gilluminate/Bootstrap-Wizard
  19. Sparkline:http://omnipotent.net/jquery.sparkline/
  20. Table Data:http://datatables.net/blog/Twitter_Bootstrap_2
  21. Ion Range Slider:http://ionden.com/a/plugins/ion.rangeSlider/en.html
  22. jQuery Tag It:http://aehlke.github.io/tag-it/
  23. jQuery Countdown:http://keith-wood.name/countdown.html
  24. Zurb Email Template:http://zurb.com/ink/
  25. jQuery Cookie:https://github.com/carhartl/jquery-cookie
  26. Switchery:http://abpetkov.github.io/switchery/
  27. Powerange:http://abpetkov.github.io/powerange/
  28. X-Editable :http://vitalets.github.io/x-editable/
  29. jQuery File Upload :http://blueimp.github.io/jQuery-File-Upload/
  30. jQuery-Knob:http://anthonyterrien.com/knob/
  31. Simple Line Icons:http://graphicburger.com/simple-line-icons-webfont/
  32. Morris Chart:http://morrisjs.github.io/morris.js/index.html
  33. Superbox:http://toddmotto.com/introducing-superbox-the-reimagined-lightbox-gallery/
  34. Chart JS:http://www.chartjs.org/
  35. JS Tree:http://www.jstree.com/
  36. Bootstrap Date Range Picker:https://github.com/dangrossman/bootstrap-daterangepicker
  37. Select2:https://select2.github.io/
  38. Flag Icon:https://github.com/lipis/flag-icon-css
  39. Bootstrap Date Time Picker:http://eonasdan.github.io/bootstrap-datetimepicker/
  40. NVD3:http://nvd3.org/
  41. Bootstrap Social:https://lipis.github.io/bootstrap-social/
  42. Intro JS:http://introjs.com/
  43. Bootstrap Color Palette:https://github.com/extremeFE/bootstrap-colorpalette
  44. jQuery Simple Color Picker:https://github.com/tkrotoff/jquery-simplecolorpicker
  45. Bootstrap Show Password:https://github.com/wenzhixin/bootstrap-show-password>
  46. Dropzone:http://www.dropzonejs.com/
  47. Summernote:http://summernote.org/
  48. Bootstrap SweetAlert:https://lipis.github.io/bootstrap-sweetalert/
  49. clipboard.js:https://clipboardjs.com/
  50. jQuery Smart Wizards:http://techlaboratory.net/smartwizard
  51. Highlight JS:https://highlightjs.org/
Version 4.3.0 - 16 September 2019
  • NEW: React JS Version
  • NEW: Facebook Design
  • NEW: Startup Page for Facebook Design
  • UPGRADE: Bootstrap 4.2.1
  • UPGRADE: FontAwesome 5.7.0
  • UPGRADE: Angular 7.0
  • FIX: Laravel missing variable
  • FIX: Bootstrap dropdown click
Version 4.2.0 - 16 September 2018
  • NEW: Vue Version
  • NEW: Startup Page for HTML / APPLE / MATERIAL / ANGULAR / ANGULAR 6 / LARAVEL / VUE
  • NEW: Angular JS 6 Sidebar Scroll Memory
  • NEW: Angular JS 6 Full Version Page Options
  • NEW: Angular JS 6 Panel Component
  • NEW: Angular JS 6 Ngx DataTables
  • UPGRADE: E-Commerce / Blog / Forum / One Page Parallax to Bootstrap 4
  • UPGRADE: Bootstrap v4.1.3
  • UPGRADE: jQuery v3.3.1
  • UPGRADE: FontAwesome v5.3.1
  • UPGRADE: Ionicons v4.0
  • UPGRADE: Summernote v0.8.10
  • UPGRADE: jQuery Smart Wizard v4.3.1
  • UPGRADE: Select2 v4.0.5
  • UPGRADE: Parsley JS v2.8.1
  • UPGRADE: Moment v2.22.2
  • UPGRADE: Lity v2.3.1
  • UPGRADE: Lightbox2 v2.10.0
  • UPGRADE: Jstree v3.3.5
  • UPGRADE: jQuery-mockjax v2.4.0
  • UPGRADE: jQuery Knob 1.2.11
  • UPGRADE: IonRangeSlider v2.2.0
  • UPGRADE: Intro JS v2.9.0
  • UPGRADE: FullCalendar v3.9.0
  • UPGRADE: Bootstrap Eonasdan Datetimepicker v4.17.47
  • UPGRADE: Dropzone v5.3.0
  • UPGRADE: DataTables v1.10.18
  • UPGRADE: DataTables Extension - AutoFill v2.3.0
  • UPGRADE: DataTables Extension - Buttons v1.5.2
  • UPGRADE: DataTables Extension - ColReorder v1.5.0
  • UPGRADE: DataTables Extension - FixedColumns v3.2.5
  • UPGRADE: DataTables Extension - FixedHeader v3.1.4
  • UPGRADE: DataTables Extension - JSZip v2.5.0
  • UPGRADE: DataTables Extension - KeyTable v2.4.0
  • UPGRADE: DataTables Extension - PDFMake v0.1.36
  • UPGRADE: DataTables Extension - Responsive v2.2.2
  • UPGRADE: DataTables Extension - RowReorder v1.2.4
  • UPGRADE: DataTables Extension - Scroller v1.5.0
  • UPGRADE: DataTables Extension - Select v1.2.6
  • UPGRADE: NVD3 v1.8.6
  • UPGRADE: D3 v3.5.17
  • UPGRADE: Clipboard JS v2.0.1
  • UPGRADE: Chart JS v2.7.2
  • UPGRADE: WYSIHTML5 v0.3.3
  • UPGRADE: Bootstrap Timepicker v0.5.2
  • UPGRADE: Bootstrap Daterangepicker v3.0.3
  • UPGRADE: Bootstrap Datepicker v1.8.0
  • UPGRADE: Boostrap Color Picker v2.5.2
  • UPGRADE: blueImp Gallery v2.33.0
  • UPGRADE: jQuery File Upload v9.22.0
  • UPGRADE: Bootstrap Select v1.13.1
  • ENHANCE: Remove all mixed space / tabs
  • FIX: Login / Register V3 Mobile Scrolling Issue
  • FIX: Slimscroll Unable to scroll on page load
  • FIX: Angular JS 6 Minified Sidebar Sub Menu
  • FIX: Boxed Layout with Fixed Minified Sidebar
Version 4.1.1 - 03 June 2018
  • FIX: Angular 6 version
  • FIX: Swal Notification Transparent Version
    • Modified File: style.css
    • Modified File: style.min.css
  • FIX: Summernote Transparent Version
    • Modified File: style.css
    • Modified File: style.min.css
  • FIX: Page with Two Sidebar RTL Mode
    • Modified File: style.css
    • Modified File: style.min.css
  • FIX: Compatibility Two Sidebar with Wide Sidebar
    • Modified File: style.css
    • Modified File: style.min.css
  • FIX: IE11 Invalid / valid tooltip styling
    • Modified File: style.css
    • Modified File: style.min.css
  • FIX: IE11 Full Height Options
    • Modified File: style.css
    • Modified File: style.min.css
  • FIX: IE11 Dashboard v2
    • Modified File: style.css
    • Modified File: style.min.css
Version 4.1.0 - 28 May 2018
  • NEW: Widgets Page
    • Added files: widget.html
  • NEW: RTL Support
    • Modified files: /assets/css/default/style.css
    • Modified files: /assets/css/default/style.min.css
  • NEW: SCSS Support
    • Added directories: /assets/less
  • NEW: 6 Color Theme
    • Added files: /assets/css/default/theme/aqua.css
    • Added files: /assets/css/default/theme/pink.css
    • Added files: /assets/css/default/theme/yellow.css
    • Added files: /assets/css/default/theme/indigo.css
    • Added files: /assets/css/default/theme/green.css
    • Added files: /assets/css/default/theme/lime.css
  • NEW: 6 Color Theme for Alert, Button, Label, Badge, Note
    • Modified files: ui_general.html
    • Modified files: ui_buttons.html
    • Modified files: /assets/css/default/style.css
    • Modified files: /assets/css/default/style.min.css
  • NEW: CSS Form Switcher with 12 Color Themes
    • Modified files: form_elements.html
    • Modified files: /assets/css/default/style.css
    • Modified files: /assets/css/default/style.min.css
  • UPDATE: Bootstrap 4.1.1
    • Updated Directory: /assets/plugins/bootstrap/
  • UPDATE: FontAwesome 5.0.13
    • Updated Directory: /assets/plugins/fontawesome/
  • UPDATE: Laravel 5.6
    • Modified files: composer.json
  • UPDATE: Angular 6
  • FIX: FullCalendar table header alignment issue
    • Modified File: style.css
    • Modified File: style.min.css
  • FIX: Minified Sidebar for expanded profile menu
    • Modified File: style.css
    • Modified File: style.min.css
Version 4.0.0 - 01 March 2018
  • NEW: Transparent Design
    • Added files: template_transparent
  • NEW: Angular Laravel Version
    • Added files: template_laravel
  • NEW: Angular JS 5 Version
    • Added files: template_angularjs5
  • NEW: Profile Page
    • Updated HTML files: extra_profile.html
    • Modified File: style.css
    • Modified File: style.min.css
  • NEW: Email Inbox Page
    • Updated HTML files: email_inbox.html
    • Modified File: style.css
    • Modified File: style.min.css
  • NEW: Email Detail Page
    • Updated HTML files: email_detail.html
    • Modified File: style.css
    • Modified File: style.min.css
  • NEW: Email Compose Page
    • Updated HTML files: email_compose.html
    • Modified File: style.css
    • Modified File: style.min.css
  • NEW: jQuery Smart Wizard
    • Updated HTML files: form_wizards.html
    • Added PLUGINS files: /assets/plugins/jquery-smart-wizard/
  • NEW: Highlight JS
    • Added PLUGINS files: /assets/plugins/highlight/
  • NEW: Minified Submenu Support for Fixed Sidebar
    • Modified File: style.css
    • Modified File: style.min.css
    • Modified File: apps.js
    • Modified File: apps.min.css
  • NEW: Bootstrap 3 & 4 Support
    • Modified File: style.css
    • Modified File: style.min.css
    • Modified File: apps.js
    • Modified File: apps.min.css
  • NEW: LESS Support for Apple & Transparent Design
    • Added Files: /assets/less/apple
    • Added Files: /assets/less/transparent
  • ENHANCE: Overall UI Enhancement
    • Modified File: style.css
    • Modified File: style.min.css
  • ENHANCE: Standardize File structure
    • Modified Path: /assets
  • ENHANCE: Ajax Version
    • Modified File: apps.js
    • Modified File: apps.min.css
  • UPDATE: jQuery 3.x
    • Updated Directory: /assets/plugins/jquery/
  • UPDATE: Bootstrap 4.0
    • Updated Directory: /assets/plugins/bootstrap/
  • UPDATE: FontAwesome 5.0
    • Updated Directory: /assets/plugins/font-awesome/
  • UPDATE: DataTables 1.10.10
    • Updated Directory: /assets/plugins/DataTables/
Version 3.0.0 - 23 July 2017
  • NEW: Apple Design
    • Added files: template_content_apple
  • NEW: Angular JS 4
    • Added files: template_content_angularjs4
  • NEW: Boostrap 4 Support
    • Added HTML files: bootstrap_4.html
    • Added CSS files: /assets/css/style-bs4.css
    • Added CSS files: /assets/css/style-bs4.min.css
    • Added PLUGINS files: /assets/plugins/bootstrap4/
  • NEW: CSS Checkbox & Radiobutton
    • Modified File: style.css
    • Modified File: style.min.css
  • NEW: clipboard.js
    • Updated HTML files: form_plugins.html
    • Added PLUGINS files: /assets/plugins/clipboard/
  • NEW: Bootstrap SweetAlert.js
    • Updated HTML files: ui_modal_notification.html
    • Added PLUGINS files: /assets/plugins/bootstrap-sweetalert/
  • ENHANCE: Angular JS Mobile Sidebar AutoClose
    • Modified File: apps.js
    • Modified File: apps.min.js
  • ENHANCE: Angular JS 4 Mobile Sidebar AutoClose
    • Modified File: apps.js
    • Modified File: apps.min.js
  • ENHANCE: Ajax Version Mobile Sidebar AutoClose
    • Modified File: apps.js
    • Modified File: apps.min.js
  • ENHANCE: Add listener after panel reposition
    • Modified File: apps.js
    • Modified File: apps.min.js
  • ENHANCE: Form Plugins UI Enhancement
    • Modified File: style.css
    • Modified File: style.min.css
  • FIX: Sidebar Transparent Overflow Issue
    • Modified File: style.css
    • Modified File: style.min.css
  • FIX: IE8 Datetimcpicker
    • Modified File: form-plugins.demo.js
    • Modified File: form-plugins.demo.min.js
  • FIX: Login v1 Overflow Issue
    • Modified File: style.css
    • Modified File: style.min.css
Version 2.2.0 - 04 January 2017
  • FIX: Downloaded File Unable to Extract
    • Removed File: template_content_angularjs2/node_modules
Version 2.1.0 - 30 November 2016
  • NEW: Angular JS 2
    • Added files: template_content_angularjs2
  • NEW: LESS File for Material Design
    • Added files: template_content_material/assets/less/
  • NEW: Bootstrap Color Palette
    • Updated HTML files: form_plugins.html
    • Added PLUGINS files: /assets/plugins/bootstrap-colorpalette/
  • NEW: Bootstrap Social
    • Added HTML files: ui_social_buttons.html
    • Added PLUGINS files: /assets/plugins/bootstrap-social/
  • NEW: Intro JS
    • Added HTML files: ui_tour.html
    • Added PLUGINS files: /assets/plugins/introjs/
  • NEW: jQuery Simple Color Picker
    • Updated HTML files: form_plugins.html
    • Added PLUGINS files: /assets/plugins/jquery-simplecolorpicker/
  • NEW: Bootstrap Show Password
    • Updated HTML files: form_plugins.html
    • Added PLUGINS files: /assets/plugins/bootstrap-show-password/
  • NEW: Dropzone
    • Added HTML files: form_dropzone.html
    • Added PLUGINS files: /assets/plugins/dropzone/
  • NEW: Summernote
    • Added HTML files: form_summernote.html
    • Added PLUGINS files: /assets/plugins/summernote/
  • UPDATE: Bootstrap 3.3.7
    • Updated Directory: /assets/plugins/bootstrap/
  • UPDATE: Font Awesome 4.7.0
    • Updated Directory: /assets/plugins/font-awesome/
  • UPDATE: Colorpicker 2.3.2
    • Updated Directory: /assets/plugins/bootstrap-colorpicker/
  • UPDATE: Bootstrap Combobox 1.1.7
    • Updated Directory: /assets/plugins/bootstrap-combobox/
  • UPDATE: Bootstrap Datepicker 1.6.1
    • Updated Directory: /assets/plugins/bootstrap-datepicker/
  • UPDATE: Bootstrap Daterangepicker 2.1.24
    • Updated Directory: /assets/plugins/bootstrap-daterangepicker/
  • UPDATE: Bootstrap Datetimepicker
    • Updated Directory: /assets/plugins/bootstrap-datetimepicker/
  • UPDATE: Bootstrap Eonasdan Datetimepicker 4.17.37
    • Updated Directory: /assets/plugins/bootstrap-eonasdan-datetimepicker/
  • UPDATE: Bootstrap Tags Input 0.8.0
    • Updated Directory: /assets/plugins/bootstrap-tagsinput/
  • UPDATE: Bootstrap XEditable 1.5.1
    • Updated Directory: /assets/plugins/bootstrap3-editable/
  • DROP: Bootstrap WYSIHTML5 and replaced with WYSIHTML5 Bootstrap3
    • New Directory: /assets/plugins/bootstrap-wysihtml5/
  • UPDATE: Chart JS 2.0.0
    • Updated Directory: /assets/plugins/chart-js/
  • UPDATE: Flag Icon 2.4.0
    • Updated Directory: /assets/plugins/flag-icon/
  • UPDATE: Flot Chart 0.8.3
    • Updated Directory: /assets/plugins/flot/
  • UPDATE: Fullcalendar 2.9.1
    • Updated Directory: /assets/plugins/fullcalendar/
  • UPDATE: Ionicon 2.0.1
    • Updated Directory: /assets/plugins/ionicon/
  • UPDATE: Ion Range Slider 2.1.4
    • Updated Directory: /assets/plugins/ionRangeSlider/
  • UPDATE: jQuery File Upload
    • Updated Directory: /assets/plugins/jquery-file-upload/
  • UPDATE: jVector Map 2.0.3
    • Updated Directory: /assets/plugins/jquery-jvectormap/
  • UPDATE: jQuery Countdown 2.0.2
    • Updated Directory: /assets/plugins/jquery.countdown/
  • UPDATE: jsTree 3.3.2
    • Updated Directory: /assets/plugins/jstree/
  • UPDATE: LESS 2.7.1
    • Updated Directory: /assets/plugins/less/
  • UPDATE: Lightbox 2.8.2
    • Updated Directory: /assets/plugins/lightbox/
  • UPDATE: Masked Input 1.4.1
    • Updated Directory: /assets/plugins/masked-input/
  • UPDATE: Morris Chart 0.5.1
    • Updated Directory: /assets/plugins/morris/
  • UPDATE: NVD3 1.8.4
    • Updated Directory: /assets/plugins/nvd3/
  • UPDATE: Parsley 2.4.4
    • Updated Directory: /assets/plugins/parsley/
  • UPDATE: Simple Line Icons 2.3.2
    • Updated Directory: /assets/plugins/simple-line-icons/
  • UPDATE: Slimscroll 1.3.8
    • Updated Directory: /assets/plugins/slimscroll/
  • FIX: Material Version Inverse Header
    • Modified File: style.css
    • Modified File: style.min.css
  • FIX: Table Manage Combination PDF button not working
    • Modified File: table_manage_combine.html
  • FIX: Material Version icons rendering problem in mobile device
    • Modified File: table_manage_combine.html
  • FIX: Missing Profile / Invoice / Calendar page styling for LESS
    • Modified File: /assets/less/
  • FIX: Login V1 / V2 styling overflow
    • Modified File: style.css
    • Modified File: style.min.css
  • ENHANCEMENT: Minor UI Enhancement
    • Modified File: style.css
    • Modified File: style.min.css
Version 2.0.0 - 30 April 2016
  • NEW: Material Design Version
    • Added files: template_content_material
  • UPDATE: Bootstrap 3.3.6
    • Updated Directory: /assets/plugins/bootstrap/
  • UPDATE: FontAwesome 4.6.1
    • Updated Directory: /assets/plugins/font-awesome/
  • UPDATE: Angular Js 1.5.5 (stable version)
    • Updated Directory: /assets/plugins/angularjs/
  • UPDATE: Fullcalendar 2.0
    • Updated Directory: /assets/plugins/fullcalendar/
  • UPDATE: DataTable 1.10.10
    • Updated Directory: /assets/plugins/fullcalendar/
  • FIX: Angular Version Panel Dragging Issue
    • Modified File: /assets/js/apps.js
  • FIX: Angular Version Page Height Issue
    • Modified File: /assets/css/style.css
    • Modified File: /assets/css/style.min.css
  • FIX: Select 2 Overflow Issue
    • Modified File: /assets/css/style.css
    • Modified File: /assets/css/style.min.css
  • FIX: DataTables Buttons Extension Issue
    • Modified File: /assets/plugins/DataTables/
  • FIX: Full Height Page Panel Expand Issue
    • Modified File: /assets/css/style.css
    • Modified File: /assets/css/style.min.css
  • FIX: Slider & Switchery Options
    • Modified File: /assets/js/form-slider-switcher.demo.js
    • Modified File: /assets/js/form-slider-switcher.demo.min.js
  • FIX: Page Loader z-index Issue
    • Modified File: /assets/js/form-slider-switcher.demo.js
    • Modified File: /assets/js/form-slider-switcher.demo.min.js
  • FIX: Spinner Margin Issue
    • Modified File: /assets/css/style.css
    • Modified File: /assets/css/style.min.css
Version 1.9.0 - 05 October 2015
  • NEW: Angular JS Version
    • Added files: template_content_angularjs
  • NEW: NVD3 Chart
    • Added HTML files: chart_d3.html
    • Added PLUGINS files: /assets/plugins/nvd3/
  • NEW: Page with Top Menu
    • Added HTML files: page_with_top_menu.html
    • Modified CSS files: /assets/css/style.css and /assets/css/style.min.css
    • Modified JS files: /assets/js/apps.js and /assets/js/apps.min.js
  • NEW: Boxed Layout
    • Added HTML files: page_with_boxed_layout.html
    • Modified CSS files: /assets/css/style.css and /assets/css/style.min.css
    • Modified JS files: /assets/js/apps.js and /assets/js/apps.min.js
  • NEW: Page with Mixed Menu
    • Added HTML files: page_with_mixed_menu.html
    • Modified CSS files: /assets/css/style.css and /assets/css/style.min.css
    • Modified JS files: /assets/js/apps.js and /assets/js/apps.min.js
  • NEW: Boxed Layout with Mixed Menu
    • Added HTML files: page_boxed_layout_with_mixed_menu.html
    • Modified CSS files: /assets/css/style.css and /assets/css/style.min.css
    • Modified JS files: /assets/js/apps.js and /assets/js/apps.min.js
  • NEW: Transparent Sidebar
    • Added HTML files: page_with_transparent_sidebar.html
    • Modified CSS files: /assets/css/style.css and /assets/css/style.min.css
    • Modified JS files: /assets/js/apps.js and /assets/js/apps.min.js
  • NEW: DataTables Extension - RowReorder
    • Added HTML files: table_manage_rowreorder.html
    • Modified CSS files: /assets/css/style.css and /assets/css/style.min.css
    • Modified JS files: /assets/js/apps.js and /assets/js/apps.min.js
  • NEW: DataTables Extension - Select
    • Added HTML files: table_manage_select.html
    • Modified CSS files: /assets/css/style.css and /assets/css/style.min.css
    • Modified JS files: /assets/js/apps.js and /assets/js/apps.min.js
  • UPDATE: DataTables Version - 1.10.9
    • Updated Plugins files: /assets/DataTables
  • ENHANCED: Color Admin Apps.js
    • Modified JS files: /assets/js/apps.js and /assets/js/apps.min.js
Version 1.8.0 - 30 June 2015
  • NEW: Bootstrap Date Time Picker
    • Modified HTML files: form_plugins.html
    • Added PLUGINS files: /assets/plugins/bootstrap-eonasdan-datetimepicker/
  • NEW: Full Color Panel
    • Modified HTML files: ui_widget_boxes.html
    • Modified CSS files: /assets/css/style.css
    • Modified CSS files: /assets/css/style.min.css
  • FIX: Login Page v2 Background in Large Screen (> 1920px)
    • Modified CSS files: /assets/css/style.css
    • Modified CSS files: /assets/css/style.min.css
  • FIX: Page Sidebar Expand / Collapse Height Rendering
    • Modified JS files: /assets/js/apps.js
    • Modified JS files: /assets/js/apps.min.js
  • FIX: Page Sidebar Scrollbar Touch Event in Tablet Device
    • Modified JS files: /assets/js/apps.js
    • Modified JS files: /assets/js/apps.min.js
  • FIX: Clearfix Mixin Crashed with Bootstrap Mixin
    • Updated File: /assets/less/_mixins.less
  • UPDATE: Include Bootstrap LESS
    • Updated Directory: /assets/less/bootstrap/
  • UPDATE: Bootstrap 3.3.4 to Bootstrap 3.3.5
    • Updated Directory: /assets/plugins/bootstrap/
  • UPDATE: Less 1.7.4 to Less 2.5.1
    • Updated Directory: /assets/plugins/less/
Version 1.7.0 - 1 May 2015
  • NEW: Tree View
    • Added HTML files: ui_tree.html
    • Added PLUGINS files: /assets/plugins/jstree/
  • NEW: Language Bar & Icon List
    • Added HTML files: ui_language_bar_icon.html
    • Added PLUGINS files: /assets/plugins/flag-icon/
  • NEW: Bootstrap Date Range Picker
    • Updated HTML files: form_plugins.html
    • Added PLUGINS files: /assets/plugins/bootstrap-daterangepicker/
  • NEW: Select2
    • Updated HTML files: form_plugins.html
    • Added PLUGINS files: /assets/plugins/select2/
  • NEW: Top Navbar Mega Menu
    • Added HTML files: page_with_mega_menu.html
  • NEW: Login & Register Page v3
    • Added HTML files: login_v3.html
    • Added HTML files: register_v3.html
  • NEW: Profile Page
    • Added HTML files: extra_profile.html
  • NEW: Light Sidebar
    • Added HTML files: page_with_light_sidebar.html
    • Modified CSS files: /assets/css/style.css and /assets/css/style.min.css
  • NEW: Wide Sidebar
    • Added HTML files: page_with_wide_sidebar.html
    • Modified CSS files: /assets/css/style.css and /assets/css/style.min.css
  • NEW: Mobile View Scrollbar
    • Modified JS files: /assets/js/apps.js and /assets/css/apps.min.js
  • NEW: Mobile View Minified Sidebar Scrollbar
    • Modified JS files: /assets/js/apps.js and /assets/css/apps.min.js
  • UPDATE: Bootstrap 3.3.3 to Bootstrap 3.3.4
    • Updated Directory: /assets/plugins/bootstrap/
  • FIX: Multi Level Menu Bugfix
    • Modified CSS files: /assets/css/style.css and /assets/css/style.min.css
  • FIX: Ajax Version Coming Soon Page
    • Modified HTML files: /assets/js/coming-soon.demo.js and /assets/js/coming-soon.demo.min.js
  • FIX: Ajax Version href="#" rendering error
    • Modified HTML files: /assets/js/apps.js and /assets/js/apps.min.js
Version 1.6.0 - 23 January 2015
  • NEW: Managed Table - Extension Combination
    • Added HTML: table_mange_combine.html
  • NEW: Chart JS
    • Added HTML: chart_js.html
    • Added PLUGINS: assets/plugins/assets/chart-js/
  • NEW: Ajax Documentation
    • Updated Directory: documentation/
  • UPDATE: Bootstrap 3.3.1 to Bootstrap 3.3.2
    • Updated Directory: /assets/plugins/bootstrap/
  • UPDATE: FontAwesome 4.2.0 to Bootstrap 4.3.0
    • Updated Directory: /assets/plugins/font-awesome/
  • FIX: IE 8 - IE 10 Full Height Page
    • Modified Directory files: /assets/js/apps.js
    • Modified Directory files: /assets/js/apps.min.js
  • FIX: Mobile Sidebar Toggle Button
    • Modified Directory files: /assets/js/apps.js
    • Modified Directory files: /assets/js/apps.min.js
  • FIX: Tab Inverse Hover
    • Modified Directory files: /assets/css/style.css
    • Modified Directory files: /assets/css/style.min.css
  • FIX: IE10 Sidebar Menu
    • Modified Directory files: /assets/css/style.css
    • Modified Directory files: /assets/css/style.min.css
  • FIX: Minified Sidebar Multiple Level Menu
    • Modified Directory files: /assets/css/style.css
    • Modified Directory files: /assets/css/style.min.css
Version 1.5.0 - 30 November 2014
  • NEW: AJAX Version
    • New Directory files: /template_content_ajax
    • New Directory files: /template_content_ajax
  • NEW: Color Scheme (Black)
    • Modified CSS files: /assets/css/style.css
    • Modified CSS files: /assets/css/style.min.css
  • NEW: Sidebar Color Scheme (Gradient)
    • Modified CSS files: /assets/css/theme/default.css
    • Modified CSS files: /assets/css/theme/blue.css
    • Modified CSS files: /assets/css/theme/red.css
    • Modified CSS files: /assets/css/theme/orange.css
    • Modified CSS files: /assets/css/theme/purple.css
    • Modified CSS files: /assets/css/theme/black.css
  • NEW: Local Storage Panel Position
    • Modified Directory files: /assets/js/apps.js
    • Modified Directory files: /assets/js/apps.min.js
  • NEW: Ionicons
    • Added HTML files: ui_ionicons.html
    • Added HTML files: page_with_ionicons.html
    • Added PLUGINS files: /assets/plugins/ionicons/
  • NEW: DataTables Plugins
    • Added HTML files: table_manage_autofill.html
    • Added HTML files: table_manage_colreorder.html
    • Added HTML files: table_manage_colvis.html
    • Added HTML files: table_manage_fixed_columns.html
    • Added HTML files: table_manage_fixed_header.html
    • Added HTML files: table_manage_keytable.html
    • Added HTML files: table_manage_responsive.html
    • Added HTML files: table_manage_scroller.html
    • Added HTML files: table_manage_tabletools.html
    • Updated PLUGINS files: /assets/plugins/DataTables/
  • NEW: Pace Loader Plugins
    • Modified HTML files: all html files
    • Added PLUGINS files: /assets/plugins/pace/
  • UPDATE: Bootstrap 3.2.0 to Bootstrap 3.3.1
    • Modified Directory files: /assets/plugins/bootstrap-3.2.0/ to /assets/plugins/bootstrap/
    • Modified CSS Files: /assets/plugins/bootstrap/css/bootstrap.min.js
    • Modified JS Files: /assets/plugins/bootstrap/js/bootstrap.min.js
  • UPDATE: jQuery 1.8.2 to jQuery 1.9.1
    • Modified Directory files: /assets/plugins/jquery-1.8.1/ to /assets/plugins/jquery
    • Added JS Files: /assets/plugins/jquery/jquery-1.9.1.js
    • Added JS Files: /assets/plugins/jquery/jquery-1.9.1.min.js
    • Added JS Files: /assets/plugins/jquery/jquery-migrate-1.1.0.js
    • Added JS Files: /assets/plugins/jquery/jquery-migrate-1.1.0.min.js
  • MODIFY: FontAwesome Directory
    • Modified Directory files: /assets/plugins/font-awesome-4.2.0/ to /assets/plugins/font-awesome/
  • FIX: IE8 Font Rendering Issue
    • Modified Directory files: /assets/css/style.css
    • Modified Directory files: /assets/css/style.min.css
  • FIX: Google Chrome Fixed Element Rendering Issue
    • Modified Directory files: /assets/css/style.css
    • Modified Directory files: /assets/css/style.min.css
Version 1.4.0 - 17 September 2014
  • NEW: Front end one page parallax page Added
    • Added HTML files: /frontend/one-page-parallax/index.html
    • Added HTML files: /frontend/one-page-parallax/index_inverse_header.html
    • Added HTML files: /frontend/one-page-parallax/index_default_header.html
    • Added HTML files: /frontend/one-page-parallax/extra-element.html
  • NEW: Email Inbox v2 page Added
    • Added HTML files: email_inbox_v2.html
  • NEW: Email Compose v2 page Added
    • Added HTML files: email_compose.html
  • NEW: Email Detail v2 page Added
    • Added HTML files: email_detail.html
  • NEW: LESS file Added
    • Added LESS files: assets/less
  • NEW: Added Meta Setting to Disable Mobile Zooming
    • Modified HTML files: ALL
  • FIX: Accordion Styling Overflow
    • Modified css files: assets/css/style.css
    • Modified css files: assets/css/style.min.css
  • FIX: Mobile Slimscroll Scrolling Speed
    • Modified js files: assets/js/apps.js
    • Modified js files: assets/js/apps.min.js
  • FIX: Mobile Sidebar Click Event
    • Modified js files: assets/js/apps.js
    • Modified js files: assets/js/apps.min.js
Version 1.3.0 - 30 August 2014
  • NEW: Dashboard v2 Page
    • Added new html files: dashboard_v2.html
    • Modified css files: assets/css/style.css
    • Modified css files: assets/css/style.min.css
  • NEW: Simple Line Icons Page
    • Added new html files: ui_simple_line_icons.html
    • Added new plugins files: assets/plugins/simple-line-icons
  • NEW: Morris Chart Page
    • Added new html files: chart_morris.html
    • Added new plugins files: assets/plugins/morris
  • NEW: Page with Line Icons
    • Added new html files: page_with_line_icons.html
  • NEW: Full Height Content Page
    • Added new html files: page_full_height.html
    • Modified css files: assets/css/style.css
    • Modified css files: assets/css/style.min.css
    • Modified css files: assets/css/style-responsive.css
    • Modified css files: assets/css/style-responsive.min.css
  • NEW: CSS Helper Page
    • Added new html files: helper_css.html
  • NEW: Gallery v2 Page
    • Added new html files: gallery_v2.html
    • Modified css files: assets/css/style.css
    • Modified css files: assets/css/style.min.css
    • Modified css files: assets/css/style-responsive.css
    • Modified css files: assets/css/style-responsive.min.css
    • Added new plugins files: assets/plugins/superbox
  • UPDATE: FontAwesome from 4.1.0 to 4.2.0
    • Modified css files: assets/css/style.css
    • Modified css files: assets/css/style.min.css
  • CHANGE: chart.html to flot-chart.html
  • CHANGE: .widget-states to .widget-stats
    • Modified css files: assets/css/style.css
    • Modified css files: assets/css/style.min.css
  • FIX: Typo on Sidebar Link Url
    • Modified html files: all html files
  • FIX: Minified Sidebar on Tablet
    • Modified js file: assets/js/apps.js
    • Modified js file: assets/js/apps.min.js
Version 1.2.0 - 15 June 2014
  • NEW: 5 Color Theme
    • Modified html files: all html files
    • Added new css file: assets/css/theme/default.html
    • Added new css file: assets/css/theme/blue.html
    • Added new css file: assets/css/theme/red.html
    • Added new css file: assets/css/theme/orange.html
    • Added new css file: assets/css/theme/purple.html
    • Added new css file: assets/css/theme/black.html
    • Added new css file: assets/css/style.css
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • NEW: Inverse & Default Top Navigation Theme
    • Modified html files: all html files
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • NEW: Sidebar Grid Layout Option
    • Modified html files: all html files
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • NEW: Theme Panel
    • Modified html files: all html files
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • NEW: Sidebar & Header Default & Fixed Option
    • Modified html files: all html files
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • NEW: Page With Two Sidebar
    • Added new html files: page_with_two_sidebar.html
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
    • Modified js file: assets/js/apps.js
    • Modified js file: assets/js/apps.min.js
  • NEW: Login V2
    • Added new html files: login_v2.html
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
    • Modified js file: assets/js/apps.js
    • Modified js file: assets/js/apps.min.js
  • NEW: X-Editable
    • Added new html files: form_editable.html
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • NEW: Multiple File Upload
    • Added new html files: form_multiple_upload.html
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • NEW: Form Slider + Switcher Page
    • Added new html files: form_slider_switcher.html
    • Added new plugins file: assets/plugins/switchery
  • NEW: Wizards + Validation Page
    • Added new html files: form_wizards_validation.html
    • Updated plugins file: assets/plugins/parsley
  • UPDATE: Plugins Parsley 2.0
    • Updated html files: form_wizards.html
    • Updated plugins file: assets/plugins/parsley
  • UI: Dashboard widget state & line chart improvement
    • Modified html files: index.html
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • FIX: Mobile Top Navigation Fixed Top
    • Modified html files: all html files
    • Modified css file: assets/css/style-responsive.css
    • Modified css file: assets/css/style-responsive.min.css
  • FIX: Mobile Sidebar Fixed Right Position
    • Modified html files: all html files
    • Modified css file: assets/css/style-responsive.css
    • Modified css file: assets/css/style-responsive.min.css
  • FIX: Panel Remove Action Tooltip
    • Modified js file: assets/js/apps.js
    • Modified js file: assets/js/apps.min.js
  • FIX: Mozilla Firefox Sidebar Minimized
    • Modified js file: assets/js/apps.js
    • Modified js file: assets/js/apps.min.js
  • FIX: Sidebar DOM Element Didn't Functioning
    • Modified js file: assets/js/apps.js
    • Modified js file: assets/js/apps.min.js
  • FIX: Sidebar Uncollapsed Sub Menu After Minify
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • FIX: Old Browser Transparent Background Styling Support
    • Added new folder: assets/img/transparent/
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css

 

Version 1.1.0 – 30 May 2014
  • NEW: Email Template
    • Added new html file: email_system.html
    • Added new html file: email_newsletter.html
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • NEW: Timeline Page
    • Added new html file: extra_timeline.html
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
    • Modified css file: assets/css/style-responsive.css
    • Modified css file: assets/css/style-responsive.min.css
  • NEW: Coming Soon Page
    • Added new html file: extra_coming_soon.html
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
    • Modified css file: assets/css/style-responsive.css
    • Modified css file: assets/css/style-responsive.min.css
  • FIX: Sidebar Sub Menu Caret Styling
    • Modified html files: all html files
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • FIX: Modal Backdrop Opacity
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • FIX: Login form in mobile landscape view
    • Modified css file: assets/css/style.css
    • Modified css file: assets/css/style.min.css
  • FIX: Mobile View Search Box in header
    • Modified html files: all html files
    • Modified css file: assets/css/style-responsive.css
    • Modified css file: assets/css/style-responsive.min.css
  • FIX: Icon page broken on mobile
    • Modified file: ui_icons.html
  • FIX: Dashboard Tab Panel on mobile
    • Modified html files: index.html
    • Modified css file: assets/css/style-responsive.css
    • Modified css file: assets/css/style-responsive.min.css