0.0.20

Support composer

.gitignore

@@ -16,3 +16,4 @@ generated-site
 deploy-site
 /commits.sh
 /assets/css/
+/vendor/

README.md

@@ -1,8 +1,8 @@
 # Tabler 
 
-Premium and Open Source dashboard template with responsive and high quality UI.
+<a href="https://buddy.works"><img src="https://assets.buddy.works/automated-dark.svg" alt="Automated by Buddy" align="right"></a>
 
-<a href="https://www.npmjs.com/package/tabler-ui"><img src="https://img.shields.io/npm/dt/tabler-ui.svg" alt="Total Downloads"></a> <a href="https://github.com/tabler/tabler/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tabler-ui.svg" alt="License"></a> <a href="https://github.com/tabler/tabler/releases"><img src="https://img.shields.io/npm/v/tabler-ui.svg" alt="Latest Release"></a> <a href="https://david-dm.org/tabler/tabler?type=dev"><img src="https://img.shields.io/david/dev/tabler/tabler.svg" alt="devDependency Status"></a>
+Premium and Open Source dashboard template with responsive and high quality UI.
 
 <strong><a href="https://tabler.github.io/demo/">View Demo</a> | <a href="https://github.com/tabler/tabler/archive/master.zip">Download ZIP</a></strong>
 
@@ -22,6 +22,10 @@ We’ve created this admin panel for everyone who wants to create any template b
 * **Clean Code:** We strictly followed Bootstrap’s guidelines to make your integration as easy as possible. All code is handwritten and W3c valid.
 * **Demo pages**: Tabler features over 20 individual pages featuring various components, giving you the freedom of choosing and combining. All components can have variation in color and styling, that can easily be modified using Sass. The sky is the limit!
 
+## Status
+
+<a href="https://www.npmjs.com/package/tabler-ui"><img src="https://img.shields.io/npm/dt/tabler-ui.svg" alt="Total Downloads"></a> <a href="https://github.com/tabler/tabler/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tabler-ui.svg" alt="License"></a> <a href="https://github.com/tabler/tabler/releases"><img src="https://img.shields.io/npm/v/tabler-ui.svg" alt="Latest Release"></a> <a href="https://david-dm.org/tabler/tabler?type=dev"><img src="https://img.shields.io/david/dev/tabler/tabler.svg" alt="devDependency Status"></a> [![buddy pipeline](https://app.buddy.works/codecalm/tabler/pipelines/pipeline/131922/badge.svg?token=1ab151000ecf8700a90dd4d0d7184945d439d2642679b257092d16e76a45dce4 "buddy pipeline")](https://app.buddy.works/codecalm/tabler/pipelines/pipeline/131922)
+
 ## Documentation
 
 For full documentation, visit [tabler.github.io/tabler/docs](https://tabler.github.io/tabler/docs/index.html).

_config.yml

@@ -2,6 +2,7 @@ title: Tabler
 description: tabler.github.io - a responsive, flat and full featured admin template
 
 source: src
+host: 0.0.0.0
 
 plugins:
   - jekyll-tidy
@@ -24,8 +25,6 @@ exclude:
   - .DS_Store
   - .sass-cache/
   - .asset-cache/
-  - assets/scss/*
-  - assets/plugins/**/*.scss
   - push-to-repo.sh
   - commits.sh
 

composer.json

@@ -0,0 +1,15 @@
+{
+    "name": "tabler/tabler",
+    "description": "Premium and Open Source dashboard template with responsive and high quality UI. For Free!",
+    "type": "library",
+    "license": "MIT",
+	"require": {},
+	"require-dev": {},
+	"autoload": {},
+	"authors": [
+		{
+			"name": "codecalm",
+			"email": "codecalm@gmail.com"
+		}
+	]
+}

dist-new-version.sh

@@ -1,6 +1,6 @@
 #!/usr/bin/env bash
 
-version=0.0.18
+version=0.0.20
 
 echo "Version $version"
 

dist/400.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Page 400 - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">

dist/401.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Page 401 - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">

dist/403.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Page 403 - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">

dist/404.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Page 404 - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">

dist/500.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Page 500 - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">

dist/503.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Page 503 - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">

dist/assets/css/dashboard.css

@@ -1534,7 +1534,8 @@ pre code {
 }
 
 .table th, .text-wrap table th,
-.table td, .text-wrap table td {
+.table td,
+.text-wrap table td {
   padding: 0.75rem;
   vertical-align: top;
   border-top: 1px solid #dee2e6;
@@ -1563,12 +1564,14 @@ pre code {
 }
 
 .table-bordered th, .text-wrap table th,
-.table-bordered td, .text-wrap table td {
+.table-bordered td,
+.text-wrap table td {
   border: 1px solid #dee2e6;
 }
 
 .table-bordered thead th, .text-wrap table thead th,
-.table-bordered thead td, .text-wrap table thead td {
+.table-bordered thead td,
+.text-wrap table thead td {
   border-bottom-width: 2px;
 }
 
@@ -5616,7 +5619,8 @@ button.close {
 }
 
 .bs-popover-top .arrow::before, .bs-popover-auto[x-placement^="top"] .arrow::before,
-.bs-popover-top .arrow::after, .bs-popover-auto[x-placement^="top"] .arrow::after {
+.bs-popover-top .arrow::after,
+.bs-popover-auto[x-placement^="top"] .arrow::after {
   border-width: 0.5rem 0.25rem 0;
 }
 
@@ -5625,7 +5629,9 @@ button.close {
   border-top-color: #dee3eb;
 }
 
-.bs-popover-top .arrow::after, .bs-popover-auto[x-placement^="top"] .arrow::after {
+
+.bs-popover-top .arrow::after,
+.bs-popover-auto[x-placement^="top"] .arrow::after {
   bottom: 1px;
   border-top-color: #fff;
 }
@@ -5642,7 +5648,8 @@ button.close {
 }
 
 .bs-popover-right .arrow::before, .bs-popover-auto[x-placement^="right"] .arrow::before,
-.bs-popover-right .arrow::after, .bs-popover-auto[x-placement^="right"] .arrow::after {
+.bs-popover-right .arrow::after,
+.bs-popover-auto[x-placement^="right"] .arrow::after {
   border-width: 0.25rem 0.5rem 0.25rem 0;
 }
 
@@ -5651,7 +5658,9 @@ button.close {
   border-right-color: #dee3eb;
 }
 
-.bs-popover-right .arrow::after, .bs-popover-auto[x-placement^="right"] .arrow::after {
+
+.bs-popover-right .arrow::after,
+.bs-popover-auto[x-placement^="right"] .arrow::after {
   left: 1px;
   border-right-color: #fff;
 }
@@ -5665,7 +5674,8 @@ button.close {
 }
 
 .bs-popover-bottom .arrow::before, .bs-popover-auto[x-placement^="bottom"] .arrow::before,
-.bs-popover-bottom .arrow::after, .bs-popover-auto[x-placement^="bottom"] .arrow::after {
+.bs-popover-bottom .arrow::after,
+.bs-popover-auto[x-placement^="bottom"] .arrow::after {
   border-width: 0 0.25rem 0.5rem 0.25rem;
 }
 
@@ -5674,7 +5684,9 @@ button.close {
   border-bottom-color: #dee3eb;
 }
 
-.bs-popover-bottom .arrow::after, .bs-popover-auto[x-placement^="bottom"] .arrow::after {
+
+.bs-popover-bottom .arrow::after,
+.bs-popover-auto[x-placement^="bottom"] .arrow::after {
   top: 1px;
   border-bottom-color: #fff;
 }
@@ -5702,7 +5714,8 @@ button.close {
 }
 
 .bs-popover-left .arrow::before, .bs-popover-auto[x-placement^="left"] .arrow::before,
-.bs-popover-left .arrow::after, .bs-popover-auto[x-placement^="left"] .arrow::after {
+.bs-popover-left .arrow::after,
+.bs-popover-auto[x-placement^="left"] .arrow::after {
   border-width: 0.25rem 0 0.25rem 0.5rem;
 }
 
@@ -5711,7 +5724,9 @@ button.close {
   border-left-color: #dee3eb;
 }
 
-.bs-popover-left .arrow::after, .bs-popover-auto[x-placement^="left"] .arrow::after {
+
+.bs-popover-left .arrow::after,
+.bs-popover-auto[x-placement^="left"] .arrow::after {
   right: 1px;
   border-left-color: #fff;
 }
@@ -9688,12 +9703,14 @@ a.text-dark:hover, a.text-dark:focus {
   .table, .text-wrap table {
     border-collapse: collapse !important;
   }
-  .table td, .text-wrap table td,
+  
-  .table th, .text-wrap table th {
+  .table td,
+  .text-wrap table td, .table th, .text-wrap table th {
     background-color: #fff !important;
   }
   .table-bordered th, .text-wrap table th,
-  .table-bordered td, .text-wrap table td {
+  .table-bordered td,
+  .text-wrap table td {
     border: 1px solid #ddd !important;
   }
 }
@@ -13310,7 +13327,6 @@ Card alert
 .dropdown-menu {
   box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
   min-width: 12rem;
-  max-width: 100%;
 }
 
 .dropdown-menu-arrow:before {
@@ -13353,7 +13369,7 @@ Card alert
 }
 
 .dropdown-icon {
-  color: #6e7687;
+  color: #9aa0ac;
   margin-right: .5rem;
   margin-left: -.5rem;
   width: 1em;

dist/assets/plugins/charts-c3/plugin.scss

@@ -0,0 +1,2 @@
+@import '../../scss/variables';
+@import 'scss/c3';

dist/assets/plugins/fullcalendar/plugin.scss

@@ -0,0 +1,2 @@
+@import '../../scss/variables';
+@import 'scss/fullcalendar';

dist/assets/plugins/iconfonts/plugin.scss

@@ -0,0 +1,4 @@
+@import 'scss/themify';
+@import 'scss/weathericons';
+@import 'scss/materialdesignicons';
+@import 'scss/simple-line-icons';

dist/assets/plugins/prismjs/plugin.scss

@@ -0,0 +1,227 @@
+@import '../../scss/variables';
+
+/* PrismJS 1.9.0
+http://prismjs.com/download.html?themes=prism&languages=markup+css+clike+javascript+ruby+json+less+php+python+jsx+sass+scss+sql&plugins=line-highlight+line-numbers */
+/**
+ * prism.js default theme for JavaScript, CSS and HTML
+ * Based on dabblet (http://dabblet.com)
+ * @author Lea Verou
+ */
+code[class*="language-"],
+pre[class*="language-"] {
+	//color: black;
+	//background: none;
+	//text-shadow: 0 1px white;
+	//font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+	//text-align: left;
+	//white-space: pre;
+	//word-spacing: normal;
+	//word-break: normal;
+	//word-wrap: normal;
+	//line-height: 1.5;
+	//
+	//-moz-tab-size: 4;
+	//-o-tab-size: 4;
+	//tab-size: 4;
+	//
+	//-webkit-hyphens: none;
+	//-moz-hyphens: none;
+	//-ms-hyphens: none;
+	//hyphens: none;
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+	color: slategray;
+}
+
+.token.punctuation {
+	color: #999;
+}
+
+.namespace {
+	opacity: .7;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+	color: #905;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+	color: #690;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+	color: #a67f59;
+	background: hsla(0, 0%, 100%, .5);
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+	color: #07a;
+}
+
+.token.function {
+	color: #dd4a68;
+}
+
+.token.regex,
+.token.important,
+.token.variable {
+	color: #e90;
+}
+
+.token.important,
+.token.bold {
+	font-weight: bold;
+}
+
+.token.italic {
+	font-style: italic;
+}
+
+.token.entity {
+	cursor: help;
+}
+
+pre[data-line] {
+	position: relative;
+	//padding: 1em 0 1em 3em;
+}
+
+.line-highlight {
+	position: absolute;
+	left: 0;
+	right: 0;
+	margin-top: 1em; /* Same as .prism’s padding-top */
+
+	background: rgba(255, 255, 0, 0.1);
+	pointer-events: none;
+
+	line-height: inherit;
+	white-space: pre;
+}
+
+.line-highlight:before,
+.line-highlight[data-end]:after {
+	content: attr(data-start);
+	position: absolute;
+	top: .4em;
+	left: .6em;
+	min-width: 1em;
+	padding: 0 .5em;
+	background-color: hsla(24, 20%, 50%, .4);
+	color: hsl(24, 20%, 95%);
+	font: bold 65%/1.5 sans-serif;
+	text-align: center;
+	vertical-align: .3em;
+	border-radius: 999px;
+	text-shadow: none;
+	box-shadow: 0 1px white;
+}
+
+.line-highlight[data-end]:after {
+	content: attr(data-end);
+	top: auto;
+	bottom: .4em;
+}
+
+.line-numbers .line-highlight:before,
+.line-numbers .line-highlight:after {
+	content: none;
+}
+
+pre.line-numbers {
+	position: relative;
+	padding-left: 3.8em;
+	counter-reset: linenumber;
+}
+
+pre.line-numbers > code {
+	position: relative;
+	white-space: inherit;
+}
+
+.line-numbers .line-numbers-rows {
+	position: absolute;
+	pointer-events: none;
+	top: 0;
+	font-size: 100%;
+	left: -3.8em;
+	width: 3em; /* works for line-numbers below 1000 lines */
+	letter-spacing: -1px;
+	border-right: 1px solid $border-color;
+
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+
+}
+
+.line-numbers-rows > span {
+	pointer-events: none;
+	display: block;
+	counter-increment: linenumber;
+}
+
+.line-numbers-rows > span:before {
+	content: counter(linenumber);
+	color: rgba($text-muted, .5);
+	display: block;
+	padding-right: 0.8em;
+	text-align: right;
+}
+
+pre.code-toolbar {
+	position: relative;
+}
+
+pre.code-toolbar > .toolbar {
+	position: absolute;
+	top: .3em;
+	right: .2em;
+	transition: opacity 0.3s ease-in-out;
+	opacity: 1;
+}
+
+//pre.code-toolbar:hover > .toolbar {
+//	opacity: 1;
+//}
+
+pre.code-toolbar > .toolbar .toolbar-item {
+	display: inline-block;
+	user-select: none;
+}
+
+pre.code-toolbar > .toolbar a {
+	cursor: pointer;
+}
+
+pre.code-toolbar > .toolbar a,
+pre.code-toolbar > .toolbar button,
+pre.code-toolbar > .toolbar span {
+	color: $text-muted;
+	padding: 0 .5em;
+	font-family: $font-family-base;
+	font-size: px2rem(14px);
+}
+

dist/assets/scss/bundle.scss

@@ -0,0 +1,7 @@
+/**
+Dashboard UI
+ */
+
+@import 'variables';
+@import 'dashboard/bootstrap/bootstrap';
+@import 'dashboard/dashboard';

dist/assets/scss/dashboard/bootstrap/bootstrap-grid.scss

@@ -0,0 +1,32 @@
+/*!
+ * Bootstrap Grid v4.0.0 (https://getbootstrap.com)
+ * Copyright 2011-2018 The Bootstrap Authors
+ * Copyright 2011-2018 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+
+@at-root {
+  @-ms-viewport { width: device-width; } // stylelint-disable-line at-rule-no-vendor-prefix
+}
+
+html {
+  box-sizing: border-box;
+  -ms-overflow-style: scrollbar;
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: inherit;
+}
+
+@import "functions";
+@import "variables";
+
+@import "mixins/breakpoints";
+@import "mixins/grid-framework";
+@import "mixins/grid";
+
+@import "grid";
+@import "utilities/display";
+@import "utilities/flex";

dist/assets/scss/dashboard/bootstrap/bootstrap-reboot.scss

@@ -0,0 +1,12 @@
+/*!
+ * Bootstrap Reboot v4.0.0 (https://getbootstrap.com)
+ * Copyright 2011-2018 The Bootstrap Authors
+ * Copyright 2011-2018 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)
+ */
+
+@import "functions";
+@import "variables";
+@import "mixins";
+@import "reboot";

dist/assets/scss/dashboard/bootstrap/bootstrap.scss

@@ -0,0 +1,42 @@
+/*!
+ * Bootstrap v4.0.0 (https://getbootstrap.com)
+ * Copyright 2011-2018 The Bootstrap Authors
+ * Copyright 2011-2018 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+
+@import "functions";
+@import "variables";
+@import "mixins";
+@import "root";
+@import "reboot";
+@import "type";
+@import "images";
+@import "code";
+@import "grid";
+@import "tables";
+@import "forms";
+@import "buttons";
+@import "transitions";
+@import "dropdown";
+@import "button-group";
+@import "input-group";
+@import "custom-forms";
+@import "nav";
+@import "navbar";
+@import "card";
+@import "breadcrumb";
+@import "pagination";
+@import "badge";
+@import "jumbotron";
+@import "alert";
+@import "progress";
+@import "media";
+@import "list-group";
+@import "close";
+@import "modal";
+@import "tooltip";
+@import "popover";
+@import "carousel";
+@import "utilities";
+@import "print";

dist/assets/scss/dashboard/dashboard.scss

@@ -0,0 +1,65 @@
+//@import 'variables';
+//@import '../bootstrap/mixins';
+@import 'functions';
+
+@import 'core';
+@import 'type';
+@import 'grid';
+
+@import 'layout';
+@import 'aside';
+@import 'header';
+@import 'footer';
+@import 'colors';
+@import 'text';
+@import 'utilities';
+
+@import 'nav';
+@import 'button';
+@import 'alert';
+@import 'close';
+@import 'badge';
+@import 'tables';
+@import 'breadcrumb';
+@import 'pagination';
+@import 'cards';
+@import 'popover';
+@import 'dropdown';
+@import 'list';
+@import 'list-group';
+@import 'avatar';
+@import 'product';
+@import 'progress';
+@import 'icon';
+@import 'image';
+@import 'link';
+@import 'media';
+@import 'form';
+@import 'sparkline';
+@import 'social';
+@import 'maps';
+@import 'statuses';
+@import 'charts';
+@import 'chips';
+@import 'stamp';
+@import 'chat';
+@import 'example';
+@import 'tag';
+@import 'syntax';
+@import 'infobox';
+
+@import 'forms/custom-range';
+@import 'forms/custom-selectgroup';
+@import 'forms/custom-switch';
+@import 'forms/custom-imagecheck';
+@import 'forms/custom-colorinput';
+
+@import 'timeline';
+
+@import 'browser';
+@import 'flag';
+@import 'payments';
+@import 'jvectormap';
+@import 'selectize';
+
+@import 'fonts/feather';

dist/blog.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/cards.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Cards design - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/charts.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Charts - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/crypto-currencies.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Crypto currencies - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/alerts.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Alerts - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/avatars.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Avatars - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/buttons.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Buttons - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/cards.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Cards - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/charts.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Charts - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/colors.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Colors - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/form-components.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Form components - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/grid.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Grid utilities - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/index.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Introduction - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/tags.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Tags - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/docs/typography.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="../favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Typography - Documentation - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/email.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Email - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/empty.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Empty page - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/forgot-password.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Forgot password - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">

dist/form-elements.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/gallery.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/icons.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Icons - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/index.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Homepage - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>
@@ -688,7 +698,7 @@
                           <td>
                             <div>Michelle Schultz</div>
                             <div class="small text-muted">
-                              Registered: Feb 18, 2018
+                              Registered: Feb 19, 2018
                             </div>
                           </td>
                           <td>
@@ -790,7 +800,7 @@
                           <td>
                             <div>Douglas Ray</div>
                             <div class="small text-muted">
-                              Registered: Jan 3, 2018
+                              Registered: Jan 4, 2018
                             </div>
                           </td>
                           <td>
@@ -841,7 +851,7 @@
                           <td>
                             <div>Teresa Reyes</div>
                             <div class="small text-muted">
-                              Registered: Feb 20, 2018
+                              Registered: Feb 21, 2018
                             </div>
                           </td>
                           <td>

dist/invoice.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Invoice - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/login.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Login - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">

dist/lookup.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Lookup company - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/maps.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Maps - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/pagination.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Pagination - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/pricing-cards.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Pricing cards - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/profile.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Profile - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/register.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Register - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">

dist/sample-cards.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Homepage - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/store.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>Store components - tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

dist/users-list.html

@@ -14,7 +14,7 @@
     <meta name="MobileOptimized" content="320">
     <link rel="icon" href="./favicon.ico" type="image/x-icon"/>
     <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-    <!-- Generated: 2018-04-04 09:40:59 +0200 -->
+    <!-- Generated: 2018-04-04 16:12:58 +0200 -->
     <title>tabler.github.io - a responsive, flat and full featured admin template</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&amp;subset=latin-ext">
@@ -46,26 +46,47 @@
                 <img src="./demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
               </a>
               <div class="ml-auto d-flex order-lg-2">
-                <div class="nav-item">
+                <div class="nav-item d-none d-md-flex">
                   <a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
                 </div>
-                <div class="dropdown d-none d-md-flex">
+                <!--<div class="dropdown d-none d-md-flex">-->
-                  <a class="nav-link icon" data-toggle="dropdown">
+                <!--<a class="nav-link icon" data-toggle="dropdown">-->
-                    <i class="fe fe-message-square"></i>
+                <!--<i class="fe fe-message-square"></i>-->
-                  </a>
+                <!--</a>-->
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                <!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                <!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                <!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-                  </div>
+                <!--</div>-->
-                </div>
+                <!--</div>-->
                 <div class="dropdown d-none d-md-flex">
                   <a class="nav-link icon" data-toggle="dropdown">
                     <i class="fe fe-bell"></i>
                     <span class="nav-unread"></span>
                   </a>
-                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+                  <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+                    <a href="#" class="dropdown-item d-flex">
-                    delectus dolore dolores maxime nesciunt qui quia totam.
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/male/41.jpg)"></span>
+                      <div>
+                        <strong>Nathan</strong> pushed new commit: Fix page load performance issue.
+                        <div class="small text-muted">10 minutes ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/1.jpg)"></span>
+                      <div>
+                        <strong>Alice</strong> started new task: Tabler UI design.
+                        <div class="small text-muted">1 hour ago</div>
+                      </div>
+                    </a>
+                    <a href="#" class="dropdown-item d-flex">
+                      <span class="avatar mr-3 align-self-center" style="background-image: url(demo/faces/female/18.jpg)"></span>
+                      <div>
+                        <strong>Rose</strong> deployed new version of NodeJS REST Api V3
+                        <div class="small text-muted">2 hours ago</div>
+                      </div>
+                    </a>
+                    <div class="dropdown-divider"></div>
+                    <a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
                   </div>
                 </div>
                 <div class="dropdown">
@@ -78,39 +99,28 @@
                   </a>
                   <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                     <a class="dropdown-item" href="#">
-                      <span>Profile</span>
+                      <i class="dropdown-icon fe fe-user"></i> Profile
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Settings</span>
+                      <i class="dropdown-icon fe fe-settings"></i> Settings
                     </a>
                     <a class="dropdown-item" href="#">
                       <span class="float-right"><span class="badge badge-primary">6</span></span>
-                      <span>Inbox</span>
+                      <i class="dropdown-icon fe fe-mail"></i> Inbox
                     </a>
                     <a class="dropdown-item" href="#">
-                      <span>Message</span>
+                      <i class="dropdown-icon fe fe-send"></i> Message
                     </a>
                     <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="#">Need help? </a>
+                    <a class="dropdown-item" href="#">
-                    <a class="dropdown-item" href="#">Sign out</a>
+                      <i class="dropdown-icon fe fe-help-circle"></i> Need help?
+                    </a>
+                    <a class="dropdown-item" href="#">
+                      <i class="dropdown-icon fe fe-log-out"></i> Sign out
+                    </a>
                   </div>
                 </div>
               </div>
-              <div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-                <ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-                  <li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-                  <li class="nav-item dropdown">
-                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-                    <div class="dropdown-menu mt-2 text-color" role="menu">
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-                      <div class="dropdown-divider"></div>
-                      <a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-                    </div>
-                  </li>
-                </ul>
-              </div>
             </div>
           </div>
         </div>

package.json

@@ -1,7 +1,7 @@
 {
   "name": "tabler-ui",
   "description": "Premium and Open Source dashboard template with responsive and high quality UI. For Free!",
-  "version": "0.0.18",
+  "version": "0.0.20",
   "keywords": [
     "css",
     "sass",

src/_includes/header.html

@@ -6,26 +6,47 @@
 				<img src="{{ site.base }}/demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
 			</a>
 			<div class="ml-auto d-flex order-lg-2">
-				<div class="nav-item">
+				<div class="nav-item d-none d-md-flex">
 					<a href="{{ site.github_url }}" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
 				</div>
-				<div class="dropdown d-none d-md-flex">
+				<!--<div class="dropdown d-none d-md-flex">-->
-					<a class="nav-link icon" data-toggle="dropdown">
+					<!--<a class="nav-link icon" data-toggle="dropdown">-->
-						<i class="fe fe-message-square"></i>
+						<!--<i class="fe fe-message-square"></i>-->
-					</a>
+					<!--</a>-->
-					<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+					<!--<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">-->
-						Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+						<!--Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores-->
-						delectus dolore dolores maxime nesciunt qui quia totam.
+						<!--delectus dolore dolores maxime nesciunt qui quia totam.-->
-					</div>
+					<!--</div>-->
-				</div>
+				<!--</div>-->
 				<div class="dropdown d-none d-md-flex">
 					<a class="nav-link icon" data-toggle="dropdown">
 						<i class="fe fe-bell"></i>
 						<span class="nav-unread"></span>
 					</a>
-					<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
+					<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-						Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
+						<a href="#" class="dropdown-item d-flex">
-						delectus dolore dolores maxime nesciunt qui quia totam.
+							<span class="avatar mr-3 align-self-center" style="background-image: url({{ site.data.users[1].photo }})"></span>
+							<div>
+								<strong>{{ site.data.users[1].name }}</strong> pushed new commit: Fix page load performance issue.
+								<div class="small text-muted">10 minutes ago</div>
+							</div>
+						</a>
+						<a href="#" class="dropdown-item d-flex">
+							<span class="avatar mr-3 align-self-center" style="background-image: url({{ site.data.users[2].photo }})"></span>
+							<div>
+								<strong>{{ site.data.users[2].name }}</strong> started new task: Tabler UI design.
+								<div class="small text-muted">1 hour ago</div>
+							</div>
+						</a>
+						<a href="#" class="dropdown-item d-flex">
+							<span class="avatar mr-3 align-self-center" style="background-image: url({{ site.data.users[3].photo }})"></span>
+							<div>
+								<strong>{{ site.data.users[3].name }}</strong> deployed new version of NodeJS REST Api V3
+								<div class="small text-muted">2 hours ago</div>
+							</div>
+						</a>
+						<div class="dropdown-divider"></div>
+						<a href="#" class="dropdown-item text-center text-muted-dark">Mark all as read</a>
 					</div>
 				</div>
 				<div class="dropdown">
@@ -38,39 +59,28 @@
 					</a>
 					<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
 						<a class="dropdown-item" href="#">
-							<span>Profile</span>
+							<i class="dropdown-icon fe fe-user"></i> Profile
 						</a>
 						<a class="dropdown-item" href="#">
-							<span>Settings</span>
+							<i class="dropdown-icon fe fe-settings"></i> Settings
 						</a>
 						<a class="dropdown-item" href="#">
 							<span class="float-right"><span class="badge badge-primary">6</span></span>
-							<span>Inbox</span>
+							<i class="dropdown-icon fe fe-mail"></i> Inbox
 						</a>
 						<a class="dropdown-item" href="#">
-							<span>Message</span>
+							<i class="dropdown-icon fe fe-send"></i> Message
 						</a>
 						<div class="dropdown-divider"></div>
-						<a class="dropdown-item" href="#">Need help? </a>
+						<a class="dropdown-item" href="#">
-						<a class="dropdown-item" href="#">Sign out</a>
+							<i class="dropdown-icon fe fe-help-circle"></i> Need help?
+						</a>
+						<a class="dropdown-item" href="#">
+							<i class="dropdown-icon fe fe-log-out"></i> Sign out
+						</a>
 					</div>
 				</div>
 			</div>
-			<div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
-				<ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
-					<li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
-					<li class="nav-item dropdown">
-						<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
-						<div class="dropdown-menu mt-2 text-color" role="menu">
-							<a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
-							<a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
-							<a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
-							<div class="dropdown-divider"></div>
-							<a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
-						</div>
-					</li>
-				</ul>
-			</div>
 		</div>
 	</div>
 </div>

src/assets/scss/dashboard/_dropdown.scss

@@ -5,7 +5,7 @@
 .dropdown-menu {
 	box-shadow: $dropdown-box-shadow;
 	min-width: 12rem;
-	max-width: 100%;
+	//max-width: 100%;
 }
 
 .dropdown-menu-arrow {
@@ -47,7 +47,7 @@
 }
 
 .dropdown-icon {
-	color: $text-muted-dark;
+	color: $text-muted;
 	margin-right: .5rem;
 	margin-left: -.5rem;
 	width: 1em;