Added Docs - Initial draft
18437
assets/css/dashboard-free.css
Normal file
266
assets/css/dashboard-free.css.map
Normal file
24
assets/css/dashboard-free.min.css
vendored
Normal file
540
assets/css/nucleo-icons.css
Normal file
@ -0,0 +1,540 @@
|
|||||||
|
/* --------------------------------
|
||||||
|
|
||||||
|
Nucleo Outline Web Font - nucleoapp.com/
|
||||||
|
License - nucleoapp.com/license/
|
||||||
|
Created using IcoMoon - icomoon.io
|
||||||
|
|
||||||
|
-------------------------------- */
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Nucleo';
|
||||||
|
src: url('../fonts/nucleo.eot');
|
||||||
|
src: url('../fonts/nucleo.eot') format('embedded-opentype'),
|
||||||
|
url('../fonts/nucleo.woff2') format('woff2'),
|
||||||
|
url('../fonts/nucleo.woff') format('woff'),
|
||||||
|
url('../fonts/nucleo.ttf') format('truetype'),
|
||||||
|
url('../fonts/nucleo.svg') format('svg');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*------------------------
|
||||||
|
base class definition
|
||||||
|
-------------------------*/
|
||||||
|
|
||||||
|
.tim-icons {
|
||||||
|
display: inline-block;
|
||||||
|
font: normal normal normal 1em/1 'Nucleo';
|
||||||
|
vertical-align: middle;
|
||||||
|
speak: none;
|
||||||
|
text-transform: none;
|
||||||
|
/* Better Font Rendering */
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
}
|
||||||
|
|
||||||
|
.font-icon-detail{
|
||||||
|
text-align: center;
|
||||||
|
padding: 45px 0 30px;
|
||||||
|
border: 1px solid #e44cc4;
|
||||||
|
border-radius: .1875rem;
|
||||||
|
margin: 15px 0;
|
||||||
|
min-height: 168px;
|
||||||
|
}
|
||||||
|
.font-icon-detail i{
|
||||||
|
color: #FFFFFF;
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.font-icon-detail p{
|
||||||
|
color: #e44cc4 !important;
|
||||||
|
margin-top: 30px;
|
||||||
|
padding: 0 10px;
|
||||||
|
font-size: .7142em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*------------------------
|
||||||
|
change icon size
|
||||||
|
-------------------------*/
|
||||||
|
|
||||||
|
.tim-icons-sm {
|
||||||
|
font-size: 0.8em;
|
||||||
|
}
|
||||||
|
.tim-icons-lg {
|
||||||
|
font-size: 1.2em;
|
||||||
|
}
|
||||||
|
/* absolute units */
|
||||||
|
.tim-icons-16 {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.tim-icons-32 {
|
||||||
|
font-size: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*----------------------------------
|
||||||
|
add a square/circle background
|
||||||
|
-----------------------------------*/
|
||||||
|
|
||||||
|
.tim-icons-bg-square,
|
||||||
|
.tim-icons-bg-circle {
|
||||||
|
padding: 0.35em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tim-icons-bg-circle {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
/*------------------------
|
||||||
|
list icons
|
||||||
|
-------------------------*/
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/*------------------------
|
||||||
|
spinning icons
|
||||||
|
-------------------------*/
|
||||||
|
|
||||||
|
.tim-icons-is-spinning {
|
||||||
|
-webkit-animation: tim-icons-spin 2s infinite linear;
|
||||||
|
-moz-animation: tim-icons-spin 2s infinite linear;
|
||||||
|
animation: tim-icons-spin 2s infinite linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes tim-icons-spin {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-moz-keyframes tim-icons-spin {
|
||||||
|
0% {
|
||||||
|
-moz-transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-moz-transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes tim-icons-spin {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: rotate(0deg);
|
||||||
|
-moz-transform: rotate(0deg);
|
||||||
|
-ms-transform: rotate(0deg);
|
||||||
|
-o-transform: rotate(0deg);
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: rotate(360deg);
|
||||||
|
-moz-transform: rotate(360deg);
|
||||||
|
-ms-transform: rotate(360deg);
|
||||||
|
-o-transform: rotate(360deg);
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*------------------------
|
||||||
|
rotated/flipped icons
|
||||||
|
-------------------------*/
|
||||||
|
/*------------------------
|
||||||
|
icons
|
||||||
|
-------------------------*/
|
||||||
|
|
||||||
|
.icon-alert-circle-exc::before {
|
||||||
|
content: "\ea02";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-align-center::before {
|
||||||
|
content: "\ea03";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-align-left-2::before {
|
||||||
|
content: "\ea04";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-app::before {
|
||||||
|
content: "\ea05";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-atom::before {
|
||||||
|
content: "\ea06";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-attach-87::before {
|
||||||
|
content: "\ea07";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-badge::before {
|
||||||
|
content: "\ea08";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-bag-16::before {
|
||||||
|
content: "\ea09";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-bank::before {
|
||||||
|
content: "\ea0a";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-basket-simple::before {
|
||||||
|
content: "\ea0b";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-bell-55::before {
|
||||||
|
content: "\ea0c";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-bold::before {
|
||||||
|
content: "\ea0d";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-book-bookmark::before {
|
||||||
|
content: "\ea0e";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-bulb-63::before {
|
||||||
|
content: "\ea0f";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-bullet-list-67::before {
|
||||||
|
content: "\ea10";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-bus-front-12::before {
|
||||||
|
content: "\ea11";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-button-pause::before {
|
||||||
|
content: "\ea12";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-button-power::before {
|
||||||
|
content: "\ea13";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-calendar-60::before {
|
||||||
|
content: "\ea14";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-camera-18::before {
|
||||||
|
content: "\ea15";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-caps-small::before {
|
||||||
|
content: "\ea16";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-cart::before {
|
||||||
|
content: "\ea17";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-chart-bar-32::before {
|
||||||
|
content: "\ea18";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-chart-pie-36::before {
|
||||||
|
content: "\ea19";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-chat-33::before {
|
||||||
|
content: "\ea1a";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-check-2::before {
|
||||||
|
content: "\ea1b";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-cloud-download-93::before {
|
||||||
|
content: "\ea1c";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-cloud-upload-94::before {
|
||||||
|
content: "\ea1d";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-coins::before {
|
||||||
|
content: "\ea1e";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-compass-05::before {
|
||||||
|
content: "\ea1f";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-controller::before {
|
||||||
|
content: "\ea20";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-credit-card::before {
|
||||||
|
content: "\ea21";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-delivery-fast::before {
|
||||||
|
content: "\ea22";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-double-left::before {
|
||||||
|
content: "\ea23";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-double-right::before {
|
||||||
|
content: "\ea24";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-email-85::before {
|
||||||
|
content: "\ea25";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-gift-2::before {
|
||||||
|
content: "\ea26";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-globe-2::before {
|
||||||
|
content: "\ea27";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-headphones::before {
|
||||||
|
content: "\ea28";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-heart-2::before {
|
||||||
|
content: "\ea29";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-html5::before {
|
||||||
|
content: "\ea2a";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-image-02::before {
|
||||||
|
content: "\ea2b";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-istanbul::before {
|
||||||
|
content: "\ea2c";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-key-25::before {
|
||||||
|
content: "\ea2d";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-laptop::before {
|
||||||
|
content: "\ea2e";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-light-3::before {
|
||||||
|
content: "\ea2f";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-link-72::before {
|
||||||
|
content: "\ea30";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-lock-circle::before {
|
||||||
|
content: "\ea31";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-map-big::before {
|
||||||
|
content: "\ea32";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-minimal-down::before {
|
||||||
|
content: "\ea33";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-minimal-left::before {
|
||||||
|
content: "\ea34";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-minimal-right::before {
|
||||||
|
content: "\ea35";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-minimal-up::before {
|
||||||
|
content: "\ea36";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-mobile::before {
|
||||||
|
content: "\ea37";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-molecule-40::before {
|
||||||
|
content: "\ea38";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-money-coins::before {
|
||||||
|
content: "\ea39";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-notes::before {
|
||||||
|
content: "\ea3a";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-palette::before {
|
||||||
|
content: "\ea3b";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-paper::before {
|
||||||
|
content: "\ea3c";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-pencil::before {
|
||||||
|
content: "\ea3d";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-pin::before {
|
||||||
|
content: "\ea3e";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-planet::before {
|
||||||
|
content: "\ea3f";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-puzzle-10::before {
|
||||||
|
content: "\ea40";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-satisfied::before {
|
||||||
|
content: "\ea41";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-scissors::before {
|
||||||
|
content: "\ea42";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-send::before {
|
||||||
|
content: "\ea43";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-settings-gear-63::before {
|
||||||
|
content: "\ea44";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-settings::before {
|
||||||
|
content: "\ea45";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-simple-add::before {
|
||||||
|
content: "\ea46";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-simple-delete::before {
|
||||||
|
content: "\ea47";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-simple-remove::before {
|
||||||
|
content: "\ea48";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-single-02::before {
|
||||||
|
content: "\ea49";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-single-copy-04::before {
|
||||||
|
content: "\ea4a";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-sound-wave::before {
|
||||||
|
content: "\ea4b";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-spaceship::before {
|
||||||
|
content: "\ea4c";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-square-pin::before {
|
||||||
|
content: "\ea4d";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-support-17::before {
|
||||||
|
content: "\ea4e";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-tablet-2::before {
|
||||||
|
content: "\ea4f";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-tag::before {
|
||||||
|
content: "\ea50";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-tap-02::before {
|
||||||
|
content: "\ea51";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-tie-bow::before {
|
||||||
|
content: "\ea52";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-time-alarm::before {
|
||||||
|
content: "\ea53";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-trash-simple::before {
|
||||||
|
content: "\ea54";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-triangle-right-17::before {
|
||||||
|
content: "\ea55";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-trophy::before {
|
||||||
|
content: "\ea56";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-tv-2::before {
|
||||||
|
content: "\ea57";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-upload::before {
|
||||||
|
content: "\ea58";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-user-run::before {
|
||||||
|
content: "\ea59";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-vector::before {
|
||||||
|
content: "\ea5a";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-video-66::before {
|
||||||
|
content: "\ea5b";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-volume-98::before {
|
||||||
|
content: "\ea5c";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-wallet-43::before {
|
||||||
|
content: "\ea5d";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-watch-time::before {
|
||||||
|
content: "\ea5e";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-wifi::before {
|
||||||
|
content: "\ea5f";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-world::before {
|
||||||
|
content: "\ea60";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-zoom-split::before {
|
||||||
|
content: "\ea61";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-refresh-01::before {
|
||||||
|
content: "\ea62";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-refresh-02::before {
|
||||||
|
content: "\ea63";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-shape-star::before {
|
||||||
|
content: "\ea64";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-components::before {
|
||||||
|
content: "\ea65";
|
||||||
|
}
|
||||||
59
assets/demo/dashboard/free/demo.css
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
.tim-row{
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tim-white-buttons {
|
||||||
|
background-color: #777777;
|
||||||
|
}
|
||||||
|
.typography-line{
|
||||||
|
padding-left: 25%;
|
||||||
|
margin-bottom: 35px;
|
||||||
|
position: relative;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.typography-line span{
|
||||||
|
bottom: 10px;
|
||||||
|
color: #c0c1c2;
|
||||||
|
display: block;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 13px;
|
||||||
|
left: 0;
|
||||||
|
position: absolute;
|
||||||
|
width: 260px;
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
.tim-row{
|
||||||
|
padding-top: 60px;
|
||||||
|
}
|
||||||
|
.tim-row h3{
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.offline-doc .page-header{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.offline-doc .footer{
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
background: transparent;
|
||||||
|
bottom: 0;
|
||||||
|
color: #fff;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media all and (min-width: 992px) {
|
||||||
|
.sidebar .nav>li.active-pro {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
bottom: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card.card-upgrade .card-category{
|
||||||
|
max-width: 530px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
792
assets/demo/dashboard/free/demo.js
Normal file
@ -0,0 +1,792 @@
|
|||||||
|
type = ['primary','info','success','warning','danger'];
|
||||||
|
|
||||||
|
demo = {
|
||||||
|
initPickColor: function(){
|
||||||
|
$('.pick-class-label').click(function(){
|
||||||
|
var new_class = $(this).attr('new-class');
|
||||||
|
var old_class = $('#display-buttons').attr('data-class');
|
||||||
|
var display_div = $('#display-buttons');
|
||||||
|
if(display_div.length) {
|
||||||
|
var display_buttons = display_div.find('.btn');
|
||||||
|
display_buttons.removeClass(old_class);
|
||||||
|
display_buttons.addClass(new_class);
|
||||||
|
display_div.attr('data-class', new_class);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
initDocChart: function(){
|
||||||
|
chartColor = "#FFFFFF";
|
||||||
|
|
||||||
|
// General configuration for the charts with Line gradientStroke
|
||||||
|
gradientChartOptionsConfiguration = {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
tooltips: {
|
||||||
|
bodySpacing: 4,
|
||||||
|
mode:"nearest",
|
||||||
|
intersect: 0,
|
||||||
|
position:"nearest",
|
||||||
|
xPadding:10,
|
||||||
|
yPadding:10,
|
||||||
|
caretPadding:10
|
||||||
|
},
|
||||||
|
responsive: true,
|
||||||
|
scales: {
|
||||||
|
yAxes: [{
|
||||||
|
display:0,
|
||||||
|
gridLines:0,
|
||||||
|
ticks: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
gridLines: {
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
drawTicks: false,
|
||||||
|
display: false,
|
||||||
|
drawBorder: false
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
xAxes: [{
|
||||||
|
display:0,
|
||||||
|
gridLines:0,
|
||||||
|
ticks: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
gridLines: {
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
drawTicks: false,
|
||||||
|
display: false,
|
||||||
|
drawBorder: false
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
layout:{
|
||||||
|
padding:{left:0,right:0,top:15,bottom:15}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
ctx = document.getElementById('lineChartExample').getContext("2d");
|
||||||
|
|
||||||
|
gradientStroke = ctx.createLinearGradient(500, 0, 100, 0);
|
||||||
|
gradientStroke.addColorStop(0, '#80b6f4');
|
||||||
|
gradientStroke.addColorStop(1, chartColor);
|
||||||
|
|
||||||
|
gradientFill = ctx.createLinearGradient(0, 170, 0, 50);
|
||||||
|
gradientFill.addColorStop(0, "rgba(128, 182, 244, 0)");
|
||||||
|
gradientFill.addColorStop(1, "rgba(249, 99, 59, 0.40)");
|
||||||
|
|
||||||
|
myChart = new Chart(ctx, {
|
||||||
|
type: 'line',
|
||||||
|
responsive: true,
|
||||||
|
data: {
|
||||||
|
labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
|
||||||
|
datasets: [{
|
||||||
|
label: "Active Users",
|
||||||
|
borderColor: "#f96332",
|
||||||
|
pointBorderColor: "#FFF",
|
||||||
|
pointBackgroundColor: "#f96332",
|
||||||
|
pointBorderWidth: 2,
|
||||||
|
pointHoverRadius: 4,
|
||||||
|
pointHoverBorderWidth: 1,
|
||||||
|
pointRadius: 4,
|
||||||
|
fill: true,
|
||||||
|
backgroundColor: gradientFill,
|
||||||
|
borderWidth: 2,
|
||||||
|
data: [542, 480, 430, 550, 530, 453, 380, 434, 568, 610, 700, 630]
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: gradientChartOptionsConfiguration
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
initDashboardPageCharts: function(){
|
||||||
|
|
||||||
|
gradientChartOptionsConfigurationWithTooltipBlue = {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
|
||||||
|
tooltips: {
|
||||||
|
backgroundColor: '#f5f5f5',
|
||||||
|
titleFontColor: '#333',
|
||||||
|
bodyFontColor: '#666',
|
||||||
|
bodySpacing: 4,
|
||||||
|
xPadding: 12,
|
||||||
|
mode: "nearest",
|
||||||
|
intersect: 0,
|
||||||
|
position: "nearest"
|
||||||
|
},
|
||||||
|
responsive: true,
|
||||||
|
scales:{
|
||||||
|
yAxes: [{
|
||||||
|
barPercentage: 1.6,
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(29,140,248,0.0)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
suggestedMin: 60,
|
||||||
|
suggestedMax: 125,
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#2380f7"
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
|
||||||
|
xAxes: [{
|
||||||
|
barPercentage: 1.6,
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(29,140,248,0.1)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#2380f7"
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
gradientChartOptionsConfigurationWithTooltipPurple = {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
|
||||||
|
tooltips: {
|
||||||
|
backgroundColor: '#f5f5f5',
|
||||||
|
titleFontColor: '#333',
|
||||||
|
bodyFontColor: '#666',
|
||||||
|
bodySpacing: 4,
|
||||||
|
xPadding: 12,
|
||||||
|
mode: "nearest",
|
||||||
|
intersect: 0,
|
||||||
|
position: "nearest"
|
||||||
|
},
|
||||||
|
responsive: true,
|
||||||
|
scales:{
|
||||||
|
yAxes: [{
|
||||||
|
barPercentage: 1.6,
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(29,140,248,0.0)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
suggestedMin: 60,
|
||||||
|
suggestedMax: 125,
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#9a9a9a"
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
|
||||||
|
xAxes: [{
|
||||||
|
barPercentage: 1.6,
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(225,78,202,0.1)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#9a9a9a"
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
gradientChartOptionsConfigurationWithTooltipOrange = {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
|
||||||
|
tooltips: {
|
||||||
|
backgroundColor: '#f5f5f5',
|
||||||
|
titleFontColor: '#333',
|
||||||
|
bodyFontColor: '#666',
|
||||||
|
bodySpacing: 4,
|
||||||
|
xPadding: 12,
|
||||||
|
mode: "nearest",
|
||||||
|
intersect: 0,
|
||||||
|
position: "nearest"
|
||||||
|
},
|
||||||
|
responsive: true,
|
||||||
|
scales:{
|
||||||
|
yAxes: [{
|
||||||
|
barPercentage: 1.6,
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(29,140,248,0.0)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
suggestedMin:50,
|
||||||
|
suggestedMax: 110,
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#ff8a76"
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
|
||||||
|
xAxes: [{
|
||||||
|
barPercentage: 1.6,
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(220,53,69,0.1)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#ff8a76"
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
gradientChartOptionsConfigurationWithTooltipGreen = {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
|
||||||
|
tooltips: {
|
||||||
|
backgroundColor: '#f5f5f5',
|
||||||
|
titleFontColor: '#333',
|
||||||
|
bodyFontColor: '#666',
|
||||||
|
bodySpacing: 4,
|
||||||
|
xPadding: 12,
|
||||||
|
mode: "nearest",
|
||||||
|
intersect: 0,
|
||||||
|
position: "nearest"
|
||||||
|
},
|
||||||
|
responsive: true,
|
||||||
|
scales:{
|
||||||
|
yAxes: [{
|
||||||
|
barPercentage: 1.6,
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(29,140,248,0.0)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
suggestedMin: 50,
|
||||||
|
suggestedMax: 125,
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#9e9e9e"
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
|
||||||
|
xAxes: [{
|
||||||
|
barPercentage: 1.6,
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(0,242,195,0.1)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#9e9e9e"
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
gradientBarChartConfiguration = {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
|
||||||
|
tooltips: {
|
||||||
|
backgroundColor: '#f5f5f5',
|
||||||
|
titleFontColor: '#333',
|
||||||
|
bodyFontColor: '#666',
|
||||||
|
bodySpacing: 4,
|
||||||
|
xPadding: 12,
|
||||||
|
mode: "nearest",
|
||||||
|
intersect: 0,
|
||||||
|
position: "nearest"
|
||||||
|
},
|
||||||
|
responsive: true,
|
||||||
|
scales:{
|
||||||
|
yAxes: [{
|
||||||
|
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(29,140,248,0.1)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
suggestedMin: 60,
|
||||||
|
suggestedMax: 120,
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#9e9e9e"
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
|
||||||
|
xAxes: [{
|
||||||
|
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(29,140,248,0.1)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#9e9e9e"
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
var ctx = document.getElementById("chartLinePurple").getContext("2d");
|
||||||
|
|
||||||
|
var gradientStroke = ctx.createLinearGradient(0,230,0,50);
|
||||||
|
|
||||||
|
gradientStroke.addColorStop(1, 'rgba(72,72,176,0.2)');
|
||||||
|
gradientStroke.addColorStop(0.2, 'rgba(72,72,176,0.0)');
|
||||||
|
gradientStroke.addColorStop(0, 'rgba(119,52,169,0)'); //purple colors
|
||||||
|
|
||||||
|
var data = {
|
||||||
|
labels: ['JUL','AUG','SEP','OCT','NOV','DEC'],
|
||||||
|
datasets: [{
|
||||||
|
label: "Data",
|
||||||
|
fill: true,
|
||||||
|
backgroundColor: gradientStroke,
|
||||||
|
borderColor: '#d048b6',
|
||||||
|
borderWidth: 2,
|
||||||
|
borderDash: [],
|
||||||
|
borderDashOffset: 0.0,
|
||||||
|
pointBackgroundColor: '#d048b6',
|
||||||
|
pointBorderColor:'rgba(255,255,255,0)',
|
||||||
|
pointHoverBackgroundColor: '#d048b6',
|
||||||
|
pointBorderWidth: 20,
|
||||||
|
pointHoverRadius: 4,
|
||||||
|
pointHoverBorderWidth: 15,
|
||||||
|
pointRadius: 4,
|
||||||
|
data: [ 80, 100, 70, 80, 120, 80],
|
||||||
|
}]
|
||||||
|
};
|
||||||
|
|
||||||
|
var myChart = new Chart(ctx, {
|
||||||
|
type: 'line',
|
||||||
|
data: data,
|
||||||
|
options: gradientChartOptionsConfigurationWithTooltipPurple
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
var ctxGreen = document.getElementById("chartLineGreen").getContext("2d");
|
||||||
|
|
||||||
|
var gradientStroke = ctx.createLinearGradient(0,230,0,50);
|
||||||
|
|
||||||
|
gradientStroke.addColorStop(1, 'rgba(66,134,121,0.15)');
|
||||||
|
gradientStroke.addColorStop(0.4, 'rgba(66,134,121,0.0)'); //green colors
|
||||||
|
gradientStroke.addColorStop(0, 'rgba(66,134,121,0)'); //green colors
|
||||||
|
|
||||||
|
var data = {
|
||||||
|
labels: ['JUL','AUG','SEP','OCT','NOV'],
|
||||||
|
datasets: [{
|
||||||
|
label: "My First dataset",
|
||||||
|
fill: true,
|
||||||
|
backgroundColor: gradientStroke,
|
||||||
|
borderColor: '#00d6b4',
|
||||||
|
borderWidth: 2,
|
||||||
|
borderDash: [],
|
||||||
|
borderDashOffset: 0.0,
|
||||||
|
pointBackgroundColor: '#00d6b4',
|
||||||
|
pointBorderColor:'rgba(255,255,255,0)',
|
||||||
|
pointHoverBackgroundColor: '#00d6b4',
|
||||||
|
pointBorderWidth: 20,
|
||||||
|
pointHoverRadius: 4,
|
||||||
|
pointHoverBorderWidth: 15,
|
||||||
|
pointRadius: 4,
|
||||||
|
data: [ 90, 27, 60, 12, 80],
|
||||||
|
}]
|
||||||
|
};
|
||||||
|
|
||||||
|
var myChart = new Chart(ctxGreen, {
|
||||||
|
type: 'line',
|
||||||
|
data: data,
|
||||||
|
options: gradientChartOptionsConfigurationWithTooltipGreen
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
var chart_labels = ['JAN','FEB','MAR','APR','MAY','JUN','JUL','AUG','SEP','OCT','NOV','DEC'];
|
||||||
|
var chart_data = [ 100, 70, 90, 70, 85, 60, 75, 60, 90, 80,110, 100];
|
||||||
|
|
||||||
|
|
||||||
|
var ctx = document.getElementById("chartBig1").getContext('2d');
|
||||||
|
|
||||||
|
var gradientStroke = ctx.createLinearGradient(0,230,0,50);
|
||||||
|
|
||||||
|
gradientStroke.addColorStop(1, 'rgba(72,72,176,0.1)');
|
||||||
|
gradientStroke.addColorStop(0.4, 'rgba(72,72,176,0.0)');
|
||||||
|
gradientStroke.addColorStop(0, 'rgba(119,52,169,0)'); //purple colors
|
||||||
|
var config = {
|
||||||
|
type: 'line',
|
||||||
|
data: {
|
||||||
|
labels: chart_labels,
|
||||||
|
datasets: [{
|
||||||
|
label: "My First dataset",
|
||||||
|
fill: true,
|
||||||
|
backgroundColor: gradientStroke,
|
||||||
|
borderColor: '#d346b1',
|
||||||
|
borderWidth: 2,
|
||||||
|
borderDash: [],
|
||||||
|
borderDashOffset: 0.0,
|
||||||
|
pointBackgroundColor: '#d346b1',
|
||||||
|
pointBorderColor:'rgba(255,255,255,0)',
|
||||||
|
pointHoverBackgroundColor: '#d346b1',
|
||||||
|
pointBorderWidth: 20,
|
||||||
|
pointHoverRadius: 4,
|
||||||
|
pointHoverBorderWidth: 15,
|
||||||
|
pointRadius: 4,
|
||||||
|
data: chart_data,
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: gradientChartOptionsConfigurationWithTooltipPurple
|
||||||
|
};
|
||||||
|
var myChartData = new Chart(ctx, config);
|
||||||
|
$("#0").click(function() {
|
||||||
|
var data = myChartData.config.data;
|
||||||
|
data.datasets[0].data = chart_data;
|
||||||
|
data.labels = chart_labels;
|
||||||
|
myChartData.update();
|
||||||
|
});
|
||||||
|
$("#1").click(function() {
|
||||||
|
var chart_data = [ 80, 120, 105, 110, 95, 105, 90, 100, 80, 95,70, 120];
|
||||||
|
var data = myChartData.config.data;
|
||||||
|
data.datasets[0].data = chart_data;
|
||||||
|
data.labels = chart_labels;
|
||||||
|
myChartData.update();
|
||||||
|
});
|
||||||
|
|
||||||
|
$("#2").click(function() {
|
||||||
|
var chart_data = [ 60, 80, 65, 130, 80, 105, 90, 130, 70, 115,60, 130];
|
||||||
|
var data = myChartData.config.data;
|
||||||
|
data.datasets[0].data = chart_data;
|
||||||
|
data.labels = chart_labels;
|
||||||
|
myChartData.update();
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
var ctx = document.getElementById("CountryChart").getContext("2d");
|
||||||
|
|
||||||
|
var gradientStroke = ctx.createLinearGradient(0,230,0,50);
|
||||||
|
|
||||||
|
gradientStroke.addColorStop(1, 'rgba(29,140,248,0.2)');
|
||||||
|
gradientStroke.addColorStop(0.4, 'rgba(29,140,248,0.0)');
|
||||||
|
gradientStroke.addColorStop(0, 'rgba(29,140,248,0)'); //blue colors
|
||||||
|
|
||||||
|
|
||||||
|
var myChart = new Chart(ctx, {
|
||||||
|
type: 'bar',
|
||||||
|
responsive: true,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
data: {
|
||||||
|
labels: ['USA','GER','AUS','UK','RO','BR'],
|
||||||
|
datasets: [{
|
||||||
|
label: "Countries",
|
||||||
|
fill: true,
|
||||||
|
backgroundColor: gradientStroke,
|
||||||
|
hoverBackgroundColor: gradientStroke,
|
||||||
|
borderColor: '#1f8ef1',
|
||||||
|
borderWidth: 2,
|
||||||
|
borderDash: [],
|
||||||
|
borderDashOffset: 0.0,
|
||||||
|
data: [ 53, 20, 10, 80, 100, 45],
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: gradientBarChartConfiguration
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
initGoogleMaps: function(){
|
||||||
|
var myLatlng = new google.maps.LatLng(40.748817, -73.985428);
|
||||||
|
var mapOptions = {
|
||||||
|
zoom: 13,
|
||||||
|
center: myLatlng,
|
||||||
|
scrollwheel: false, //we disable de scroll over the map, it is a really annoing when you scroll through page
|
||||||
|
styles: [
|
||||||
|
{
|
||||||
|
"elementType": "geometry",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#1d2c4d"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"elementType": "labels.text.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#8ec3b9"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"elementType": "labels.text.stroke",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#1a3646"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "administrative.country",
|
||||||
|
"elementType": "geometry.stroke",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#4b6878"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "administrative.land_parcel",
|
||||||
|
"elementType": "labels.text.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#64779e"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "administrative.province",
|
||||||
|
"elementType": "geometry.stroke",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#4b6878"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "landscape.man_made",
|
||||||
|
"elementType": "geometry.stroke",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#334e87"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "landscape.natural",
|
||||||
|
"elementType": "geometry",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#023e58"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "poi",
|
||||||
|
"elementType": "geometry",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#283d6a"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "poi",
|
||||||
|
"elementType": "labels.text.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#6f9ba5"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "poi",
|
||||||
|
"elementType": "labels.text.stroke",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#1d2c4d"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "poi.park",
|
||||||
|
"elementType": "geometry.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#023e58"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "poi.park",
|
||||||
|
"elementType": "labels.text.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#3C7680"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "road",
|
||||||
|
"elementType": "geometry",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#304a7d"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "road",
|
||||||
|
"elementType": "labels.text.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#98a5be"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "road",
|
||||||
|
"elementType": "labels.text.stroke",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#1d2c4d"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "road.highway",
|
||||||
|
"elementType": "geometry",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#2c6675"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "road.highway",
|
||||||
|
"elementType": "geometry.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#9d2a80"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "road.highway",
|
||||||
|
"elementType": "geometry.stroke",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#9d2a80"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "road.highway",
|
||||||
|
"elementType": "labels.text.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#b0d5ce"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "road.highway",
|
||||||
|
"elementType": "labels.text.stroke",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#023e58"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "transit",
|
||||||
|
"elementType": "labels.text.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#98a5be"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "transit",
|
||||||
|
"elementType": "labels.text.stroke",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#1d2c4d"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "transit.line",
|
||||||
|
"elementType": "geometry.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#283d6a"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "transit.station",
|
||||||
|
"elementType": "geometry",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#3a4762"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "water",
|
||||||
|
"elementType": "geometry",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#0e1626"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"featureType": "water",
|
||||||
|
"elementType": "labels.text.fill",
|
||||||
|
"stylers": [
|
||||||
|
{
|
||||||
|
"color": "#4e6d70"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
var map = new google.maps.Map(document.getElementById("map"), mapOptions);
|
||||||
|
|
||||||
|
var marker = new google.maps.Marker({
|
||||||
|
position: myLatlng,
|
||||||
|
title:"Hello World!"
|
||||||
|
});
|
||||||
|
|
||||||
|
// To add the marker to the map, call setMap();
|
||||||
|
marker.setMap(map);
|
||||||
|
},
|
||||||
|
|
||||||
|
showNotification: function(from, align){
|
||||||
|
color = Math.floor((Math.random() * 4) + 1);
|
||||||
|
|
||||||
|
$.notify({
|
||||||
|
icon: "tim-icons icon-bell-55",
|
||||||
|
message: "Welcome to <b>Black Dashboard</b> - a beautiful freebie for every web developer."
|
||||||
|
|
||||||
|
},{
|
||||||
|
type: type[color],
|
||||||
|
timer: 8000,
|
||||||
|
placement: {
|
||||||
|
from: from,
|
||||||
|
align: align
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
1418
assets/demo/docs.css
Normal file
BIN
assets/demo/docs.min.css
vendored
Normal file
19
assets/demo/docs.min.js
vendored
Normal file
585
assets/demo/jquery.sharrre.js
Normal file
@ -0,0 +1,585 @@
|
|||||||
|
/*!
|
||||||
|
* Sharrre.com - Make your sharing widget!
|
||||||
|
* Version: beta 1.3.5
|
||||||
|
* Author: Julien Hany
|
||||||
|
* License: MIT http://en.wikipedia.org/wiki/MIT_License or GPLv2 http://en.wikipedia.org/wiki/GNU_General_Public_License
|
||||||
|
*/
|
||||||
|
|
||||||
|
;(function ( $, window, document, undefined ) {
|
||||||
|
|
||||||
|
/* Defaults
|
||||||
|
================================================== */
|
||||||
|
var pluginName = 'sharrre',
|
||||||
|
defaults = {
|
||||||
|
className: 'sharrre',
|
||||||
|
share: {
|
||||||
|
googlePlus: false,
|
||||||
|
facebook: false,
|
||||||
|
twitter: false,
|
||||||
|
digg: false,
|
||||||
|
delicious: false,
|
||||||
|
stumbleupon: false,
|
||||||
|
linkedin: false,
|
||||||
|
pinterest: false
|
||||||
|
},
|
||||||
|
shareTotal: 0,
|
||||||
|
template: '',
|
||||||
|
title: '',
|
||||||
|
url: document.location.href,
|
||||||
|
text: document.title,
|
||||||
|
urlCurl: 'sharrre.php', //PHP script for google plus...
|
||||||
|
count: {}, //counter by social network
|
||||||
|
total: 0, //total of sharing
|
||||||
|
shorterTotal: true, //show total by k or M when number is to big
|
||||||
|
enableHover: true, //disable if you want to personalize hover event with callback
|
||||||
|
enableCounter: true, //disable if you just want use buttons
|
||||||
|
enableTracking: false, //tracking with google analitycs
|
||||||
|
hover: function(){}, //personalize hover event with this callback function
|
||||||
|
hide: function(){}, //personalize hide event with this callback function
|
||||||
|
click: function(){}, //personalize click event with this callback function
|
||||||
|
render: function(){}, //personalize render event with this callback function
|
||||||
|
buttons: { //settings for buttons
|
||||||
|
googlePlus : { //http://www.google.com/webmasters/+1/button/
|
||||||
|
url: '', //if you need to personnalize button url
|
||||||
|
urlCount: false, //if you want to use personnalize button url on global counter
|
||||||
|
size: 'medium',
|
||||||
|
lang: 'en-US',
|
||||||
|
annotation: ''
|
||||||
|
},
|
||||||
|
facebook: { //http://developers.facebook.com/docs/reference/plugins/like/
|
||||||
|
url: '', //if you need to personalize url button
|
||||||
|
urlCount: false, //if you want to use personnalize button url on global counter
|
||||||
|
action: 'like',
|
||||||
|
layout: 'button_count',
|
||||||
|
width: '',
|
||||||
|
send: 'false',
|
||||||
|
faces: 'false',
|
||||||
|
colorscheme: '',
|
||||||
|
font: '',
|
||||||
|
lang: 'en_US'
|
||||||
|
},
|
||||||
|
twitter: { //http://twitter.com/about/resources/tweetbutton
|
||||||
|
url: '', //if you need to personalize url button
|
||||||
|
urlCount: false, //if you want to use personnalize button url on global counter
|
||||||
|
count: 'horizontal',
|
||||||
|
hashtags: '',
|
||||||
|
via: '',
|
||||||
|
related: '',
|
||||||
|
lang: 'en'
|
||||||
|
},
|
||||||
|
digg: { //http://about.digg.com/downloads/button/smart
|
||||||
|
url: '', //if you need to personalize url button
|
||||||
|
urlCount: false, //if you want to use personnalize button url on global counter
|
||||||
|
type: 'DiggCompact'
|
||||||
|
},
|
||||||
|
delicious: {
|
||||||
|
url: '', //if you need to personalize url button
|
||||||
|
urlCount: false, //if you want to use personnalize button url on global counter
|
||||||
|
size: 'medium' //medium or tall
|
||||||
|
},
|
||||||
|
stumbleupon: { //http://www.stumbleupon.com/badges/
|
||||||
|
url: '', //if you need to personalize url button
|
||||||
|
urlCount: false, //if you want to use personnalize button url on global counter
|
||||||
|
layout: '1'
|
||||||
|
},
|
||||||
|
linkedin: { //http://developer.linkedin.com/plugins/share-button
|
||||||
|
url: '', //if you need to personalize url button
|
||||||
|
urlCount: false, //if you want to use personnalize button url on global counter
|
||||||
|
counter: ''
|
||||||
|
},
|
||||||
|
pinterest: { //http://pinterest.com/about/goodies/
|
||||||
|
url: '', //if you need to personalize url button
|
||||||
|
media: '',
|
||||||
|
description: '',
|
||||||
|
layout: 'horizontal'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/* Json URL to get count number
|
||||||
|
================================================== */
|
||||||
|
urlJson = {
|
||||||
|
googlePlus: "",
|
||||||
|
|
||||||
|
//new FQL method by Sire
|
||||||
|
facebook: "https://graph.facebook.com/fql?q=SELECT%20url,%20normalized_url,%20share_count,%20like_count,%20comment_count,%20total_count,commentsbox_count,%20comments_fbid,%20click_count%20FROM%20link_stat%20WHERE%20url=%27{url}%27&callback=?",
|
||||||
|
//old method facebook: "http://graph.facebook.com/?id={url}&callback=?",
|
||||||
|
//facebook : "http://api.ak.facebook.com/restserver.php?v=1.0&method=links.getStats&urls={url}&format=json"
|
||||||
|
|
||||||
|
twitter: "http://cdn.api.twitter.com/1/urls/count.json?url={url}&callback=?",
|
||||||
|
digg: "http://services.digg.com/2.0/story.getInfo?links={url}&type=javascript&callback=?",
|
||||||
|
delicious: 'http://feeds.delicious.com/v2/json/urlinfo/data?url={url}&callback=?',
|
||||||
|
//stumbleupon: "http://www.stumbleupon.com/services/1.01/badge.getinfo?url={url}&format=jsonp&callback=?",
|
||||||
|
stumbleupon: "",
|
||||||
|
linkedin: "http://www.linkedin.com/countserv/count/share?format=jsonp&url={url}&callback=?",
|
||||||
|
pinterest: "http://api.pinterest.com/v1/urls/count.json?url={url}&callback=?"
|
||||||
|
},
|
||||||
|
/* Load share buttons asynchronously
|
||||||
|
================================================== */
|
||||||
|
loadButton = {
|
||||||
|
googlePlus : function(self){
|
||||||
|
var sett = self.options.buttons.googlePlus;
|
||||||
|
//$(self.element).find('.buttons').append('<div class="button googleplus"><g:plusone size="'+self.options.buttons.googlePlus.size+'" href="'+self.options.url+'"></g:plusone></div>');
|
||||||
|
$(self.element).find('.buttons').append('<div class="button googleplus"><div class="g-plusone" data-size="'+sett.size+'" data-href="'+(sett.url !== '' ? sett.url : self.options.url)+'" data-annotation="'+sett.annotation+'"></div></div>');
|
||||||
|
window.___gcfg = {
|
||||||
|
lang: self.options.buttons.googlePlus.lang
|
||||||
|
};
|
||||||
|
var loading = 0;
|
||||||
|
if(typeof gapi === 'undefined' && loading == 0){
|
||||||
|
loading = 1;
|
||||||
|
(function() {
|
||||||
|
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
|
||||||
|
po.src = '//apis.google.com/js/plusone.js';
|
||||||
|
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
|
||||||
|
})();
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
gapi.plusone.go();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
facebook : function(self){
|
||||||
|
var sett = self.options.buttons.facebook;
|
||||||
|
$(self.element).find('.buttons').append('<div class="button facebook"><div id="fb-root"></div><div class="fb-like" data-href="'+(sett.url !== '' ? sett.url : self.options.url)+'" data-send="'+sett.send+'" data-layout="'+sett.layout+'" data-width="'+sett.width+'" data-show-faces="'+sett.faces+'" data-action="'+sett.action+'" data-colorscheme="'+sett.colorscheme+'" data-font="'+sett.font+'" data-via="'+sett.via+'"></div></div>');
|
||||||
|
var loading = 0;
|
||||||
|
if(typeof FB === 'undefined' && loading == 0){
|
||||||
|
loading = 1;
|
||||||
|
(function(d, s, id) {
|
||||||
|
var js, fjs = d.getElementsByTagName(s)[0];
|
||||||
|
if (d.getElementById(id)) {return;}
|
||||||
|
js = d.createElement(s); js.id = id;
|
||||||
|
js.src = '//connect.facebook.net/'+sett.lang+'/all.js#xfbml=1';
|
||||||
|
fjs.parentNode.insertBefore(js, fjs);
|
||||||
|
}(document, 'script', 'facebook-jssdk'));
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
FB.XFBML.parse();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
twitter : function(self){
|
||||||
|
var sett = self.options.buttons.twitter;
|
||||||
|
$(self.element).find('.buttons').append('<div class="button twitter"><a href="https://twitter.com/share" class="twitter-share-button" data-url="'+(sett.url !== '' ? sett.url : self.options.url)+'" data-count="'+sett.count+'" data-text="'+self.options.text+'" data-via="'+sett.via+'" data-hashtags="'+sett.hashtags+'" data-related="'+sett.related+'" data-lang="'+sett.lang+'">Tweet</a></div>');
|
||||||
|
var loading = 0;
|
||||||
|
if(typeof twttr === 'undefined' && loading == 0){
|
||||||
|
loading = 1;
|
||||||
|
(function() {
|
||||||
|
var twitterScriptTag = document.createElement('script');
|
||||||
|
twitterScriptTag.type = 'text/javascript';
|
||||||
|
twitterScriptTag.async = true;
|
||||||
|
twitterScriptTag.src = '//platform.twitter.com/widgets.js';
|
||||||
|
var s = document.getElementsByTagName('script')[0];
|
||||||
|
s.parentNode.insertBefore(twitterScriptTag, s);
|
||||||
|
})();
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
$.ajax({ url: '//platform.twitter.com/widgets.js', dataType: 'script', cache:true}); //http://stackoverflow.com/q/6536108
|
||||||
|
}
|
||||||
|
},
|
||||||
|
digg : function(self){
|
||||||
|
var sett = self.options.buttons.digg;
|
||||||
|
$(self.element).find('.buttons').append('<div class="button digg"><a class="DiggThisButton '+sett.type+'" rel="nofollow external" href="http://digg.com/submit?url='+encodeURIComponent((sett.url !== '' ? sett.url : self.options.url))+'"></a></div>');
|
||||||
|
var loading = 0;
|
||||||
|
if(typeof __DBW === 'undefined' && loading == 0){
|
||||||
|
loading = 1;
|
||||||
|
(function() {
|
||||||
|
var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0];
|
||||||
|
s.type = 'text/javascript';
|
||||||
|
s.async = true;
|
||||||
|
s.src = '//widgets.digg.com/buttons.js';
|
||||||
|
s1.parentNode.insertBefore(s, s1);
|
||||||
|
})();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
delicious : function(self){
|
||||||
|
if(self.options.buttons.delicious.size == 'tall'){//tall
|
||||||
|
var css = 'width:50px;',
|
||||||
|
cssCount = 'height:35px;width:50px;font-size:15px;line-height:35px;',
|
||||||
|
cssShare = 'height:18px;line-height:18px;margin-top:3px;';
|
||||||
|
}
|
||||||
|
else{//medium
|
||||||
|
var css = 'width:93px;',
|
||||||
|
cssCount = 'float:right;padding:0 3px;height:20px;width:26px;line-height:20px;',
|
||||||
|
cssShare = 'float:left;height:20px;line-height:20px;';
|
||||||
|
}
|
||||||
|
var count = self.shorterTotal(self.options.count.delicious);
|
||||||
|
if(typeof count === "undefined"){
|
||||||
|
count = 0;
|
||||||
|
}
|
||||||
|
$(self.element).find('.buttons').append(
|
||||||
|
'<div class="button delicious"><div style="'+css+'font:12px Arial,Helvetica,sans-serif;cursor:pointer;color:#666666;display:inline-block;float:none;height:20px;line-height:normal;margin:0;padding:0;text-indent:0;vertical-align:baseline;">'+
|
||||||
|
'<div style="'+cssCount+'background-color:#fff;margin-bottom:5px;overflow:hidden;text-align:center;border:1px solid #ccc;border-radius:3px;">'+count+'</div>'+
|
||||||
|
'<div style="'+cssShare+'display:block;padding:0;text-align:center;text-decoration:none;width:50px;background-color:#7EACEE;border:1px solid #40679C;border-radius:3px;color:#fff;">'+
|
||||||
|
'<img src="http://www.delicious.com/static/img/delicious.small.gif" height="10" width="10" alt="Delicious" /> Add</div></div></div>');
|
||||||
|
|
||||||
|
$(self.element).find('.delicious').on('click', function(){
|
||||||
|
self.openPopup('delicious');
|
||||||
|
});
|
||||||
|
},
|
||||||
|
stumbleupon : function(self){
|
||||||
|
var sett = self.options.buttons.stumbleupon;
|
||||||
|
$(self.element).find('.buttons').append('<div class="button stumbleupon"><su:badge layout="'+sett.layout+'" location="'+(sett.url !== '' ? sett.url : self.options.url)+'"></su:badge></div>');
|
||||||
|
var loading = 0;
|
||||||
|
if(typeof STMBLPN === 'undefined' && loading == 0){
|
||||||
|
loading = 1;
|
||||||
|
(function() {
|
||||||
|
var li = document.createElement('script');li.type = 'text/javascript';li.async = true;
|
||||||
|
li.src = '//platform.stumbleupon.com/1/widgets.js';
|
||||||
|
var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(li, s);
|
||||||
|
})();
|
||||||
|
s = window.setTimeout(function(){
|
||||||
|
if(typeof STMBLPN !== 'undefined'){
|
||||||
|
STMBLPN.processWidgets();
|
||||||
|
clearInterval(s);
|
||||||
|
}
|
||||||
|
},500);
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
STMBLPN.processWidgets();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
linkedin : function(self){
|
||||||
|
var sett = self.options.buttons.linkedin;
|
||||||
|
$(self.element).find('.buttons').append('<div class="button linkedin"><script type="in/share" data-url="'+(sett.url !== '' ? sett.url : self.options.url)+'" data-counter="'+sett.counter+'"></script></div>');
|
||||||
|
var loading = 0;
|
||||||
|
if(typeof window.IN === 'undefined' && loading == 0){
|
||||||
|
loading = 1;
|
||||||
|
(function() {
|
||||||
|
var li = document.createElement('script');li.type = 'text/javascript';li.async = true;
|
||||||
|
li.src = '//platform.linkedin.com/in.js';
|
||||||
|
var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(li, s);
|
||||||
|
})();
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
window.IN.init();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
pinterest : function(self){
|
||||||
|
var sett = self.options.buttons.pinterest;
|
||||||
|
$(self.element).find('.buttons').append('<div class="button pinterest"><a href="http://pinterest.com/pin/create/button/?url='+(sett.url !== '' ? sett.url : self.options.url)+'&media='+sett.media+'&description='+sett.description+'" class="pin-it-button" count-layout="'+sett.layout+'">Pin It</a></div>');
|
||||||
|
|
||||||
|
(function() {
|
||||||
|
var li = document.createElement('script');li.type = 'text/javascript';li.async = true;
|
||||||
|
li.src = '//assets.pinterest.com/js/pinit.js';
|
||||||
|
var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(li, s);
|
||||||
|
})();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/* Tracking for Google Analytics
|
||||||
|
================================================== */
|
||||||
|
tracking = {
|
||||||
|
googlePlus: function(){},
|
||||||
|
facebook: function(){
|
||||||
|
//console.log('facebook');
|
||||||
|
fb = window.setInterval(function(){
|
||||||
|
if (typeof FB !== 'undefined') {
|
||||||
|
FB.Event.subscribe('edge.create', function(targetUrl) {
|
||||||
|
_gaq.push(['_trackSocial', 'facebook', 'like', targetUrl]);
|
||||||
|
});
|
||||||
|
FB.Event.subscribe('edge.remove', function(targetUrl) {
|
||||||
|
_gaq.push(['_trackSocial', 'facebook', 'unlike', targetUrl]);
|
||||||
|
});
|
||||||
|
FB.Event.subscribe('message.send', function(targetUrl) {
|
||||||
|
_gaq.push(['_trackSocial', 'facebook', 'send', targetUrl]);
|
||||||
|
});
|
||||||
|
//console.log('ok');
|
||||||
|
clearInterval(fb);
|
||||||
|
}
|
||||||
|
},1000);
|
||||||
|
},
|
||||||
|
twitter: function(){
|
||||||
|
//console.log('twitter');
|
||||||
|
tw = window.setInterval(function(){
|
||||||
|
if (typeof twttr !== 'undefined') {
|
||||||
|
twttr.events.bind('tweet', function(event) {
|
||||||
|
if (event) {
|
||||||
|
_gaq.push(['_trackSocial', 'twitter', 'tweet']);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
//console.log('ok');
|
||||||
|
clearInterval(tw);
|
||||||
|
}
|
||||||
|
},1000);
|
||||||
|
},
|
||||||
|
digg: function(){
|
||||||
|
//if somenone find a solution, mail me !
|
||||||
|
/*$(this.element).find('.digg').on('click', function(){
|
||||||
|
_gaq.push(['_trackSocial', 'digg', 'add']);
|
||||||
|
});*/
|
||||||
|
},
|
||||||
|
delicious: function(){},
|
||||||
|
stumbleupon: function(){},
|
||||||
|
linkedin: function(){
|
||||||
|
function LinkedInShare() {
|
||||||
|
_gaq.push(['_trackSocial', 'linkedin', 'share']);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
pinterest: function(){
|
||||||
|
//if somenone find a solution, mail me !
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/* Popup for each social network
|
||||||
|
================================================== */
|
||||||
|
popup = {
|
||||||
|
googlePlus: function(opt){
|
||||||
|
window.open("https://plus.google.com/share?hl="+opt.buttons.googlePlus.lang+"&url="+encodeURIComponent((opt.buttons.googlePlus.url !== '' ? opt.buttons.googlePlus.url : opt.url)), "", "toolbar=0, status=0, width=900, height=500");
|
||||||
|
},
|
||||||
|
facebook: function(opt){
|
||||||
|
window.open("http://www.facebook.com/sharer/sharer.php?u="+encodeURIComponent((opt.buttons.facebook.url !== '' ? opt.buttons.facebook.url : opt.url))+"&t="+opt.text+"", "", "toolbar=0, status=0, width=900, height=500");
|
||||||
|
},
|
||||||
|
twitter: function(opt){
|
||||||
|
window.open("https://twitter.com/intent/tweet?text="+encodeURIComponent(opt.text)+"&url="+encodeURIComponent((opt.buttons.twitter.url !== '' ? opt.buttons.twitter.url : opt.url))+(opt.buttons.twitter.via !== '' ? '&via='+opt.buttons.twitter.via : ''), "", "toolbar=0, status=0, width=650, height=360");
|
||||||
|
},
|
||||||
|
digg: function(opt){
|
||||||
|
window.open("http://digg.com/tools/diggthis/submit?url="+encodeURIComponent((opt.buttons.digg.url !== '' ? opt.buttons.digg.url : opt.url))+"&title="+opt.text+"&related=true&style=true", "", "toolbar=0, status=0, width=650, height=360");
|
||||||
|
},
|
||||||
|
delicious: function(opt){
|
||||||
|
window.open('http://www.delicious.com/save?v=5&noui&jump=close&url='+encodeURIComponent((opt.buttons.delicious.url !== '' ? opt.buttons.delicious.url : opt.url))+'&title='+opt.text, 'delicious', 'toolbar=no,width=550,height=550');
|
||||||
|
},
|
||||||
|
stumbleupon: function(opt){
|
||||||
|
window.open('http://www.stumbleupon.com/badge/?url='+encodeURIComponent((opt.buttons.stumbleupon.url !== '' ? opt.buttons.stumbleupon.url : opt.url)), 'stumbleupon', 'toolbar=no,width=550,height=550');
|
||||||
|
},
|
||||||
|
linkedin: function(opt){
|
||||||
|
window.open('https://www.linkedin.com/cws/share?url='+encodeURIComponent((opt.buttons.linkedin.url !== '' ? opt.buttons.linkedin.url : opt.url))+'&token=&isFramed=true', 'linkedin', 'toolbar=no,width=550,height=550');
|
||||||
|
},
|
||||||
|
pinterest: function(opt){
|
||||||
|
window.open('http://pinterest.com/pin/create/button/?url='+encodeURIComponent((opt.buttons.pinterest.url !== '' ? opt.buttons.pinterest.url : opt.url))+'&media='+encodeURIComponent(opt.buttons.pinterest.media)+'&description='+opt.buttons.pinterest.description, 'pinterest', 'toolbar=no,width=700,height=300');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/* Plugin constructor
|
||||||
|
================================================== */
|
||||||
|
function Plugin( element, options ) {
|
||||||
|
this.element = element;
|
||||||
|
|
||||||
|
this.options = $.extend( true, {}, defaults, options);
|
||||||
|
this.options.share = options.share; //simple solution to allow order of buttons
|
||||||
|
|
||||||
|
this._defaults = defaults;
|
||||||
|
this._name = pluginName;
|
||||||
|
|
||||||
|
this.init();
|
||||||
|
};
|
||||||
|
|
||||||
|
/* Initialization method
|
||||||
|
================================================== */
|
||||||
|
Plugin.prototype.init = function () {
|
||||||
|
var self = this;
|
||||||
|
if(this.options.urlCurl !== ''){
|
||||||
|
urlJson.googlePlus = this.options.urlCurl + '?url={url}&type=googlePlus'; // PHP script for GooglePlus...
|
||||||
|
urlJson.stumbleupon = this.options.urlCurl + '?url={url}&type=stumbleupon'; // PHP script for Stumbleupon...
|
||||||
|
}
|
||||||
|
$(this.element).addClass(this.options.className); //add class
|
||||||
|
|
||||||
|
//HTML5 Custom data
|
||||||
|
if(typeof $(this.element).data('title') !== 'undefined'){
|
||||||
|
this.options.title = $(this.element).attr('data-title');
|
||||||
|
}
|
||||||
|
if(typeof $(this.element).data('url') !== 'undefined'){
|
||||||
|
this.options.url = $(this.element).data('url');
|
||||||
|
}
|
||||||
|
if(typeof $(this.element).data('text') !== 'undefined'){
|
||||||
|
this.options.text = $(this.element).data('text');
|
||||||
|
}
|
||||||
|
|
||||||
|
//how many social website have been selected
|
||||||
|
$.each(this.options.share, function(name, val) {
|
||||||
|
if(val === true){
|
||||||
|
self.options.shareTotal ++;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if(self.options.enableCounter === true){ //if for some reason you don't need counter
|
||||||
|
//get count of social share that have been selected
|
||||||
|
$.each(this.options.share, function(name, val) {
|
||||||
|
if(val === true){
|
||||||
|
//self.getSocialJson(name);
|
||||||
|
try {
|
||||||
|
self.getSocialJson(name);
|
||||||
|
} catch(e){
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
else if(self.options.template !== ''){ //for personalized button (with template)
|
||||||
|
this.options.render(this, this.options);
|
||||||
|
}
|
||||||
|
else{ // if you want to use official button like example 3 or 5
|
||||||
|
this.loadButtons();
|
||||||
|
}
|
||||||
|
|
||||||
|
//add hover event
|
||||||
|
$(this.element).hover(function(){
|
||||||
|
//load social button if enable and 1 time
|
||||||
|
if($(this).find('.buttons').length === 0 && self.options.enableHover === true){
|
||||||
|
self.loadButtons();
|
||||||
|
}
|
||||||
|
self.options.hover(self, self.options);
|
||||||
|
}, function(){
|
||||||
|
self.options.hide(self, self.options);
|
||||||
|
});
|
||||||
|
|
||||||
|
//click event
|
||||||
|
$(this.element).click(function(){
|
||||||
|
self.options.click(self, self.options);
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
/* loadButtons methode
|
||||||
|
================================================== */
|
||||||
|
Plugin.prototype.loadButtons = function () {
|
||||||
|
var self = this;
|
||||||
|
$(this.element).append('<div class="buttons"></div>');
|
||||||
|
$.each(self.options.share, function(name, val) {
|
||||||
|
if(val == true){
|
||||||
|
loadButton[name](self);
|
||||||
|
if(self.options.enableTracking === true){ //add tracking
|
||||||
|
tracking[name]();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
/* getSocialJson methode
|
||||||
|
================================================== */
|
||||||
|
Plugin.prototype.getSocialJson = function (name) {
|
||||||
|
var self = this,
|
||||||
|
count = 0,
|
||||||
|
url = urlJson[name].replace('{url}', encodeURIComponent(this.options.url));
|
||||||
|
if(this.options.buttons[name].urlCount === true && this.options.buttons[name].url !== ''){
|
||||||
|
url = urlJson[name].replace('{url}', this.options.buttons[name].url);
|
||||||
|
}
|
||||||
|
//console.log('name : ' + name + ' - url : '+url); //debug
|
||||||
|
if(url != '' && self.options.urlCurl !== ''){ //urlCurl = '' if you don't want to used PHP script but used social button
|
||||||
|
$.getJSON(url, function(json){
|
||||||
|
if(typeof json.count !== "undefined"){ //GooglePlus, Stumbleupon, Twitter, Pinterest and Digg
|
||||||
|
var temp = json.count + '';
|
||||||
|
temp = temp.replace('\u00c2\u00a0', ''); //remove google plus special chars
|
||||||
|
count += parseInt(temp, 10);
|
||||||
|
}
|
||||||
|
//get the FB total count (shares, likes and more)
|
||||||
|
else if(json.data && json.data.length > 0 && typeof json.data[0].total_count !== "undefined"){ //Facebook total count
|
||||||
|
count += parseInt(json.data[0].total_count, 10);
|
||||||
|
}
|
||||||
|
else if(typeof json[0] !== "undefined"){ //Delicious
|
||||||
|
count += parseInt(json[0].total_posts, 10);
|
||||||
|
}
|
||||||
|
else if(typeof json[0] !== "undefined"){ //Stumbleupon
|
||||||
|
}
|
||||||
|
self.options.count[name] = count;
|
||||||
|
self.options.total += count;
|
||||||
|
self.renderer();
|
||||||
|
self.rendererPerso();
|
||||||
|
//console.log(json); //debug
|
||||||
|
})
|
||||||
|
.error(function() {
|
||||||
|
self.options.count[name] = 0;
|
||||||
|
self.rendererPerso();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
self.renderer();
|
||||||
|
self.options.count[name] = 0;
|
||||||
|
self.rendererPerso();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/* launch render methode
|
||||||
|
================================================== */
|
||||||
|
Plugin.prototype.rendererPerso = function () {
|
||||||
|
//check if this is the last social website to launch render
|
||||||
|
var shareCount = 0;
|
||||||
|
for (e in this.options.count) { shareCount++; }
|
||||||
|
if(shareCount === this.options.shareTotal){
|
||||||
|
this.options.render(this, this.options);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/* render methode
|
||||||
|
================================================== */
|
||||||
|
Plugin.prototype.renderer = function () {
|
||||||
|
var total = this.options.total,
|
||||||
|
template = this.options.template;
|
||||||
|
if(this.options.shorterTotal === true){ //format number like 1.2k or 5M
|
||||||
|
total = this.shorterTotal(total);
|
||||||
|
}
|
||||||
|
|
||||||
|
if(template !== ''){ //if there is a template
|
||||||
|
template = template.replace('{total}', total);
|
||||||
|
$(this.element).html(template);
|
||||||
|
}
|
||||||
|
else{ //template by defaults
|
||||||
|
$(this.element).html(
|
||||||
|
'<div class="box"><a class="count" href="#">' + total + '</a>' +
|
||||||
|
(this.options.title !== '' ? '<a class="share" href="#">' + this.options.title + '</a>' : '') +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/* format total numbers like 1.2k or 5M
|
||||||
|
================================================== */
|
||||||
|
Plugin.prototype.shorterTotal = function (num) {
|
||||||
|
if (num >= 1e6){
|
||||||
|
num = (num / 1e6).toFixed(2) + "M"
|
||||||
|
} else if (num >= 1e3){
|
||||||
|
num = (num / 1e3).toFixed(1) + "k"
|
||||||
|
}
|
||||||
|
return num;
|
||||||
|
};
|
||||||
|
|
||||||
|
/* Methode for open popup
|
||||||
|
================================================== */
|
||||||
|
Plugin.prototype.openPopup = function (site) {
|
||||||
|
popup[site](this.options); //open
|
||||||
|
if(this.options.enableTracking === true){ //tracking!
|
||||||
|
var tracking = {
|
||||||
|
googlePlus: {site: 'Google', action: '+1'},
|
||||||
|
facebook: {site: 'facebook', action: 'like'},
|
||||||
|
twitter: {site: 'twitter', action: 'tweet'},
|
||||||
|
digg: {site: 'digg', action: 'add'},
|
||||||
|
delicious: {site: 'delicious', action: 'add'},
|
||||||
|
stumbleupon: {site: 'stumbleupon', action: 'add'},
|
||||||
|
linkedin: {site: 'linkedin', action: 'share'},
|
||||||
|
pinterest: {site: 'pinterest', action: 'pin'}
|
||||||
|
};
|
||||||
|
_gaq.push(['_trackSocial', tracking[site].site, tracking[site].action]);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/* Methode for add +1 to a counter
|
||||||
|
================================================== */
|
||||||
|
Plugin.prototype.simulateClick = function () {
|
||||||
|
var html = $(this.element).html();
|
||||||
|
$(this.element).html(html.replace(this.options.total, this.options.total+1));
|
||||||
|
};
|
||||||
|
|
||||||
|
/* Methode for add +1 to a counter
|
||||||
|
================================================== */
|
||||||
|
Plugin.prototype.update = function (url, text) {
|
||||||
|
if(url !== ''){
|
||||||
|
this.options.url = url;
|
||||||
|
}
|
||||||
|
if(text !== ''){
|
||||||
|
this.options.text = text;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/* A really lightweight plugin wrapper around the constructor, preventing against multiple instantiations
|
||||||
|
================================================== */
|
||||||
|
$.fn[pluginName] = function ( options ) {
|
||||||
|
var args = arguments;
|
||||||
|
if (options === undefined || typeof options === 'object') {
|
||||||
|
return this.each(function () {
|
||||||
|
if (!$.data(this, 'plugin_' + pluginName)) {
|
||||||
|
$.data(this, 'plugin_' + pluginName, new Plugin( this, options ));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else if (typeof options === 'string' && options[0] !== '_' && options !== 'init') {
|
||||||
|
return this.each(function () {
|
||||||
|
var instance = $.data(this, 'plugin_' + pluginName);
|
||||||
|
if (instance instanceof Plugin && typeof instance[options] === 'function') {
|
||||||
|
instance[options].apply( instance, Array.prototype.slice.call( args, 1 ) );
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
})(jQuery, window, document);
|
||||||
119
assets/demo/src/application.js
Normal file
@ -0,0 +1,119 @@
|
|||||||
|
// NOTICE!! DO NOT USE ANY OF THIS JAVASCRIPT
|
||||||
|
// IT'S ALL JUST JUNK FOR OUR DOCS!
|
||||||
|
// ++++++++++++++++++++++++++++++++++++++++++
|
||||||
|
|
||||||
|
/*!
|
||||||
|
* JavaScript for Bootstrap's docs (https://getbootstrap.com)
|
||||||
|
* Copyright 2011-2017 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2017 Twitter, Inc.
|
||||||
|
* Licensed under the Creative Commons Attribution 3.0 Unported License. For
|
||||||
|
* details, see https://creativecommons.org/licenses/by/3.0/.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* global Clipboard, anchors */
|
||||||
|
|
||||||
|
(function($) {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
$(function() {
|
||||||
|
// Indeterminate checkbox example
|
||||||
|
$('.bd-example-indeterminate [type="checkbox"]').prop(
|
||||||
|
'indeterminate',
|
||||||
|
true
|
||||||
|
);
|
||||||
|
|
||||||
|
// Tooltip and popover demos
|
||||||
|
$('.tooltip-demo').tooltip({
|
||||||
|
selector: '[data-toggle="tooltip"]',
|
||||||
|
container: 'body',
|
||||||
|
});
|
||||||
|
|
||||||
|
$('[data-toggle="popover"]').popover();
|
||||||
|
|
||||||
|
// Demos within modals
|
||||||
|
$('.tooltip-test').tooltip();
|
||||||
|
$('.popover-test').popover();
|
||||||
|
|
||||||
|
// Indeterminate checkbox example
|
||||||
|
$('.bd-example-indeterminate [type="checkbox"]').prop(
|
||||||
|
'indeterminate',
|
||||||
|
true
|
||||||
|
);
|
||||||
|
|
||||||
|
// Disable empty links in docs examples
|
||||||
|
$('.bd-content [href="#"]').click(function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Modal relatedTarget demo
|
||||||
|
$('#exampleModal').on('show.bs.modal', function(event) {
|
||||||
|
var $button = $(event.relatedTarget); // Button that triggered the modal
|
||||||
|
var recipient = $button.data('whatever'); // Extract info from data-* attributes
|
||||||
|
// If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
|
||||||
|
// Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
|
||||||
|
var $modal = $(this);
|
||||||
|
$modal.find('.modal-title').text('New message to ' + recipient);
|
||||||
|
$modal.find('.modal-body input').val(recipient);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Activate animated progress bar
|
||||||
|
$('.bd-toggle-animated-progress').on('click', function() {
|
||||||
|
$(this)
|
||||||
|
.siblings('.progress')
|
||||||
|
.find('.progress-bar-striped')
|
||||||
|
.toggleClass('progress-bar-animated');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Insert copy to clipboard button before .highlight
|
||||||
|
$('.highlight').each(function() {
|
||||||
|
var btnHtml =
|
||||||
|
'<div class="bd-clipboard"><button class="btn-clipboard" title="Copy to clipboard">Copy</button></div>';
|
||||||
|
$(this).before(btnHtml);
|
||||||
|
$('.btn-clipboard').tooltip().on('mouseleave', function() {
|
||||||
|
// explicitly hide tooltip, since after clicking it remains
|
||||||
|
// focused (as it's a button), so tooltip would otherwise
|
||||||
|
// remain visible until focus is moved away
|
||||||
|
$(this).tooltip('hide');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
var clipboard = new Clipboard('.btn-clipboard', {
|
||||||
|
target: function(trigger) {
|
||||||
|
return trigger.parentNode.nextElementSibling;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
clipboard.on('success', function(e) {
|
||||||
|
$(e.trigger)
|
||||||
|
.attr('title', 'Copied!')
|
||||||
|
.tooltip('_fixTitle')
|
||||||
|
.tooltip('show')
|
||||||
|
.attr('title', 'Copy to clipboard')
|
||||||
|
.tooltip('_fixTitle');
|
||||||
|
|
||||||
|
e.clearSelection();
|
||||||
|
});
|
||||||
|
|
||||||
|
clipboard.on('error', function(e) {
|
||||||
|
var modifierKey = /Mac/i.test(navigator.userAgent) ? '\u2318' : 'Ctrl-';
|
||||||
|
var fallbackMsg = 'Press ' + modifierKey + 'C to copy';
|
||||||
|
|
||||||
|
$(e.trigger)
|
||||||
|
.attr('title', fallbackMsg)
|
||||||
|
.tooltip('_fixTitle')
|
||||||
|
.tooltip('show')
|
||||||
|
.attr('title', 'Copy to clipboard')
|
||||||
|
.tooltip('_fixTitle');
|
||||||
|
});
|
||||||
|
|
||||||
|
anchors.options = {
|
||||||
|
icon: '#',
|
||||||
|
};
|
||||||
|
anchors.add(
|
||||||
|
'.bd-content > h2, .bd-content > h3, .bd-content > h4, .bd-content > h5'
|
||||||
|
);
|
||||||
|
$(
|
||||||
|
'.bd-content > h2, .bd-content > h3, .bd-content > h4, .bd-content > h5'
|
||||||
|
).wrapInner('<div></div>');
|
||||||
|
});
|
||||||
|
})(jQuery);
|
||||||
6
assets/demo/vendor/anchor.min.js
vendored
Normal file
7
assets/demo/vendor/clipboard.min.js
vendored
Normal file
13
assets/demo/vendor/holder.min.js
vendored
Normal file
21
assets/demo/vendor/split.min.js
vendored
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
|
||||||
|
var _gaq=_gaq||[]
|
||||||
|
Split=(function(){var config={},defaults={cookieName:'abTest',cookieAge:30,customVariableName:'AB Test alternative',customVariableIndex:1}
|
||||||
|
function createCookie(name,value,days){if(days){var date=new Date();date.setTime(date.getTime()+(days*24*60*60*1000));var expires="; expires="+date.toGMTString();}
|
||||||
|
else var expires="";document.cookie=name+"="+value+expires+"; path=/";}
|
||||||
|
function readCookie(name){var nameEQ=name+"=";var ca=document.cookie.split(';');for(var i=0;i<ca.length;i++){var c=ca[i];while(c.charAt(0)==' ')c=c.substring(1,c.length);if(c.indexOf(nameEQ)==0)return c.substring(nameEQ.length,c.length);}
|
||||||
|
return null;}
|
||||||
|
function eraseCookie(name){createCookie(name,"",-1);}
|
||||||
|
function getKeys(obj)
|
||||||
|
{var keys=[];for(var i in obj)if(obj.hasOwnProperty(i))
|
||||||
|
{keys.push(i);}
|
||||||
|
return keys;}
|
||||||
|
function init(){alternatives=arguments[0]
|
||||||
|
options=arguments[1]
|
||||||
|
keys=getKeys(alternatives);config={}
|
||||||
|
if(options!=undefined){for(k in defaults){config[k]=(options[k]!=undefined)?options[k]:defaults[k];}}else{config=defaults;}
|
||||||
|
var alternative=readCookie(config.cookieName)
|
||||||
|
if(alternative){}else{alternative=keys[Math.floor(Math.random()*keys.length)]
|
||||||
|
createCookie(config.cookieName,alternative,config.cookieAge)}
|
||||||
|
_gaq.push(['_setCustomVar',config.customVariableIndex,config.customVariableName,alternative,1]);alternatives[alternative]();}
|
||||||
|
return{setup:function(args,options){init(args,options)}}})();
|
||||||
BIN
assets/fonts/nucleo.eot
Normal file
BIN
assets/fonts/nucleo.ttf
Normal file
BIN
assets/fonts/nucleo.woff
Normal file
BIN
assets/fonts/nucleo.woff2
Normal file
BIN
assets/img/dashboard/free/12345.png
Normal file
|
After Width: | Height: | Size: 1.6 MiB |
BIN
assets/img/dashboard/free/anime3.png
Normal file
|
After Width: | Height: | Size: 37 KiB |
BIN
assets/img/dashboard/free/anime6.png
Normal file
|
After Width: | Height: | Size: 39 KiB |
BIN
assets/img/dashboard/free/apple-icon.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
BIN
assets/img/dashboard/free/bg5.jpg
Normal file
|
After Width: | Height: | Size: 208 KiB |
BIN
assets/img/dashboard/free/default-avatar.png
Normal file
|
After Width: | Height: | Size: 2.8 KiB |
BIN
assets/img/dashboard/free/emilyz.jpg
Normal file
|
After Width: | Height: | Size: 84 KiB |
BIN
assets/img/dashboard/free/favicon.png
Normal file
|
After Width: | Height: | Size: 2.7 KiB |
BIN
assets/img/dashboard/free/header.jpg
Normal file
|
After Width: | Height: | Size: 655 KiB |
BIN
assets/img/dashboard/free/img_3115.jpg
Normal file
|
After Width: | Height: | Size: 38 KiB |
BIN
assets/img/dashboard/free/james.jpg
Normal file
|
After Width: | Height: | Size: 73 KiB |
BIN
assets/img/dashboard/free/mike.jpg
Normal file
|
After Width: | Height: | Size: 75 KiB |
BIN
assets/img/dashboard/free/now-logo.png
Normal file
|
After Width: | Height: | Size: 8.0 KiB |
6
assets/js/core/bootstrap.min.js
vendored
Normal file
4
assets/js/core/jquery.min.js
vendored
Normal file
4
assets/js/core/popper.min.js
vendored
Normal file
252
assets/js/dashboard-free.js
Normal file
@ -0,0 +1,252 @@
|
|||||||
|
/*!
|
||||||
|
|
||||||
|
=========================================================
|
||||||
|
* Black Dashboard Flask - v1.0.0
|
||||||
|
=========================================================
|
||||||
|
|
||||||
|
* Product Page: https://www.creative-tim.com/product/black-dashboard
|
||||||
|
* Copyright 2019 Creative Tim (https://www.creative-tim.com)
|
||||||
|
* Licensed under MIT (https://github.com/creativetimofficial/black-dashboard/blob/master/LICENSE.md)
|
||||||
|
|
||||||
|
* Coded by Creative Tim
|
||||||
|
|
||||||
|
=========================================================
|
||||||
|
|
||||||
|
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
var transparent = true;
|
||||||
|
var transparentDemo = true;
|
||||||
|
var fixedTop = false;
|
||||||
|
|
||||||
|
var navbar_initialized = false;
|
||||||
|
var backgroundOrange = false;
|
||||||
|
var sidebar_mini_active = false;
|
||||||
|
var toggle_initialized = false;
|
||||||
|
|
||||||
|
var $html = $('html');
|
||||||
|
var $body = $('body');
|
||||||
|
var $navbar_minimize_fixed = $('.navbar-minimize-fixed');
|
||||||
|
var $collapse = $('.collapse');
|
||||||
|
var $navbar = $('.navbar');
|
||||||
|
var $tagsinput = $('.tagsinput');
|
||||||
|
var $selectpicker = $('.selectpicker');
|
||||||
|
var $navbar_color = $('.navbar[color-on-scroll]');
|
||||||
|
var $full_screen_map = $('.full-screen-map');
|
||||||
|
var $datetimepicker = $('.datetimepicker');
|
||||||
|
var $datepicker = $('.datepicker');
|
||||||
|
var $timepicker = $('.timepicker');
|
||||||
|
|
||||||
|
var seq = 0, delays = 80, durations = 500;
|
||||||
|
var seq2 = 0, delays2 = 80, durations2 = 500;
|
||||||
|
|
||||||
|
(function(){
|
||||||
|
var isWindows = navigator.platform.indexOf('Win') > -1 ? true : false;
|
||||||
|
|
||||||
|
if (isWindows){
|
||||||
|
// if we are on windows OS we activate the perfectScrollbar function
|
||||||
|
if($('.main-panel').length != 0){
|
||||||
|
var ps = new PerfectScrollbar('.main-panel',{
|
||||||
|
wheelSpeed: 2,
|
||||||
|
wheelPropagation: true,
|
||||||
|
minScrollbarLength: 20,
|
||||||
|
suppressScrollX: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if($('.sidebar .sidebar-wrapper').length != 0){
|
||||||
|
|
||||||
|
var ps1 = new PerfectScrollbar('.sidebar .sidebar-wrapper');
|
||||||
|
$('.table-responsive').each(function(){
|
||||||
|
var ps2 = new PerfectScrollbar($(this)[0]);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$html.addClass('perfect-scrollbar-on');
|
||||||
|
} else {
|
||||||
|
$html.addClass('perfect-scrollbar-off');
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
var scroll_start = 0;
|
||||||
|
var startchange=$('.row');
|
||||||
|
var offset = startchange.offset();
|
||||||
|
var scrollElement = navigator.platform.indexOf('Win') > -1 ? $(".ps"):$(window);
|
||||||
|
scrollElement.scroll(function(){
|
||||||
|
|
||||||
|
scroll_start = $(this).scrollTop();
|
||||||
|
|
||||||
|
if(scroll_start > 50){
|
||||||
|
$(".navbar-minimize-fixed").css('opacity', '1');
|
||||||
|
} else {
|
||||||
|
$(".navbar-minimize-fixed").css('opacity', '0');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
$(document).scroll(function(){
|
||||||
|
scroll_start = $(this).scrollTop();
|
||||||
|
if(scroll_start > offset.top){
|
||||||
|
$(".navbar-minimize-fixed").css('opacity', '1');
|
||||||
|
} else {
|
||||||
|
$(".navbar-minimize-fixed").css('opacity', '0');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if( $('.full-screen-map').length == 0 && $('.bd-docs').length == 0 ){
|
||||||
|
// On click navbar-collapse the menu will be white not transparent
|
||||||
|
$('.collapse').on('show.bs.collapse', function () {
|
||||||
|
$(this).closest('.navbar').removeClass('navbar-transparent').addClass('bg-white');
|
||||||
|
}).on('hide.bs.collapse', function () {
|
||||||
|
$(this).closest('.navbar').addClass('navbar-transparent').removeClass('bg-white');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
blackDashboard.initMinimizeSidebar();
|
||||||
|
|
||||||
|
$navbar = $('.navbar[color-on-scroll]');
|
||||||
|
scroll_distance = $navbar.attr('color-on-scroll') || 500;
|
||||||
|
|
||||||
|
// Check if we have the class "navbar-color-on-scroll" then add the function to remove the class "navbar-transparent" so it will transform to a plain color.
|
||||||
|
if($('.navbar[color-on-scroll]').length != 0){
|
||||||
|
blackDashboard.checkScrollForTransparentNavbar();
|
||||||
|
$(window).on('scroll', blackDashboard.checkScrollForTransparentNavbar)
|
||||||
|
}
|
||||||
|
|
||||||
|
$('.form-control').on("focus", function(){
|
||||||
|
$(this).parent('.input-group').addClass("input-group-focus");
|
||||||
|
}).on("blur", function(){
|
||||||
|
$(this).parent(".input-group").removeClass("input-group-focus");
|
||||||
|
});
|
||||||
|
|
||||||
|
// Activate bootstrapSwitch
|
||||||
|
$('.bootstrap-switch').each(function(){
|
||||||
|
$this = $(this);
|
||||||
|
data_on_label = $this.data('on-label') || '';
|
||||||
|
data_off_label = $this.data('off-label') || '';
|
||||||
|
|
||||||
|
$this.bootstrapSwitch({
|
||||||
|
onText: data_on_label,
|
||||||
|
offText: data_off_label
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).on('click', '.navbar-toggle', function(){
|
||||||
|
var $toggle = $(this);
|
||||||
|
|
||||||
|
if(blackDashboard.misc.navbar_menu_visible == 1) {
|
||||||
|
$html.removeClass('nav-open');
|
||||||
|
blackDashboard.misc.navbar_menu_visible = 0;
|
||||||
|
setTimeout(function(){
|
||||||
|
$toggle.removeClass('toggled');
|
||||||
|
$('.bodyClick').remove();
|
||||||
|
}, 550);
|
||||||
|
|
||||||
|
} else {
|
||||||
|
setTimeout(function(){
|
||||||
|
$toggle.addClass('toggled');
|
||||||
|
}, 580);
|
||||||
|
|
||||||
|
var div = '<div class="bodyClick"></div>';
|
||||||
|
$(div).appendTo('body').click(function() {
|
||||||
|
$html.removeClass('nav-open');
|
||||||
|
blackDashboard.misc.navbar_menu_visible = 0;
|
||||||
|
setTimeout(function(){
|
||||||
|
$toggle.removeClass('toggled');
|
||||||
|
$('.bodyClick').remove();
|
||||||
|
}, 550);
|
||||||
|
});
|
||||||
|
|
||||||
|
$html.addClass('nav-open');
|
||||||
|
blackDashboard.misc.navbar_menu_visible = 1;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$(window).resize(function(){
|
||||||
|
// reset the seq for charts drawing animations
|
||||||
|
seq = seq2 = 0;
|
||||||
|
|
||||||
|
if($full_screen_map.length == 0 && $('.bd-docs').length == 0){
|
||||||
|
var isExpanded = $navbar.find('[data-toggle="collapse"]').attr("aria-expanded");
|
||||||
|
if( $navbar.hasClass('bg-white') && $(window).width() > 991 ){
|
||||||
|
$navbar.removeClass('bg-white').addClass('navbar-transparent');
|
||||||
|
} else if( $navbar.hasClass('navbar-transparent') && $(window).width() < 991 && isExpanded != "false" ) {
|
||||||
|
$navbar.addClass('bg-white').removeClass('navbar-transparent');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
blackDashboard = {
|
||||||
|
misc:{
|
||||||
|
navbar_menu_visible: 0
|
||||||
|
},
|
||||||
|
|
||||||
|
initMinimizeSidebar:function(){
|
||||||
|
if($('.sidebar-mini').length != 0){
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
$('#minimizeSidebar').click(function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
showSidebarMessage: function(message){
|
||||||
|
try {
|
||||||
|
$.notify({
|
||||||
|
icon: "tim-icons ui-1_bell-53",
|
||||||
|
message: message
|
||||||
|
},{
|
||||||
|
type: 'info',
|
||||||
|
timer: 4000,
|
||||||
|
placement: {
|
||||||
|
from: 'top',
|
||||||
|
align: 'right'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} catch (e) {
|
||||||
|
console.log('Notify library is missing, please make sure you have the notifications library added.');
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
function hexToRGB(hex, alpha) {
|
||||||
|
var r = parseInt(hex.slice(1, 3), 16),
|
||||||
|
g = parseInt(hex.slice(3, 5), 16),
|
||||||
|
b = parseInt(hex.slice(5, 7), 16);
|
||||||
|
|
||||||
|
if (alpha) {
|
||||||
|
return "rgba(" + r + ", " + g + ", " + b + ", " + alpha + ")";
|
||||||
|
} else {
|
||||||
|
return "rgb(" + r + ", " + g + ", " + b + ")";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
2
assets/js/dashboard-free.min.js
vendored
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
var transparent=!0,transparentDemo=!0,fixedTop=!1,navbar_initialized=!1,backgroundOrange=!1,sidebar_mini_active=!1,toggle_initialized=!1,$html=$("html"),$body=$("body"),$navbar_minimize_fixed=$(".navbar-minimize-fixed"),$collapse=$(".collapse"),$navbar=$(".navbar"),$tagsinput=$(".tagsinput"),$selectpicker=$(".selectpicker"),$navbar_color=$(".navbar[color-on-scroll]"),$full_screen_map=$(".full-screen-map"),$datetimepicker=$(".datetimepicker"),$datepicker=$(".datepicker"),$timepicker=$(".timepicker"),seq=0,delays=80,durations=500,seq2=0,delays2=80,durations2=500;function hexToRGB(a,e){var i=parseInt(a.slice(1,3),16),n=parseInt(a.slice(3,5),16),r=parseInt(a.slice(5,7),16);return e?"rgba("+i+", "+n+", "+r+", "+e+")":"rgb("+i+", "+n+", "+r+")"}-1<navigator.platform.indexOf("Win")?(0!=$(".main-panel").length&&new PerfectScrollbar(".main-panel",{wheelSpeed:2,wheelPropagation:!0,minScrollbarLength:20,suppressScrollX:!0}),0!=$(".sidebar .sidebar-wrapper").length&&(new PerfectScrollbar(".sidebar .sidebar-wrapper"),$(".table-responsive").each(function(){new PerfectScrollbar($(this)[0])})),$html.addClass("perfect-scrollbar-on")):$html.addClass("perfect-scrollbar-off"),$(document).ready(function(){var a=$(".row").offset();(-1<navigator.platform.indexOf("Win")?$(".ps"):$(window)).scroll(function(){50<$(this).scrollTop()?$(".navbar-minimize-fixed").css("opacity","1"):$(".navbar-minimize-fixed").css("opacity","0")}),$(document).scroll(function(){$(this).scrollTop()>a.top?$(".navbar-minimize-fixed").css("opacity","1"):$(".navbar-minimize-fixed").css("opacity","0")}),0==$(".full-screen-map").length&&0==$(".bd-docs").length&&$(".collapse").on("show.bs.collapse",function(){$(this).closest(".navbar").removeClass("navbar-transparent").addClass("bg-white")}).on("hide.bs.collapse",function(){$(this).closest(".navbar").addClass("navbar-transparent").removeClass("bg-white")}),blackDashboard.initMinimizeSidebar(),$navbar=$(".navbar[color-on-scroll]"),scroll_distance=$navbar.attr("color-on-scroll")||500,0!=$(".navbar[color-on-scroll]").length&&(blackDashboard.checkScrollForTransparentNavbar(),$(window).on("scroll",blackDashboard.checkScrollForTransparentNavbar)),$(".form-control").on("focus",function(){$(this).parent(".input-group").addClass("input-group-focus")}).on("blur",function(){$(this).parent(".input-group").removeClass("input-group-focus")}),$(".bootstrap-switch").each(function(){$this=$(this),data_on_label=$this.data("on-label")||"",data_off_label=$this.data("off-label")||"",$this.bootstrapSwitch({onText:data_on_label,offText:data_off_label})})}),$(document).on("click",".navbar-toggle",function(){var a=$(this);1==blackDashboard.misc.navbar_menu_visible?($html.removeClass("nav-open"),blackDashboard.misc.navbar_menu_visible=0,setTimeout(function(){a.removeClass("toggled"),$(".bodyClick").remove()},550)):(setTimeout(function(){a.addClass("toggled")},580),$('<div class="bodyClick"></div>').appendTo("body").click(function(){$html.removeClass("nav-open"),blackDashboard.misc.navbar_menu_visible=0,setTimeout(function(){a.removeClass("toggled"),$(".bodyClick").remove()},550)}),$html.addClass("nav-open"),blackDashboard.misc.navbar_menu_visible=1)}),$(window).resize(function(){var a;(seq=seq2=0)==$full_screen_map.length&&0==$(".bd-docs").length&&(a=$navbar.find('[data-toggle="collapse"]').attr("aria-expanded"),$navbar.hasClass("bg-white")&&991<$(window).width()?$navbar.removeClass("bg-white").addClass("navbar-transparent"):$navbar.hasClass("navbar-transparent")&&$(window).width()<991&&"false"!=a&&$navbar.addClass("bg-white").removeClass("navbar-transparent"))}),blackDashboard={misc:{navbar_menu_visible:0},initMinimizeSidebar:function(){0!=$(".sidebar-mini").length&&(sidebar_mini_active=!0),$("#minimizeSidebar").click(function(){$(this);1==sidebar_mini_active?($("body").removeClass("sidebar-mini"),sidebar_mini_active=!1,blackDashboard.showSidebarMessage("Sidebar mini deactivated...")):($("body").addClass("sidebar-mini"),sidebar_mini_active=!0,blackDashboard.showSidebarMessage("Sidebar mini activated..."));var a=setInterval(function(){window.dispatchEvent(new Event("resize"))},180);setTimeout(function(){clearInterval(a)},1e3)})},showSidebarMessage:function(a){try{$.notify({icon:"tim-icons ui-1_bell-53",message:a},{type:"info",timer:4e3,placement:{from:"top",align:"right"}})}catch(a){console.log("Notify library is missing, please make sure you have the notifications library added.")}}};
|
||||||
|
//# sourceMappingURL=_site_dashboard_free/assets/js/dashboard-free.js.map
|
||||||
1
assets/js/dashboard-free.min.js.map
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"sources":["_site_dashboard_free/assets/js/dashboard-free.js"],"names":["transparent","transparentDemo","fixedTop","navbar_initialized","backgroundOrange","sidebar_mini_active","toggle_initialized","$html","$","$body","$navbar_minimize_fixed","$collapse","$navbar","$tagsinput","$selectpicker","$navbar_color","$full_screen_map","$datetimepicker","$datepicker","$timepicker","seq","delays","durations","seq2","delays2","durations2","hexToRGB","hex","alpha","r","parseInt","slice","g","b","navigator","platform","indexOf","length","PerfectScrollbar","wheelSpeed","wheelPropagation","minScrollbarLength","suppressScrollX","each","this","addClass","document","ready","offset","window","scroll","scrollTop","css","top","on","closest","removeClass","blackDashboard","initMinimizeSidebar","scroll_distance","attr","checkScrollForTransparentNavbar","parent","$this","data_on_label","data","data_off_label","bootstrapSwitch","onText","offText","$toggle","misc","navbar_menu_visible","setTimeout","remove","appendTo","click","resize","isExpanded","find","hasClass","width","showSidebarMessage","simulateWindowResize","setInterval","dispatchEvent","Event","clearInterval","message","notify","icon","type","timer","placement","from","align","e","console","log"],"mappings":"AAkBA,IAAIA,aAAc,EACdC,iBAAkB,EAClBC,UAAW,EAEXC,oBAAqB,EACrBC,kBAAmB,EACnBC,qBAAsB,EACtBC,oBAAqB,EAErBC,MAAQC,EAAE,QACVC,MAAQD,EAAE,QACVE,uBAAyBF,EAAE,0BAC3BG,UAAYH,EAAE,aACdI,QAAUJ,EAAE,WACZK,WAAaL,EAAE,cACfM,cAAgBN,EAAE,iBAClBO,cAAgBP,EAAE,4BAClBQ,iBAAmBR,EAAE,oBACrBS,gBAAkBT,EAAE,mBACpBU,YAAcV,EAAE,eAChBW,YAAcX,EAAE,eAEhBY,IAAM,EAAGC,OAAS,GAAIC,UAAY,IAClCC,KAAO,EAAGC,QAAU,GAAIC,WAAa,IAuMzC,SAASC,SAASC,EAAKC,GACnB,IAAIC,EAAIC,SAASH,EAAII,MAAM,EAAG,GAAI,IAC9BC,EAAIF,SAASH,EAAII,MAAM,EAAG,GAAI,IAC9BE,EAAIH,SAASH,EAAII,MAAM,EAAG,GAAI,IAElC,OAAIH,EACO,QAAUC,EAAI,KAAOG,EAAI,KAAOC,EAAI,KAAOL,EAAQ,IAEnD,OAASC,EAAI,KAAOG,EAAI,KAAOC,EAAI,KA5MO,EAArCC,UAAUC,SAASC,QAAQ,QAIV,GAA3B5B,EAAE,eAAe6B,QACX,IAAIC,iBAAiB,cAAc,CAC1CC,WAAY,EACZC,kBAAkB,EAClBC,mBAAoB,GACpBC,iBAAiB,IAIuB,GAAzClC,EAAE,6BAA6B6B,SAEtB,IAAIC,iBAAiB,6BAC/B9B,EAAE,qBAAqBmC,KAAK,WAChB,IAAIL,iBAAiB9B,EAAEoC,MAAM,OAMzCrC,MAAMsC,SAAS,yBAEftC,MAAMsC,SAAS,yBAItBrC,EAAEsC,UAAUC,MAAM,WAEhB,IAEIC,EADYxC,EAAE,QACOwC,WACgC,EAArCd,UAAUC,SAASC,QAAQ,OAAc5B,EAAE,OAAOA,EAAEyC,SAC1DC,OAAO,WAID,GAFH1C,EAAEoC,MAAMO,YAGrB3C,EAAE,0BAA0B4C,IAAI,UAAW,KAE3C5C,EAAE,0BAA0B4C,IAAI,UAAW,OAK/C5C,EAAEsC,UAAUI,OAAO,WACF1C,EAAEoC,MAAMO,YACLH,EAAOK,IACvB7C,EAAE,0BAA0B4C,IAAI,UAAW,KAE3C5C,EAAE,0BAA0B4C,IAAI,UAAW,OAIX,GAAhC5C,EAAE,oBAAoB6B,QAAuC,GAAxB7B,EAAE,YAAY6B,QAErD7B,EAAE,aAAa8C,GAAG,mBAAoB,WAClC9C,EAAEoC,MAAMW,QAAQ,WAAWC,YAAY,sBAAsBX,SAAS,cACvES,GAAG,mBAAoB,WACtB9C,EAAEoC,MAAMW,QAAQ,WAAWV,SAAS,sBAAsBW,YAAY,cAI5EC,eAAeC,sBAEf9C,QAAUJ,EAAE,4BACZmD,gBAAkB/C,QAAQgD,KAAK,oBAAsB,IAGV,GAAxCpD,EAAE,4BAA4B6B,SAC7BoB,eAAeI,kCACfrD,EAAEyC,QAAQK,GAAG,SAAUG,eAAeI,kCAG1CrD,EAAE,iBAAiB8C,GAAG,QAAS,WAC3B9C,EAAEoC,MAAMkB,OAAO,gBAAgBjB,SAAS,uBACzCS,GAAG,OAAQ,WACV9C,EAAEoC,MAAMkB,OAAO,gBAAgBN,YAAY,uBAI/ChD,EAAE,qBAAqBmC,KAAK,WACxBoB,MAAQvD,EAAEoC,MACVoB,cAAgBD,MAAME,KAAK,aAAe,GAC1CC,eAAiBH,MAAME,KAAK,cAAgB,GAE5CF,MAAMI,gBAAgB,CAClBC,OAAQJ,cACRK,QAASH,qBAKnB1D,EAAEsC,UAAUQ,GAAG,QAAS,iBAAkB,WACtC,IAAIgB,EAAU9D,EAAEoC,MAE8B,GAA3Ca,eAAec,KAAKC,qBACnBjE,MAAMiD,YAAY,YAClBC,eAAec,KAAKC,oBAAsB,EAC1CC,WAAW,WACPH,EAAQd,YAAY,WACpBhD,EAAE,cAAckE,UACjB,OAGHD,WAAW,WACPH,EAAQzB,SAAS,YAClB,KAGHrC,EADU,iCACHmE,SAAS,QAAQC,MAAM,WAC1BrE,MAAMiD,YAAY,YAClBC,eAAec,KAAKC,oBAAsB,EACtCC,WAAW,WACPH,EAAQd,YAAY,WACpBhD,EAAE,cAAckE,UAClB,OAGVnE,MAAMsC,SAAS,YACfY,eAAec,KAAKC,oBAAsB,KAIlDhE,EAAEyC,QAAQ4B,OAAO,WAIb,IACMC,GAHN1D,IAAMG,KAAO,IAEVP,iBAAiBqB,QAAuC,GAAxB7B,EAAE,YAAY6B,SAC3CyC,EAAalE,QAAQmE,KAAK,4BAA4BnB,KAAK,iBAC3DhD,QAAQoE,SAAS,aAAmC,IAApBxE,EAAEyC,QAAQgC,QAC5CrE,QAAQ4C,YAAY,YAAYX,SAAS,sBAChCjC,QAAQoE,SAAS,uBAAyBxE,EAAEyC,QAAQgC,QAAU,KAAqB,SAAdH,GAC9ElE,QAAQiC,SAAS,YAAYW,YAAY,yBAKjDC,eAAiB,CACfc,KAAK,CACDC,oBAAqB,GAGzBd,oBAAoB,WACgB,GAA7BlD,EAAE,iBAAiB6B,SACpBhC,qBAAsB,GAGxBG,EAAE,oBAAoBoE,MAAM,WACbpE,EAAEoC,MAEa,GAAvBvC,qBACCG,EAAE,QAAQgD,YAAY,gBACtBnD,qBAAsB,EACtBoD,eAAeyB,mBAAmB,iCAElC1E,EAAE,QAAQqC,SAAS,gBACnBxC,qBAAsB,EACtBoD,eAAeyB,mBAAmB,8BAItC,IAAIC,EAAuBC,YAAY,WACnCnC,OAAOoC,cAAc,IAAIC,MAAM,YACjC,KAGFb,WAAW,WACPc,cAAcJ,IAChB,QAIVD,mBAAoB,SAASM,GAC3B,IACEhF,EAAEiF,OAAO,CACLC,KAAM,yBACNF,QAASA,GACT,CACEG,KAAM,OACNC,MAAO,IACPC,UAAW,CACPC,KAAM,MACNC,MAAO,WAGjB,MAAOC,GACPC,QAAQC,IAAI"}
|
||||||
433
assets/js/plugins/dashboard/free/bootstrap-notify.js
vendored
Normal file
@ -0,0 +1,433 @@
|
|||||||
|
/*
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Creative Tim Modifications
|
||||||
|
|
||||||
|
Lines: 238, 239 was changed from top: 5px to top: 50% and we added margin-top: -13px. In this way the close button will be aligned vertically
|
||||||
|
Line:222 - modified when the icon is set, we add the class "alert-with-icon", so there will be enough space for the icon.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Project: Bootstrap Notify = v3.1.5
|
||||||
|
* Description: Turns standard Bootstrap alerts into "Growl-like" notifications.
|
||||||
|
* Author: Mouse0270 aka Robert McIntosh
|
||||||
|
* License: MIT License
|
||||||
|
* Website: https://github.com/mouse0270/bootstrap-growl
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* global define:false, require: false, jQuery:false */
|
||||||
|
|
||||||
|
(function (factory) {
|
||||||
|
if (typeof define === 'function' && define.amd) {
|
||||||
|
// AMD. Register as an anonymous module.
|
||||||
|
define(['jquery'], factory);
|
||||||
|
} else if (typeof exports === 'object') {
|
||||||
|
// Node/CommonJS
|
||||||
|
factory(require('jquery'));
|
||||||
|
} else {
|
||||||
|
// Browser globals
|
||||||
|
factory(jQuery);
|
||||||
|
}
|
||||||
|
}(function ($) {
|
||||||
|
// Create the defaults once
|
||||||
|
var defaults = {
|
||||||
|
element: 'body',
|
||||||
|
position: null,
|
||||||
|
type: "info",
|
||||||
|
allow_dismiss: true,
|
||||||
|
allow_duplicates: true,
|
||||||
|
newest_on_top: false,
|
||||||
|
showProgressbar: false,
|
||||||
|
placement: {
|
||||||
|
from: "top",
|
||||||
|
align: "right"
|
||||||
|
},
|
||||||
|
offset: 20,
|
||||||
|
spacing: 10,
|
||||||
|
z_index: 1060,
|
||||||
|
delay: 5000,
|
||||||
|
timer: 1000,
|
||||||
|
url_target: '_blank',
|
||||||
|
mouse_over: null,
|
||||||
|
animate: {
|
||||||
|
enter: 'animated fadeInDown',
|
||||||
|
exit: 'animated fadeOutUp'
|
||||||
|
},
|
||||||
|
onShow: null,
|
||||||
|
onShown: null,
|
||||||
|
onClose: null,
|
||||||
|
onClosed: null,
|
||||||
|
onClick: null,
|
||||||
|
icon_type: 'class',
|
||||||
|
template: '<div data-notify="container" class="col-xs-11 col-sm-4 alert alert-{0}" role="alert"><button type="button" aria-hidden="true" class="close" data-notify="dismiss"><i class="tim-icons icon-simple-remove"></i></button><span data-notify="icon"></span> <span data-notify="title">{1}</span> <span data-notify="message">{2}</span><div class="progress" data-notify="progressbar"><div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div></div><a href="{3}" target="{4}" data-notify="url"></a></div>'
|
||||||
|
};
|
||||||
|
|
||||||
|
String.format = function () {
|
||||||
|
var args = arguments;
|
||||||
|
var str = arguments[0];
|
||||||
|
return str.replace(/(\{\{\d\}\}|\{\d\})/g, function (str) {
|
||||||
|
if (str.substring(0, 2) === "{{") return str;
|
||||||
|
var num = parseInt(str.match(/\d/)[0]);
|
||||||
|
return args[num + 1];
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
function isDuplicateNotification(notification) {
|
||||||
|
var isDupe = false;
|
||||||
|
|
||||||
|
$('[data-notify="container"]').each(function (i, el) {
|
||||||
|
var $el = $(el);
|
||||||
|
var title = $el.find('[data-notify="title"]').html().trim();
|
||||||
|
var message = $el.find('[data-notify="message"]').html().trim();
|
||||||
|
|
||||||
|
// The input string might be different than the actual parsed HTML string!
|
||||||
|
// (<br> vs <br /> for example)
|
||||||
|
// So we have to force-parse this as HTML here!
|
||||||
|
var isSameTitle = title === $("<div>" + notification.settings.content.title + "</div>").html().trim();
|
||||||
|
var isSameMsg = message === $("<div>" + notification.settings.content.message + "</div>").html().trim();
|
||||||
|
var isSameType = $el.hasClass('alert-' + notification.settings.type);
|
||||||
|
|
||||||
|
if (isSameTitle && isSameMsg && isSameType) {
|
||||||
|
//we found the dupe. Set the var and stop checking.
|
||||||
|
isDupe = true;
|
||||||
|
}
|
||||||
|
return !isDupe;
|
||||||
|
});
|
||||||
|
|
||||||
|
return isDupe;
|
||||||
|
}
|
||||||
|
|
||||||
|
function Notify(element, content, options) {
|
||||||
|
// Setup Content of Notify
|
||||||
|
var contentObj = {
|
||||||
|
content: {
|
||||||
|
message: typeof content === 'object' ? content.message : content,
|
||||||
|
title: content.title ? content.title : '',
|
||||||
|
icon: content.icon ? content.icon : '',
|
||||||
|
url: content.url ? content.url : '#',
|
||||||
|
target: content.target ? content.target : '-'
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
options = $.extend(true, {}, contentObj, options);
|
||||||
|
this.settings = $.extend(true, {}, defaults, options);
|
||||||
|
this._defaults = defaults;
|
||||||
|
if (this.settings.content.target === "-") {
|
||||||
|
this.settings.content.target = this.settings.url_target;
|
||||||
|
}
|
||||||
|
this.animations = {
|
||||||
|
start: 'webkitAnimationStart oanimationstart MSAnimationStart animationstart',
|
||||||
|
end: 'webkitAnimationEnd oanimationend MSAnimationEnd animationend'
|
||||||
|
};
|
||||||
|
|
||||||
|
if (typeof this.settings.offset === 'number') {
|
||||||
|
this.settings.offset = {
|
||||||
|
x: this.settings.offset,
|
||||||
|
y: this.settings.offset
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
//if duplicate messages are not allowed, then only continue if this new message is not a duplicate of one that it already showing
|
||||||
|
if (this.settings.allow_duplicates || (!this.settings.allow_duplicates && !isDuplicateNotification(this))) {
|
||||||
|
this.init();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$.extend(Notify.prototype, {
|
||||||
|
init: function () {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.buildNotify();
|
||||||
|
if (this.settings.content.icon) {
|
||||||
|
this.setIcon();
|
||||||
|
}
|
||||||
|
if (this.settings.content.url != "#") {
|
||||||
|
this.styleURL();
|
||||||
|
}
|
||||||
|
this.styleDismiss();
|
||||||
|
this.placement();
|
||||||
|
this.bind();
|
||||||
|
|
||||||
|
this.notify = {
|
||||||
|
$ele: this.$ele,
|
||||||
|
update: function (command, update) {
|
||||||
|
var commands = {};
|
||||||
|
if (typeof command === "string") {
|
||||||
|
commands[command] = update;
|
||||||
|
} else {
|
||||||
|
commands = command;
|
||||||
|
}
|
||||||
|
for (var cmd in commands) {
|
||||||
|
switch (cmd) {
|
||||||
|
case "type":
|
||||||
|
this.$ele.removeClass('alert-' + self.settings.type);
|
||||||
|
this.$ele.find('[data-notify="progressbar"] > .progress-bar').removeClass('progress-bar-' + self.settings.type);
|
||||||
|
self.settings.type = commands[cmd];
|
||||||
|
this.$ele.addClass('alert-' + commands[cmd]).find('[data-notify="progressbar"] > .progress-bar').addClass('progress-bar-' + commands[cmd]);
|
||||||
|
break;
|
||||||
|
case "icon":
|
||||||
|
var $icon = this.$ele.find('[data-notify="icon"]');
|
||||||
|
if (self.settings.icon_type.toLowerCase() === 'class') {
|
||||||
|
$icon.removeClass(self.settings.content.icon).addClass(commands[cmd]);
|
||||||
|
} else {
|
||||||
|
if (!$icon.is('img')) {
|
||||||
|
$icon.find('img');
|
||||||
|
}
|
||||||
|
$icon.attr('src', commands[cmd]);
|
||||||
|
}
|
||||||
|
self.settings.content.icon = commands[command];
|
||||||
|
break;
|
||||||
|
case "progress":
|
||||||
|
var newDelay = self.settings.delay - (self.settings.delay * (commands[cmd] / 100));
|
||||||
|
this.$ele.data('notify-delay', newDelay);
|
||||||
|
this.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', commands[cmd]).css('width', commands[cmd] + '%');
|
||||||
|
break;
|
||||||
|
case "url":
|
||||||
|
this.$ele.find('[data-notify="url"]').attr('href', commands[cmd]);
|
||||||
|
break;
|
||||||
|
case "target":
|
||||||
|
this.$ele.find('[data-notify="url"]').attr('target', commands[cmd]);
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
this.$ele.find('[data-notify="' + cmd + '"]').html(commands[cmd]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
var posX = this.$ele.outerHeight() + parseInt(self.settings.spacing) + parseInt(self.settings.offset.y);
|
||||||
|
self.reposition(posX);
|
||||||
|
},
|
||||||
|
close: function () {
|
||||||
|
self.close();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
},
|
||||||
|
buildNotify: function () {
|
||||||
|
var content = this.settings.content;
|
||||||
|
this.$ele = $(String.format(this.settings.template, this.settings.type, content.title, content.message, content.url, content.target));
|
||||||
|
this.$ele.attr('data-notify-position', this.settings.placement.from + '-' + this.settings.placement.align);
|
||||||
|
if (!this.settings.allow_dismiss) {
|
||||||
|
this.$ele.find('[data-notify="dismiss"]').css('display', 'none');
|
||||||
|
}
|
||||||
|
if ((this.settings.delay <= 0 && !this.settings.showProgressbar) || !this.settings.showProgressbar) {
|
||||||
|
this.$ele.find('[data-notify="progressbar"]').remove();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
setIcon: function () {
|
||||||
|
this.$ele.addClass('alert-with-icon');
|
||||||
|
|
||||||
|
if (this.settings.icon_type.toLowerCase() === 'class') {
|
||||||
|
this.$ele.find('[data-notify="icon"]').addClass(this.settings.content.icon);
|
||||||
|
} else {
|
||||||
|
if (this.$ele.find('[data-notify="icon"]').is('img')) {
|
||||||
|
this.$ele.find('[data-notify="icon"]').attr('src', this.settings.content.icon);
|
||||||
|
} else {
|
||||||
|
this.$ele.find('[data-notify="icon"]').append('<img src="' + this.settings.content.icon + '" alt="Notify Icon" />');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
styleDismiss: function () {
|
||||||
|
this.$ele.find('[data-notify="dismiss"]').css({
|
||||||
|
position: 'absolute',
|
||||||
|
right: '10px',
|
||||||
|
top: '50%',
|
||||||
|
marginTop: '-13px',
|
||||||
|
zIndex: this.settings.z_index + 2
|
||||||
|
});
|
||||||
|
},
|
||||||
|
styleURL: function () {
|
||||||
|
this.$ele.find('[data-notify="url"]').css({
|
||||||
|
backgroundImage: 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)',
|
||||||
|
height: '100%',
|
||||||
|
left: 0,
|
||||||
|
position: 'absolute',
|
||||||
|
top: 0,
|
||||||
|
width: '100%',
|
||||||
|
zIndex: this.settings.z_index + 1
|
||||||
|
});
|
||||||
|
},
|
||||||
|
placement: function () {
|
||||||
|
var self = this,
|
||||||
|
offsetAmt = this.settings.offset.y,
|
||||||
|
css = {
|
||||||
|
display: 'inline-block',
|
||||||
|
margin: '0px auto',
|
||||||
|
position: this.settings.position ? this.settings.position : (this.settings.element === 'body' ? 'fixed' : 'absolute'),
|
||||||
|
transition: 'all .5s ease-in-out',
|
||||||
|
zIndex: this.settings.z_index
|
||||||
|
},
|
||||||
|
hasAnimation = false,
|
||||||
|
settings = this.settings;
|
||||||
|
|
||||||
|
$('[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])').each(function () {
|
||||||
|
offsetAmt = Math.max(offsetAmt, parseInt($(this).css(settings.placement.from)) + parseInt($(this).outerHeight()) + parseInt(settings.spacing));
|
||||||
|
});
|
||||||
|
if (this.settings.newest_on_top === true) {
|
||||||
|
offsetAmt = this.settings.offset.y;
|
||||||
|
}
|
||||||
|
css[this.settings.placement.from] = offsetAmt + 'px';
|
||||||
|
|
||||||
|
switch (this.settings.placement.align) {
|
||||||
|
case "left":
|
||||||
|
case "right":
|
||||||
|
css[this.settings.placement.align] = this.settings.offset.x + 'px';
|
||||||
|
break;
|
||||||
|
case "center":
|
||||||
|
css.left = 0;
|
||||||
|
css.right = 0;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
this.$ele.css(css).addClass(this.settings.animate.enter);
|
||||||
|
$.each(Array('webkit-', 'moz-', 'o-', 'ms-', ''), function (index, prefix) {
|
||||||
|
self.$ele[0].style[prefix + 'AnimationIterationCount'] = 1;
|
||||||
|
});
|
||||||
|
|
||||||
|
$(this.settings.element).append(this.$ele);
|
||||||
|
|
||||||
|
if (this.settings.newest_on_top === true) {
|
||||||
|
offsetAmt = (parseInt(offsetAmt) + parseInt(this.settings.spacing)) + this.$ele.outerHeight();
|
||||||
|
this.reposition(offsetAmt);
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($.isFunction(self.settings.onShow)) {
|
||||||
|
self.settings.onShow.call(this.$ele);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.$ele.one(this.animations.start, function () {
|
||||||
|
hasAnimation = true;
|
||||||
|
}).one(this.animations.end, function () {
|
||||||
|
self.$ele.removeClass(self.settings.animate.enter);
|
||||||
|
if ($.isFunction(self.settings.onShown)) {
|
||||||
|
self.settings.onShown.call(this);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
setTimeout(function () {
|
||||||
|
if (!hasAnimation) {
|
||||||
|
if ($.isFunction(self.settings.onShown)) {
|
||||||
|
self.settings.onShown.call(this);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, 600);
|
||||||
|
},
|
||||||
|
bind: function () {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$ele.find('[data-notify="dismiss"]').on('click', function () {
|
||||||
|
self.close();
|
||||||
|
});
|
||||||
|
|
||||||
|
if ($.isFunction(self.settings.onClick)) {
|
||||||
|
this.$ele.on('click', function (event) {
|
||||||
|
if (event.target != self.$ele.find('[data-notify="dismiss"]')[0]) {
|
||||||
|
self.settings.onClick.call(this, event);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
this.$ele.mouseover(function () {
|
||||||
|
$(this).data('data-hover', "true");
|
||||||
|
}).mouseout(function () {
|
||||||
|
$(this).data('data-hover', "false");
|
||||||
|
});
|
||||||
|
this.$ele.data('data-hover', "false");
|
||||||
|
|
||||||
|
if (this.settings.delay > 0) {
|
||||||
|
self.$ele.data('notify-delay', self.settings.delay);
|
||||||
|
var timer = setInterval(function () {
|
||||||
|
var delay = parseInt(self.$ele.data('notify-delay')) - self.settings.timer;
|
||||||
|
if ((self.$ele.data('data-hover') === 'false' && self.settings.mouse_over === "pause") || self.settings.mouse_over != "pause") {
|
||||||
|
var percent = ((self.settings.delay - delay) / self.settings.delay) * 100;
|
||||||
|
self.$ele.data('notify-delay', delay);
|
||||||
|
self.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', percent).css('width', percent + '%');
|
||||||
|
}
|
||||||
|
if (delay <= -(self.settings.timer)) {
|
||||||
|
clearInterval(timer);
|
||||||
|
self.close();
|
||||||
|
}
|
||||||
|
}, self.settings.timer);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
close: function () {
|
||||||
|
var self = this,
|
||||||
|
posX = parseInt(this.$ele.css(this.settings.placement.from)),
|
||||||
|
hasAnimation = false;
|
||||||
|
|
||||||
|
this.$ele.attr('data-closing', 'true').addClass(this.settings.animate.exit);
|
||||||
|
self.reposition(posX);
|
||||||
|
|
||||||
|
if ($.isFunction(self.settings.onClose)) {
|
||||||
|
self.settings.onClose.call(this.$ele);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.$ele.one(this.animations.start, function () {
|
||||||
|
hasAnimation = true;
|
||||||
|
}).one(this.animations.end, function () {
|
||||||
|
$(this).remove();
|
||||||
|
if ($.isFunction(self.settings.onClosed)) {
|
||||||
|
self.settings.onClosed.call(this);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
setTimeout(function () {
|
||||||
|
if (!hasAnimation) {
|
||||||
|
self.$ele.remove();
|
||||||
|
if (self.settings.onClosed) {
|
||||||
|
self.settings.onClosed(self.$ele);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, 600);
|
||||||
|
},
|
||||||
|
reposition: function (posX) {
|
||||||
|
var self = this,
|
||||||
|
notifies = '[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])',
|
||||||
|
$elements = this.$ele.nextAll(notifies);
|
||||||
|
if (this.settings.newest_on_top === true) {
|
||||||
|
$elements = this.$ele.prevAll(notifies);
|
||||||
|
}
|
||||||
|
$elements.each(function () {
|
||||||
|
$(this).css(self.settings.placement.from, posX);
|
||||||
|
posX = (parseInt(posX) + parseInt(self.settings.spacing)) + $(this).outerHeight();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$.notify = function (content, options) {
|
||||||
|
var plugin = new Notify(this, content, options);
|
||||||
|
return plugin.notify;
|
||||||
|
};
|
||||||
|
$.notifyDefaults = function (options) {
|
||||||
|
defaults = $.extend(true, {}, defaults, options);
|
||||||
|
return defaults;
|
||||||
|
};
|
||||||
|
|
||||||
|
$.notifyClose = function (selector) {
|
||||||
|
|
||||||
|
if (typeof selector === "undefined" || selector === "all") {
|
||||||
|
$('[data-notify]').find('[data-notify="dismiss"]').trigger('click');
|
||||||
|
}else if(selector === 'success' || selector === 'info' || selector === 'warning' || selector === 'danger'){
|
||||||
|
$('.alert-' + selector + '[data-notify]').find('[data-notify="dismiss"]').trigger('click');
|
||||||
|
} else if(selector){
|
||||||
|
$(selector + '[data-notify]').find('[data-notify="dismiss"]').trigger('click');
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
$('[data-notify-position="' + selector + '"]').find('[data-notify="dismiss"]').trigger('click');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
$.notifyCloseExcept = function (selector) {
|
||||||
|
|
||||||
|
if(selector === 'success' || selector === 'info' || selector === 'warning' || selector === 'danger'){
|
||||||
|
$('[data-notify]').not('.alert-' + selector).find('[data-notify="dismiss"]').trigger('click');
|
||||||
|
} else{
|
||||||
|
$('[data-notify]').not(selector).find('[data-notify="dismiss"]').trigger('click');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
}));
|
||||||
10
assets/js/plugins/dashboard/free/chartjs.min.js
vendored
Normal file
6
assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js
vendored
Normal file
102
assets/scss/dashboard-free.scss
Normal file
@ -0,0 +1,102 @@
|
|||||||
|
|
||||||
|
/*!
|
||||||
|
|
||||||
|
=========================================================
|
||||||
|
* Black Dashboard - v1.0.1
|
||||||
|
=========================================================
|
||||||
|
|
||||||
|
* Product Page: https://www.creative-tim.com/product/black-dashboard
|
||||||
|
* Copyright 2019 Creative Tim (https://www.creative-tim.com)
|
||||||
|
* Licensed under MIT (https://github.com/creativetimofficial/black-dashboard/blob/master/LICENSE.md)
|
||||||
|
|
||||||
|
* Coded by Creative Tim
|
||||||
|
|
||||||
|
=========================================================
|
||||||
|
|
||||||
|
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Core
|
||||||
|
|
||||||
|
@import "dashboard/core/custom/functions";
|
||||||
|
@import "dashboard/core/bootstrap/functions";
|
||||||
|
|
||||||
|
@import "dashboard/core/custom/variables";
|
||||||
|
@import "dashboard/core/bootstrap/variables";
|
||||||
|
|
||||||
|
@import "dashboard/core/custom/mixins";
|
||||||
|
@import "dashboard/core/bootstrap/mixins";
|
||||||
|
|
||||||
|
// Bootstrap components
|
||||||
|
|
||||||
|
@import "dashboard/core/bootstrap/root";
|
||||||
|
@import "dashboard/core/bootstrap/reboot";
|
||||||
|
@import "dashboard/core/bootstrap/type";
|
||||||
|
@import "dashboard/core/bootstrap/images";
|
||||||
|
@import "dashboard/core/bootstrap/code";
|
||||||
|
@import "dashboard/core/bootstrap/grid";
|
||||||
|
@import "dashboard/core/bootstrap/tables";
|
||||||
|
@import "dashboard/core/bootstrap/forms";
|
||||||
|
@import "dashboard/core/bootstrap/buttons";
|
||||||
|
@import "dashboard/core/bootstrap/transitions";
|
||||||
|
@import "dashboard/core/bootstrap/dropdown";
|
||||||
|
@import "dashboard/core/bootstrap/button-group";
|
||||||
|
@import "dashboard/core/bootstrap/input-group";
|
||||||
|
@import "dashboard/core/bootstrap/custom-forms";
|
||||||
|
@import "dashboard/core/bootstrap/nav";
|
||||||
|
@import "dashboard/core/bootstrap/navbar";
|
||||||
|
@import "dashboard/core/bootstrap/card";
|
||||||
|
@import "dashboard/core/bootstrap/breadcrumb";
|
||||||
|
@import "dashboard/core/bootstrap/pagination";
|
||||||
|
@import "dashboard/core/bootstrap/badge";
|
||||||
|
@import "dashboard/core/bootstrap/jumbotron";
|
||||||
|
@import "dashboard/core/bootstrap/alert";
|
||||||
|
@import "dashboard/core/bootstrap/progress";
|
||||||
|
@import "dashboard/core/bootstrap/media";
|
||||||
|
@import "dashboard/core/bootstrap/list-group";
|
||||||
|
@import "dashboard/core/bootstrap/close";
|
||||||
|
@import "dashboard/core/bootstrap/modal";
|
||||||
|
@import "dashboard/core/bootstrap/tooltip";
|
||||||
|
@import "dashboard/core/bootstrap/popover";
|
||||||
|
@import "dashboard/core/bootstrap/carousel";
|
||||||
|
@import "dashboard/core/bootstrap/utilities";
|
||||||
|
@import "dashboard/core/bootstrap/print";
|
||||||
|
|
||||||
|
// Custom components
|
||||||
|
|
||||||
|
@import "dashboard/core/custom/alerts.scss";
|
||||||
|
@import "dashboard/core/custom/buttons.scss";
|
||||||
|
@import "dashboard/core/custom/dropdown.scss";
|
||||||
|
@import "dashboard/core/custom/footer.scss";
|
||||||
|
@import "dashboard/core/custom/forms.scss";
|
||||||
|
@import "dashboard/core/custom/images.scss";
|
||||||
|
@import "dashboard/core/custom/modal.scss";
|
||||||
|
@import "dashboard/core/custom/navbar.scss";
|
||||||
|
@import "dashboard/core/custom/type.scss";
|
||||||
|
@import "dashboard/core/custom/tables";
|
||||||
|
@import "dashboard/core/custom/checkboxes-radio";
|
||||||
|
@import "dashboard/core/custom/fixed-plugin";
|
||||||
|
@import "dashboard/core/custom/sidebar-and-main-panel.scss";
|
||||||
|
@import "dashboard/core/custom/misc.scss";
|
||||||
|
@import "dashboard/core/custom/rtl.scss";
|
||||||
|
@import "dashboard/core/custom/input-group.scss";
|
||||||
|
|
||||||
|
|
||||||
|
// Vendor / Plugins
|
||||||
|
|
||||||
|
@import "dashboard/core/custom/vendor/plugin-perfect-scrollbar.scss";
|
||||||
|
@import "dashboard/core/custom/vendor/plugin-animate-bootstrap-notify.scss";
|
||||||
|
|
||||||
|
// light mode
|
||||||
|
|
||||||
|
@import "dashboard/core/custom/white-content.scss";
|
||||||
|
|
||||||
|
// Cards
|
||||||
|
|
||||||
|
@import 'dashboard/core/custom/card';
|
||||||
|
@import "dashboard/core/custom/cards/card-chart";
|
||||||
|
@import "dashboard/core/custom/cards/card-map";
|
||||||
|
@import "dashboard/core/custom/cards/card-user";
|
||||||
|
@import "dashboard/core/custom/cards/card-task";
|
||||||
|
@import "dashboard/core/custom/cards/card-plain";
|
||||||
142
assets/scss/dashboard-pro.scss
Normal file
@ -0,0 +1,142 @@
|
|||||||
|
/*!
|
||||||
|
|
||||||
|
=========================================================
|
||||||
|
* site.product_name - site.current_version
|
||||||
|
=========================================================
|
||||||
|
|
||||||
|
* Product Page: site.link_tim
|
||||||
|
* Copyright site.year Creative Tim (http://www.creative-tim.com)
|
||||||
|
|
||||||
|
|
||||||
|
=========================================================
|
||||||
|
|
||||||
|
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Core
|
||||||
|
|
||||||
|
@import "dashboard/pro/custom/functions";
|
||||||
|
@import "dashboard/pro/bootstrap/functions";
|
||||||
|
|
||||||
|
@import "dashboard/pro/custom/variables";
|
||||||
|
@import "dashboard/pro/bootstrap/variables";
|
||||||
|
|
||||||
|
@import "dashboard/pro/custom/mixins";
|
||||||
|
@import "dashboard/pro/bootstrap/mixins";
|
||||||
|
|
||||||
|
// Bootstrap components
|
||||||
|
|
||||||
|
@import "dashboard/pro/bootstrap/root";
|
||||||
|
@import "dashboard/pro/bootstrap/reboot";
|
||||||
|
@import "dashboard/pro/bootstrap/type";
|
||||||
|
@import "dashboard/pro/bootstrap/images";
|
||||||
|
@import "dashboard/pro/bootstrap/code";
|
||||||
|
@import "dashboard/pro/bootstrap/grid";
|
||||||
|
@import "dashboard/pro/bootstrap/tables";
|
||||||
|
@import "dashboard/pro/bootstrap/forms";
|
||||||
|
@import "dashboard/pro/bootstrap/buttons";
|
||||||
|
@import "dashboard/pro/bootstrap/transitions";
|
||||||
|
@import "dashboard/pro/bootstrap/dropdown";
|
||||||
|
@import "dashboard/pro/bootstrap/button-group";
|
||||||
|
@import "dashboard/pro/bootstrap/input-group";
|
||||||
|
@import "dashboard/pro/bootstrap/custom-forms";
|
||||||
|
@import "dashboard/pro/bootstrap/nav";
|
||||||
|
@import "dashboard/pro/bootstrap/navbar";
|
||||||
|
@import "dashboard/pro/bootstrap/card";
|
||||||
|
@import "dashboard/pro/bootstrap/breadcrumb";
|
||||||
|
@import "dashboard/pro/bootstrap/pagination";
|
||||||
|
@import "dashboard/pro/bootstrap/badge";
|
||||||
|
@import "dashboard/pro/bootstrap/jumbotron";
|
||||||
|
@import "dashboard/pro/bootstrap/alert";
|
||||||
|
@import "dashboard/pro/bootstrap/progress";
|
||||||
|
@import "dashboard/pro/bootstrap/media";
|
||||||
|
@import "dashboard/pro/bootstrap/list-group";
|
||||||
|
@import "dashboard/pro/bootstrap/close";
|
||||||
|
@import "dashboard/pro/bootstrap/modal";
|
||||||
|
@import "dashboard/pro/bootstrap/tooltip";
|
||||||
|
@import "dashboard/pro/bootstrap/popover";
|
||||||
|
@import "dashboard/pro/bootstrap/carousel";
|
||||||
|
@import "dashboard/pro/bootstrap/utilities";
|
||||||
|
@import "dashboard/pro/bootstrap/print";
|
||||||
|
|
||||||
|
// Custom components
|
||||||
|
|
||||||
|
@import "dashboard/pro/custom/reboot.scss";
|
||||||
|
@import "dashboard/pro/custom/global.scss";
|
||||||
|
@import "dashboard/pro/custom/utilities.scss";
|
||||||
|
@import "dashboard/pro/custom/alerts.scss";
|
||||||
|
@import "dashboard/pro/custom/avatars.scss";
|
||||||
|
@import "dashboard/pro/custom/badge.scss";
|
||||||
|
@import "dashboard/pro/custom/buttons.scss";
|
||||||
|
@import "dashboard/pro/custom/close.scss";
|
||||||
|
@import "dashboard/pro/custom/custom-forms.scss";
|
||||||
|
@import "dashboard/pro/custom/dropdown.scss";
|
||||||
|
@import "dashboard/pro/custom/footer.scss";
|
||||||
|
@import "dashboard/pro/custom/forms.scss";
|
||||||
|
@import "dashboard/pro/custom/grid.scss";
|
||||||
|
@import "dashboard/pro/custom/icons.scss";
|
||||||
|
@import "dashboard/pro/custom/images.scss";
|
||||||
|
@import "dashboard/pro/custom/input-group.scss";
|
||||||
|
@import "dashboard/pro/custom/info-areas.scss";
|
||||||
|
@import "dashboard/pro/custom/modal.scss";
|
||||||
|
@import "dashboard/pro/custom/nav.scss";
|
||||||
|
@import "dashboard/pro/custom/navbar.scss";
|
||||||
|
@import "dashboard/pro/custom/pagination.scss";
|
||||||
|
@import "dashboard/pro/custom/tabs.scss";
|
||||||
|
@import "dashboard/pro/custom/pills.scss";
|
||||||
|
@import "dashboard/pro/custom/popover.scss";
|
||||||
|
@import "dashboard/pro/custom/progress.scss";
|
||||||
|
@import "dashboard/pro/custom/type.scss";
|
||||||
|
@import "dashboard/pro/custom/tables";
|
||||||
|
@import "dashboard/pro/custom/checkboxes-radio";
|
||||||
|
@import "dashboard/pro/custom/fixed-plugin";
|
||||||
|
@import "dashboard/pro/custom/sidebar-and-main-panel.scss";
|
||||||
|
@import "dashboard/pro/custom/misc.scss";
|
||||||
|
@import "dashboard/pro/custom/rtl.scss";
|
||||||
|
@import "dashboard/pro/custom/timeline.scss";
|
||||||
|
|
||||||
|
// Vendor / Plugins
|
||||||
|
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-datetimepicker.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-nouislider.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-fullcalendar.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-sweetalert2.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-bootstrap-switch.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-bootstrap-select.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-jasny-fileupload.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-tagsinput.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-perfect-scrollbar.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-jquery.jvectormap.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-datatables.net.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-animate-bootstrap-notify.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-card-wizard.scss";
|
||||||
|
@import "dashboard/pro/custom/vendor/plugin-chartjs.scss";
|
||||||
|
|
||||||
|
// example pages and sections
|
||||||
|
|
||||||
|
@import "dashboard/pro/custom/example-pages.scss";
|
||||||
|
|
||||||
|
// light mode
|
||||||
|
|
||||||
|
@import "dashboard/pro/custom/white-content.scss";
|
||||||
|
|
||||||
|
// Cards
|
||||||
|
|
||||||
|
@import 'dashboard/pro/custom/card';
|
||||||
|
@import "dashboard/pro/custom/cards/card-chart";
|
||||||
|
@import "dashboard/pro/custom/cards/card-map";
|
||||||
|
@import "dashboard/pro/custom/cards/card-user";
|
||||||
|
@import "dashboard/pro/custom/cards/card-task";
|
||||||
|
@import "dashboard/pro/custom/cards/card-animation-on-hover";
|
||||||
|
@import "dashboard/pro/custom/cards/card-collapse";
|
||||||
|
@import "dashboard/pro/custom/cards/card-contributions";
|
||||||
|
@import "dashboard/pro/custom/cards/card-lock";
|
||||||
|
@import "dashboard/pro/custom/cards/card-pricing";
|
||||||
|
@import "dashboard/pro/custom/cards/card-profile";
|
||||||
|
@import "dashboard/pro/custom/cards/card-plain";
|
||||||
|
@import "dashboard/pro/custom/cards/card-register";
|
||||||
|
@import "dashboard/pro/custom/cards/card-stats";
|
||||||
|
@import "dashboard/pro/custom/cards/card-subcategories";
|
||||||
|
@import "dashboard/pro/custom/cards/card-testimonials";
|
||||||
|
@import "dashboard/pro/custom/cards/card-wizard";
|
||||||
29
assets/scss/dashboard/core/bootstrap/bootstrap-grid.scss
vendored
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap Grid v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
*/
|
||||||
|
|
||||||
|
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";
|
||||||
|
@import "utilities/spacing";
|
||||||
12
assets/scss/dashboard/core/bootstrap/bootstrap-reboot.scss
vendored
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap Reboot v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import "functions";
|
||||||
|
@import "variables";
|
||||||
|
@import "mixins";
|
||||||
|
@import "reboot";
|
||||||
44
assets/scss/dashboard/core/bootstrap/bootstrap.scss
vendored
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
*/
|
||||||
|
|
||||||
|
@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 "toasts";
|
||||||
|
@import "modal";
|
||||||
|
@import "tooltip";
|
||||||
|
@import "popover";
|
||||||
|
@import "carousel";
|
||||||
|
@import "spinners";
|
||||||
|
@import "utilities";
|
||||||
|
@import "print";
|
||||||
8
assets/scss/dashboard/core/custom/mixins/opacity.scss
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
// Opacity
|
||||||
|
|
||||||
|
@mixin opacity($opacity) {
|
||||||
|
opacity: $opacity;
|
||||||
|
// IE8 filter
|
||||||
|
$opacity-ie: ($opacity * 100);
|
||||||
|
filter: #{alpha(opacity=$opacity-ie)};
|
||||||
|
}
|
||||||
29
assets/scss/dashboard/pro/bootstrap/bootstrap-grid.scss
vendored
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap Grid v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
*/
|
||||||
|
|
||||||
|
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";
|
||||||
|
@import "utilities/spacing";
|
||||||
12
assets/scss/dashboard/pro/bootstrap/bootstrap-reboot.scss
vendored
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap Reboot v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import "functions";
|
||||||
|
@import "variables";
|
||||||
|
@import "mixins";
|
||||||
|
@import "reboot";
|
||||||
44
assets/scss/dashboard/pro/bootstrap/bootstrap.scss
vendored
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
*/
|
||||||
|
|
||||||
|
@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 "toasts";
|
||||||
|
@import "modal";
|
||||||
|
@import "tooltip";
|
||||||
|
@import "popover";
|
||||||
|
@import "carousel";
|
||||||
|
@import "spinners";
|
||||||
|
@import "utilities";
|
||||||
|
@import "print";
|
||||||
8
assets/scss/dashboard/pro/custom/mixins/opacity.scss
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
// Opacity
|
||||||
|
|
||||||
|
@mixin opacity($opacity) {
|
||||||
|
opacity: $opacity;
|
||||||
|
// IE8 filter
|
||||||
|
$opacity-ie: ($opacity * 100);
|
||||||
|
filter: #{alpha(opacity=$opacity-ie)};
|
||||||
|
}
|
||||||
113
assets/scss/kit-free.scss
Normal file
@ -0,0 +1,113 @@
|
|||||||
|
|
||||||
|
/*
|
||||||
|
=========================================================
|
||||||
|
* site.product_name - site.current_version
|
||||||
|
=========================================================
|
||||||
|
|
||||||
|
* Product Page: site.link_tim
|
||||||
|
* Copyright site.year Creative Tim (http://www.creative-tim.com)
|
||||||
|
|
||||||
|
|
||||||
|
=========================================================
|
||||||
|
|
||||||
|
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Core
|
||||||
|
|
||||||
|
@import "kit/core/custom/functions";
|
||||||
|
@import "kit/core/bootstrap/functions";
|
||||||
|
|
||||||
|
@import "kit/core/custom/variables";
|
||||||
|
@import "kit/core/bootstrap/variables";
|
||||||
|
|
||||||
|
@import "kit/core/custom/mixins";
|
||||||
|
@import "kit/core/bootstrap/mixins";
|
||||||
|
|
||||||
|
// Bootstrap components
|
||||||
|
|
||||||
|
@import "kit/core/bootstrap/root";
|
||||||
|
@import "kit/core/bootstrap/reboot";
|
||||||
|
@import "kit/core/bootstrap/type";
|
||||||
|
@import "kit/core/bootstrap/images";
|
||||||
|
@import "kit/core/bootstrap/code";
|
||||||
|
@import "kit/core/bootstrap/grid";
|
||||||
|
@import "kit/core/bootstrap/tables";
|
||||||
|
@import "kit/core/bootstrap/forms";
|
||||||
|
@import "kit/core/bootstrap/buttons";
|
||||||
|
@import "kit/core/bootstrap/transitions";
|
||||||
|
@import "kit/core/bootstrap/dropdown";
|
||||||
|
@import "kit/core/bootstrap/button-group";
|
||||||
|
@import "kit/core/bootstrap/input-group";
|
||||||
|
@import "kit/core/bootstrap/custom-forms";
|
||||||
|
@import "kit/core/bootstrap/nav";
|
||||||
|
@import "kit/core/bootstrap/navbar";
|
||||||
|
@import "kit/core/bootstrap/card";
|
||||||
|
@import "kit/core/bootstrap/breadcrumb";
|
||||||
|
@import "kit/core/bootstrap/pagination";
|
||||||
|
@import "kit/core/bootstrap/badge";
|
||||||
|
@import "kit/core/bootstrap/jumbotron";
|
||||||
|
@import "kit/core/bootstrap/alert";
|
||||||
|
@import "kit/core/bootstrap/progress";
|
||||||
|
@import "kit/core/bootstrap/media";
|
||||||
|
@import "kit/core/bootstrap/list-group";
|
||||||
|
@import "kit/core/bootstrap/close";
|
||||||
|
@import "kit/core/bootstrap/modal";
|
||||||
|
@import "kit/core/bootstrap/tooltip";
|
||||||
|
@import "kit/core/bootstrap/popover";
|
||||||
|
@import "kit/core/bootstrap/carousel";
|
||||||
|
@import "kit/core/bootstrap/utilities";
|
||||||
|
@import "kit/core/bootstrap/print";
|
||||||
|
|
||||||
|
// Custom components
|
||||||
|
|
||||||
|
@import "kit/core/custom/alerts.scss";
|
||||||
|
@import "kit/core/custom/buttons.scss";
|
||||||
|
@import "kit/core/custom/dropdown.scss";
|
||||||
|
@import "kit/core/custom/footer.scss";
|
||||||
|
@import "kit/core/custom/forms.scss";
|
||||||
|
@import "kit/core/custom/images.scss";
|
||||||
|
@import "kit/core/custom/modal.scss";
|
||||||
|
@import "kit/core/custom/navbar.scss";
|
||||||
|
@import "kit/core/custom/type.scss";
|
||||||
|
@import "kit/core/custom/icons.scss";
|
||||||
|
@import "kit/core/custom/tables";
|
||||||
|
@import "kit/core/custom/checkboxes-radio";
|
||||||
|
@import "kit/core/custom/fixed-plugin";
|
||||||
|
@import "kit/core/custom/pagination.scss";
|
||||||
|
@import "kit/core/custom/misc.scss";
|
||||||
|
@import "kit/core/custom/rtl.scss";
|
||||||
|
@import "kit/core/custom/input-group.scss";
|
||||||
|
@import "kit/core/custom/example-pages.scss";
|
||||||
|
@import "kit/core/custom/progress.scss";
|
||||||
|
@import "kit/core/custom/badge.scss";
|
||||||
|
@import "kit/core/custom/pills.scss";
|
||||||
|
@import "kit/core/custom/tabs.scss";
|
||||||
|
@import "kit/core/custom/info-areas.scss";
|
||||||
|
|
||||||
|
// Sections
|
||||||
|
@import "kit/core/custom/sections.scss";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// Vendor / Plugins
|
||||||
|
|
||||||
|
@import "kit/core/custom/vendor/plugin-perfect-scrollbar.scss";
|
||||||
|
@import "kit/core/custom/vendor/plugin-animate-bootstrap-notify.scss";
|
||||||
|
@import "kit/core/custom/vendor/plugin-bootstrap-switch.scss";
|
||||||
|
@import "kit/core/custom/vendor/plugin-nouislider.scss";
|
||||||
|
@import "kit/core/custom/vendor/plugin-datetimepicker.scss";
|
||||||
|
|
||||||
|
|
||||||
|
// Cards
|
||||||
|
|
||||||
|
@import 'kit/core/custom/card';
|
||||||
|
@import "kit/core/custom/cards/card-chart";
|
||||||
|
@import "kit/core/custom/cards/card-map";
|
||||||
|
@import "kit/core/custom/cards/card-user";
|
||||||
|
@import "kit/core/custom/cards/card-task";
|
||||||
|
@import "kit/core/custom/cards/card-plain";
|
||||||
|
@import "kit/core/custom/cards/card-register";
|
||||||
|
@import "kit/core/custom/cards/card-stats";
|
||||||
|
@import "kit/core/custom/cards/card-chart";
|
||||||
152
assets/scss/kit-pro.scss
Normal file
@ -0,0 +1,152 @@
|
|||||||
|
/*!
|
||||||
|
|
||||||
|
=========================================================
|
||||||
|
* site.product_name - site.current_version
|
||||||
|
=========================================================
|
||||||
|
|
||||||
|
* Product Page: site.link_tim
|
||||||
|
* Copyright site.year Creative Tim (http://www.creative-tim.com)
|
||||||
|
|
||||||
|
* Designed by www.invisionapp.com Coded by www.creative-tim.com
|
||||||
|
|
||||||
|
=========================================================
|
||||||
|
|
||||||
|
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import "kit/pro/custom/functions";
|
||||||
|
@import "kit/pro/bootstrap/functions";
|
||||||
|
|
||||||
|
@import "kit/pro/variables";
|
||||||
|
@import "kit/pro/bootstrap/variables";
|
||||||
|
|
||||||
|
@import "kit/pro/custom/mixins";
|
||||||
|
@import "kit/pro/bootstrap/mixins";
|
||||||
|
|
||||||
|
// Bootstrap components
|
||||||
|
|
||||||
|
@import "kit/pro/bootstrap/root";
|
||||||
|
@import "kit/pro/bootstrap/reboot";
|
||||||
|
@import "kit/pro/bootstrap/type";
|
||||||
|
@import "kit/pro/bootstrap/images";
|
||||||
|
@import "kit/pro/bootstrap/code";
|
||||||
|
@import "kit/pro/bootstrap/grid";
|
||||||
|
@import "kit/pro/bootstrap/tables";
|
||||||
|
@import "kit/pro/bootstrap/forms";
|
||||||
|
@import "kit/pro/bootstrap/buttons";
|
||||||
|
@import "kit/pro/bootstrap/transitions";
|
||||||
|
@import "kit/pro/bootstrap/dropdown";
|
||||||
|
@import "kit/pro/bootstrap/button-group";
|
||||||
|
@import "kit/pro/bootstrap/input-group";
|
||||||
|
@import "kit/pro/bootstrap/custom-forms";
|
||||||
|
@import "kit/pro/bootstrap/nav";
|
||||||
|
@import "kit/pro/bootstrap/navbar";
|
||||||
|
@import "kit/pro/bootstrap/card";
|
||||||
|
@import "kit/pro/bootstrap/breadcrumb";
|
||||||
|
@import "kit/pro/bootstrap/pagination";
|
||||||
|
@import "kit/pro/bootstrap/badge";
|
||||||
|
@import "kit/pro/bootstrap/jumbotron";
|
||||||
|
@import "kit/pro/bootstrap/alert";
|
||||||
|
@import "kit/pro/bootstrap/progress";
|
||||||
|
@import "kit/pro/bootstrap/media";
|
||||||
|
@import "kit/pro/bootstrap/list-group";
|
||||||
|
@import "kit/pro/bootstrap/close";
|
||||||
|
@import "kit/pro/bootstrap/modal";
|
||||||
|
@import "kit/pro/bootstrap/tooltip";
|
||||||
|
@import "kit/pro/bootstrap/popover";
|
||||||
|
@import "kit/pro/bootstrap/carousel";
|
||||||
|
@import "kit/pro/bootstrap/utilities";
|
||||||
|
@import "kit/pro/bootstrap/print";
|
||||||
|
|
||||||
|
// Custom components
|
||||||
|
|
||||||
|
@import "kit/pro/custom/alerts.scss";
|
||||||
|
@import "kit/pro/custom/buttons.scss";
|
||||||
|
@import "kit/pro/custom/dropdown.scss";
|
||||||
|
@import "kit/pro/custom/footer.scss";
|
||||||
|
@import "kit/pro/custom/forms.scss";
|
||||||
|
@import "kit/pro/custom/images.scss";
|
||||||
|
@import "kit/pro/custom/modal.scss";
|
||||||
|
@import "kit/pro/custom/navbar.scss";
|
||||||
|
@import "kit/pro/custom/type.scss";
|
||||||
|
@import "kit/pro/custom/icons.scss";
|
||||||
|
@import "kit/pro/custom/checkboxes-radio";
|
||||||
|
@import "kit/pro/custom/fixed-plugin";
|
||||||
|
@import "kit/pro/custom/pagination.scss";
|
||||||
|
@import "kit/pro/custom/misc.scss";
|
||||||
|
@import "kit/pro/custom/rtl.scss";
|
||||||
|
@import "kit/pro/custom/input-group.scss";
|
||||||
|
@import "kit/pro/custom/progress.scss";
|
||||||
|
@import "kit/pro/custom/badge.scss";
|
||||||
|
@import "kit/pro/custom/pills.scss";
|
||||||
|
@import "kit/pro/custom/tabs.scss";
|
||||||
|
@import "kit/pro/info-areas.scss";
|
||||||
|
@import "kit/pro/misc-extend.scss";
|
||||||
|
@import "kit/pro/sections-extend.scss";
|
||||||
|
@import "kit/pro/footers.scss";
|
||||||
|
@import "kit/pro/tables.scss";
|
||||||
|
|
||||||
|
|
||||||
|
// Pro components
|
||||||
|
|
||||||
|
@import "kit/pro/example-pages.scss";
|
||||||
|
@import "kit/pro/social-buttons.scss";
|
||||||
|
@import "kit/pro/media.scss";
|
||||||
|
@import "kit/pro/modals-extend.scss";
|
||||||
|
@import "kit/pro/navbar-extend.scss";
|
||||||
|
@import "kit/pro/buttons-extend.scss";
|
||||||
|
@import "kit/pro/pills-extend.scss";
|
||||||
|
@import "kit/pro/dropdown-extend.scss";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// Sections
|
||||||
|
@import "kit/pro/custom/sections.scss";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// Vendor / Plugins
|
||||||
|
|
||||||
|
@import "kit/pro/custom/vendor/plugin-perfect-scrollbar.scss";
|
||||||
|
@import "kit/pro/custom/vendor/plugin-animate-bootstrap-notify.scss";
|
||||||
|
@import "kit/pro/custom/vendor/plugin-bootstrap-switch.scss";
|
||||||
|
@import "kit/pro/custom/vendor/plugin-nouislider.scss";
|
||||||
|
@import "kit/pro/custom/vendor/plugin-datetimepicker.scss";
|
||||||
|
@import "kit/pro/plugins/plugin-tagsinput.scss";
|
||||||
|
@import "kit/pro/plugins/plugin-bootstrap-select";
|
||||||
|
@import "kit/pro/plugins/plugin-jasny-fileupload.scss";
|
||||||
|
@import "kit/pro/plugins/plugin-carousel-slick.scss";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// Cards
|
||||||
|
|
||||||
|
@import 'kit/pro/custom/card';
|
||||||
|
@import "kit/pro/custom/cards/card-chart";
|
||||||
|
@import "kit/pro/custom/cards/card-map";
|
||||||
|
@import "kit/pro/custom/cards/card-user";
|
||||||
|
@import "kit/pro/custom/cards/card-task";
|
||||||
|
@import "kit/pro/custom/cards/card-plain";
|
||||||
|
@import "kit/pro/custom/cards/card-register";
|
||||||
|
@import "kit/pro/custom/cards/card-stats";
|
||||||
|
@import "kit/pro/custom/cards/card-chart";
|
||||||
|
@import "kit/pro/cards/card-background";
|
||||||
|
@import "kit/pro/cards/card-blog";
|
||||||
|
@import "kit/pro/cards/card-profile";
|
||||||
|
@import "kit/pro/cards/card-pricing";
|
||||||
|
@import "kit/pro/cards/card-login";
|
||||||
|
@import "kit/pro/cards/card-testimonials";
|
||||||
|
@import "kit/pro/cards/card-product";
|
||||||
|
|
||||||
|
|
||||||
|
// Avatars
|
||||||
|
|
||||||
|
@import "kit/pro/avatars/avatar-group";
|
||||||
|
@import "kit/pro/avatars/avatar";
|
||||||
|
|
||||||
|
|
||||||
|
// Responsive
|
||||||
|
|
||||||
|
@import "kit/pro/responsive";
|
||||||
29
assets/scss/kit/core/bootstrap/bootstrap-grid.scss
vendored
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap Grid v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
*/
|
||||||
|
|
||||||
|
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";
|
||||||
|
@import "utilities/spacing";
|
||||||
12
assets/scss/kit/core/bootstrap/bootstrap-reboot.scss
vendored
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap Reboot v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import "functions";
|
||||||
|
@import "variables";
|
||||||
|
@import "mixins";
|
||||||
|
@import "reboot";
|
||||||
44
assets/scss/kit/core/bootstrap/bootstrap.scss
vendored
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
*/
|
||||||
|
|
||||||
|
@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 "toasts";
|
||||||
|
@import "modal";
|
||||||
|
@import "tooltip";
|
||||||
|
@import "popover";
|
||||||
|
@import "carousel";
|
||||||
|
@import "spinners";
|
||||||
|
@import "utilities";
|
||||||
|
@import "print";
|
||||||
8
assets/scss/kit/core/custom/mixins/opacity.scss
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
// Opacity
|
||||||
|
|
||||||
|
@mixin opacity($opacity) {
|
||||||
|
opacity: $opacity;
|
||||||
|
// IE8 filter
|
||||||
|
$opacity-ie: ($opacity * 100);
|
||||||
|
filter: #{alpha(opacity=$opacity-ie)};
|
||||||
|
}
|
||||||
29
assets/scss/kit/pro/bootstrap/bootstrap-grid.scss
vendored
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap Grid v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
*/
|
||||||
|
|
||||||
|
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";
|
||||||
|
@import "utilities/spacing";
|
||||||
12
assets/scss/kit/pro/bootstrap/bootstrap-reboot.scss
vendored
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap Reboot v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import "functions";
|
||||||
|
@import "variables";
|
||||||
|
@import "mixins";
|
||||||
|
@import "reboot";
|
||||||
44
assets/scss/kit/pro/bootstrap/bootstrap.scss
vendored
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
/*!
|
||||||
|
* Bootstrap v4.3.1 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2019 The Bootstrap Authors
|
||||||
|
* Copyright 2011-2019 Twitter, Inc.
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||||
|
*/
|
||||||
|
|
||||||
|
@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 "toasts";
|
||||||
|
@import "modal";
|
||||||
|
@import "tooltip";
|
||||||
|
@import "popover";
|
||||||
|
@import "carousel";
|
||||||
|
@import "spinners";
|
||||||
|
@import "utilities";
|
||||||
|
@import "print";
|
||||||
8
assets/scss/kit/pro/custom/mixins/opacity.scss
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
// Opacity
|
||||||
|
|
||||||
|
@mixin opacity($opacity) {
|
||||||
|
opacity: $opacity;
|
||||||
|
// IE8 filter
|
||||||
|
$opacity-ie: ($opacity * 100);
|
||||||
|
filter: #{alpha(opacity=$opacity-ie)};
|
||||||
|
}
|
||||||
BIN
assets/video/fireworks.mp4
Normal file
BIN
docs/.DS_Store
vendored
Normal file
BIN
docs/1.0/.DS_Store
vendored
Normal file
1579
docs/1.0/browser-bugs.html
Normal file
1022
docs/1.0/components/alerts.html
Normal file
974
docs/1.0/components/badge.html
Normal file
@ -0,0 +1,974 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="active bd-sidenav-active">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||||
|
<ul class="section-nav">
|
||||||
|
<li class="toc-entry toc-h2"><a href="#example">Example</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#contextual-variations">Contextual variations</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#pill-badges">Pill badges</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#links">Links</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">Badges</h1>
|
||||||
|
<p class="bd-lead">Documentation and examples for badges, our small count and labeling component.</p>
|
||||||
|
<h2 id="example">Example</h2>
|
||||||
|
|
||||||
|
<p>Badges can be used as part of links or buttons to provide a counter.</p>
|
||||||
|
|
||||||
|
<div class="bd-example" data-example-id="">
|
||||||
|
<button type="button" class="btn btn-primary">
|
||||||
|
Notifications <span class="badge badge-default">4</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><button</span> <span class="na">type=</span><span class="s">"button"</span> <span class="na">class=</span><span class="s">"btn btn-primary"</span><span class="nt">></span>
|
||||||
|
Notifications <span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-default"</span><span class="nt">></span>4<span class="nt"></span></span>
|
||||||
|
<span class="nt"></button></span></code></pre></div>
|
||||||
|
|
||||||
|
<h2 id="contextual-variations">Contextual variations</h2>
|
||||||
|
|
||||||
|
<p>Add any of the below mentioned modifier classes to change the appearance of a badge.</p>
|
||||||
|
|
||||||
|
<div class="bd-example" data-example-id="">
|
||||||
|
<span class="badge badge-primary">Primary</span>
|
||||||
|
<span class="badge badge-info">Info</span>
|
||||||
|
<span class="badge badge-success">Success</span>
|
||||||
|
<span class="badge badge-danger">Danger</span>
|
||||||
|
<span class="badge badge-warning">Warning</span>
|
||||||
|
<span class="badge badge-default">Default</span>
|
||||||
|
</div>
|
||||||
|
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-primary"</span><span class="nt">></span>Primary<span class="nt"></span></span>
|
||||||
|
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-info"</span><span class="nt">></span>Info<span class="nt"></span></span>
|
||||||
|
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-success"</span><span class="nt">></span>Success<span class="nt"></span></span>
|
||||||
|
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-danger"</span><span class="nt">></span>Danger<span class="nt"></span></span>
|
||||||
|
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-warning"</span><span class="nt">></span>Warning<span class="nt"></span></span>
|
||||||
|
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-default"</span><span class="nt">></span>Default<span class="nt"></span></span></code></pre></div>
|
||||||
|
|
||||||
|
<h2 id="pill-badges">Pill badges</h2>
|
||||||
|
|
||||||
|
<p>Use the <code class="highlighter-rouge">.badge-pill</code> modifier class to make badges more rounded (with a larger <code class="highlighter-rouge">border-radius</code> and additional horizontal <code class="highlighter-rouge">padding</code>). Useful if you miss the badges from v3.</p>
|
||||||
|
|
||||||
|
<div class="bd-example" data-example-id="">
|
||||||
|
<span class="badge badge-pill badge-primary">Primary</span>
|
||||||
|
<span class="badge badge-pill badge-info">Info</span>
|
||||||
|
<span class="badge badge-pill badge-success">Success</span>
|
||||||
|
<span class="badge badge-pill badge-danger">Danger</span>
|
||||||
|
<span class="badge badge-pill badge-warning">Warning</span>
|
||||||
|
<span class="badge badge-pill badge-default">Default</span>
|
||||||
|
</div>
|
||||||
|
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-pill badge-primary"</span><span class="nt">></span>Primary<span class="nt"></span></span>
|
||||||
|
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-pill badge-info"</span><span class="nt">></span>Info<span class="nt"></span></span>
|
||||||
|
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-pill badge-success"</span><span class="nt">></span>Success<span class="nt"></span></span>
|
||||||
|
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-pill badge-danger"</span><span class="nt">></span>Danger<span class="nt"></span></span>
|
||||||
|
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-pill badge-warning"</span><span class="nt">></span>Warning<span class="nt"></span></span>
|
||||||
|
<span class="nt"><span</span> <span class="na">class=</span><span class="s">"badge badge-pill badge-default"</span><span class="nt">></span>Default<span class="nt"></span></span></code></pre></div>
|
||||||
|
|
||||||
|
<h2 id="links">Links</h2>
|
||||||
|
|
||||||
|
<p>Using the contextual <code class="highlighter-rouge">.badge-*</code> classes on an <code class="highlighter-rouge"><a></code> element quickly provide <em>actionable</em> badges with hover and focus states.</p>
|
||||||
|
|
||||||
|
<div class="bd-example" data-example-id="">
|
||||||
|
<a href="#" class="badge badge-primary">Primary</a>
|
||||||
|
<a href="#" class="badge badge-info">Info</a>
|
||||||
|
<a href="#" class="badge badge-success">Success</a>
|
||||||
|
<a href="#" class="badge badge-danger">Danger</a>
|
||||||
|
<a href="#" class="badge badge-warning">Warning</a>
|
||||||
|
<a href="#" class="badge badge-default">Default</a>
|
||||||
|
</div>
|
||||||
|
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"badge badge-primary"</span><span class="nt">></span>Primary<span class="nt"></a></span>
|
||||||
|
<span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"badge badge-info"</span><span class="nt">></span>Info<span class="nt"></a></span>
|
||||||
|
<span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"badge badge-success"</span><span class="nt">></span>Success<span class="nt"></a></span>
|
||||||
|
<span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"badge badge-danger"</span><span class="nt">></span>Danger<span class="nt"></a></span>
|
||||||
|
<span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"badge badge-warning"</span><span class="nt">></span>Warning<span class="nt"></a></span>
|
||||||
|
<span class="nt"><a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"badge badge-default"</span><span class="nt">></span>Default<span class="nt"></a></span></code></pre></div>
|
||||||
|
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
942
docs/1.0/components/breadcrumb.html
Normal file
@ -0,0 +1,942 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="active bd-sidenav-active">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">Breadcrumb</h1>
|
||||||
|
<p class="bd-lead">Indicate the current page's location within a navigational hierarchy that automatically adds separators via CSS.</p>
|
||||||
|
<h2 id="overview">Overview</h2>
|
||||||
|
|
||||||
|
<p>Separators are automatically added in CSS through <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/::before"><code class="highlighter-rouge">::before</code></a> and <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/content"><code class="highlighter-rouge">content</code></a>.</p>
|
||||||
|
|
||||||
|
<div class="bd-example" data-example-id="">
|
||||||
|
<nav aria-label="breadcrumb" role="navigation">
|
||||||
|
<ol class="breadcrumb">
|
||||||
|
<li class="breadcrumb-item active" aria-current="page">Home</li>
|
||||||
|
</ol>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<nav aria-label="breadcrumb" role="navigation">
|
||||||
|
<ol class="breadcrumb">
|
||||||
|
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
||||||
|
<li class="breadcrumb-item active" aria-current="page">Library</li>
|
||||||
|
</ol>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<nav aria-label="breadcrumb" role="navigation">
|
||||||
|
<ol class="breadcrumb">
|
||||||
|
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
||||||
|
<li class="breadcrumb-item"><a href="#">Library</a></li>
|
||||||
|
<li class="breadcrumb-item active" aria-current="page">Data</li>
|
||||||
|
</ol>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><nav</span> <span class="na">aria-label=</span><span class="s">"breadcrumb"</span> <span class="na">role=</span><span class="s">"navigation"</span><span class="nt">></span>
|
||||||
|
<span class="nt"><ol</span> <span class="na">class=</span><span class="s">"breadcrumb"</span><span class="nt">></span>
|
||||||
|
<span class="nt"><li</span> <span class="na">class=</span><span class="s">"breadcrumb-item active"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Home<span class="nt"></li></span>
|
||||||
|
<span class="nt"></ol></span>
|
||||||
|
<span class="nt"></nav></span>
|
||||||
|
|
||||||
|
<span class="nt"><nav</span> <span class="na">aria-label=</span><span class="s">"breadcrumb"</span> <span class="na">role=</span><span class="s">"navigation"</span><span class="nt">></span>
|
||||||
|
<span class="nt"><ol</span> <span class="na">class=</span><span class="s">"breadcrumb"</span><span class="nt">></span>
|
||||||
|
<span class="nt"><li</span> <span class="na">class=</span><span class="s">"breadcrumb-item"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Home<span class="nt"></a></li></span>
|
||||||
|
<span class="nt"><li</span> <span class="na">class=</span><span class="s">"breadcrumb-item active"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Library<span class="nt"></li></span>
|
||||||
|
<span class="nt"></ol></span>
|
||||||
|
<span class="nt"></nav></span>
|
||||||
|
|
||||||
|
<span class="nt"><nav</span> <span class="na">aria-label=</span><span class="s">"breadcrumb"</span> <span class="na">role=</span><span class="s">"navigation"</span><span class="nt">></span>
|
||||||
|
<span class="nt"><ol</span> <span class="na">class=</span><span class="s">"breadcrumb"</span><span class="nt">></span>
|
||||||
|
<span class="nt"><li</span> <span class="na">class=</span><span class="s">"breadcrumb-item"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Home<span class="nt"></a></li></span>
|
||||||
|
<span class="nt"><li</span> <span class="na">class=</span><span class="s">"breadcrumb-item"</span><span class="nt">><a</span> <span class="na">href=</span><span class="s">"#"</span><span class="nt">></span>Library<span class="nt"></a></li></span>
|
||||||
|
<span class="nt"><li</span> <span class="na">class=</span><span class="s">"breadcrumb-item active"</span> <span class="na">aria-current=</span><span class="s">"page"</span><span class="nt">></span>Data<span class="nt"></li></span>
|
||||||
|
<span class="nt"></ol></span>
|
||||||
|
<span class="nt"></nav></span></code></pre></div>
|
||||||
|
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
1005
docs/1.0/components/buttons.html
Normal file
1312
docs/1.0/components/card.html
Normal file
1041
docs/1.0/components/collapse.html
Normal file
1259
docs/1.0/components/dropdowns.html
Normal file
1631
docs/1.0/components/forms.html
Normal file
906
docs/1.0/components/google-maps.html
Normal file
@ -0,0 +1,906 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="active bd-sidenav-active">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||||
|
<ul class="section-nav">
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">How to set up Google API Keys</h1>
|
||||||
|
<p class="bd-lead"></p>
|
||||||
|
<ol>
|
||||||
|
<li>Go to <a href="https://developers.google.com/maps/documentation/javascript/get-api-key">https://developers.google.com/maps/documentation/javascript/get-api-key</a></li>
|
||||||
|
<li>Scroll to the “Get an API key” Title and press “Get a Key” Button</li>
|
||||||
|
<li>Choose a name for your project then press on Create and Enable API</li>
|
||||||
|
<li>Get the Key and place it in your project where is this script:<code class="highlighter-rouge"><script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"><script></code></li>
|
||||||
|
</ol>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
1371
docs/1.0/components/modal.html
Normal file
1788
docs/1.0/components/navbar.html
Normal file
1092
docs/1.0/components/navs.html
Normal file
907
docs/1.0/components/nucleo-icons.html
Normal file
@ -0,0 +1,907 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="active bd-sidenav-active">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||||
|
<ul class="section-nav">
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">Nucleo Icons</h1>
|
||||||
|
<p class="bd-lead"></p>
|
||||||
|
<p>Through most of the examples in this kit, we have used 100 Nucleo Icons for the Black Dashboard. View all the <a href="http://demos.creative-tim.com/black-dashboard-pro/nucleo-icons.html">example icons</a>. If you want more than 2100 icons please check the official <a href="https://nucleoapp.com/?ref=1712">Nucleo Icons Pack</a>.</p>
|
||||||
|
|
||||||
|
<div class="bd-example" data-example-id="">
|
||||||
|
<i class="tim-icons icon-single-02"></i>
|
||||||
|
</div>
|
||||||
|
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><i</span> <span class="na">class=</span><span class="s">"tim-icons icon-single-02"</span><span class="nt">></i></span></code></pre></div>
|
||||||
|
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
1048
docs/1.0/components/tables.html
Normal file
1101
docs/1.0/components/typography.html
Normal file
1232
docs/1.0/foundation/colors.html
Normal file
1083
docs/1.0/getting-started/flask-deploy-on-heroku.html
Normal file
1592
docs/1.0/getting-started/getting-started-flask.html
Normal file
1069
docs/1.0/getting-started/introduction.html
Normal file
896
docs/1.0/getting-started/license.html
Normal file
@ -0,0 +1,896 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">License</h1>
|
||||||
|
<p class="bd-lead"></p>
|
||||||
|
<p>Currently, on <a href="https://www.creative-tim.com/">Creative Tim</a> you can get the products with two types of licenses: Personal or Developer. All the freebies are licensed to Personal License as default. If you are making a paid purchase, be sure to go through the table with the rights and the guidelines, so you can know what is the best fit for you. View the rights table and the description for each license on our <a href="http://www.creative-tim.com/license?ref=license-page-bd">Official License Page</a>.</p>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
1048
docs/1.0/getting-started/setup-centos-for-development.html
Normal file
978
docs/1.0/getting-started/setup-ubuntu-for-development.html
Normal file
@ -0,0 +1,978 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||||
|
<ul class="section-nav">
|
||||||
|
<li class="toc-entry toc-h1"><a href="#setup-ubuntu-for-developers">Setup Ubuntu for developers</a>
|
||||||
|
<ul>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#install-basic-development-tools">Install basic development tools</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#install-git">Install Git</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#install-python3">Install Python3</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#installing-nodejs">Installing Node.js</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#installing-yarn">Installing Yarn</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">Setup Ubuntu for Developers</h1>
|
||||||
|
<p class="bd-lead"></p>
|
||||||
|
<h1 id="setup-ubuntu-for-developers">Setup <a href="https://ubuntu.com/">Ubuntu</a> for developers</h1>
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<p><a href="https://ubuntu.com/">Ubuntu</a> is a complete Linux operating system, freely available with both community and professional support. Ubuntu is suitable for both desktop and server use. The current Ubuntu release supports many architectures: Intel x86 (IBM-compatible PC), AMD64 (x86-64), ARMv7, ARMv8.</p>
|
||||||
|
|
||||||
|
<p>Ubuntu includes thousands of pieces of software, starting with the Linux kernel version 4.15 and GNOME 3.28, and covering every standard desktop application from word processing and spreadsheet applications to internet access applications, web server software, email software, programming languages and tools and of course several games. For more information please access the official website: <a href="https://ubuntu.com/">Ubuntu.com</a></p>
|
||||||
|
|
||||||
|
<p><br /></p>
|
||||||
|
|
||||||
|
<h2 id="install-basic-development-tools">Install basic development tools</h2>
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<p>The <code class="highlighter-rouge">Build Essential</code> package group provides the GNU Compiler Collection (GCC), GNU Debugger (GDB), and other related development tools.</p>
|
||||||
|
|
||||||
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nv">$ </span><span class="c"># install Development Tools bundle</span>
|
||||||
|
<span class="nv">$ </span><span class="nb">sudo </span>apt <span class="nb">install </span>build-essential
|
||||||
|
|
||||||
|
</code></pre></div></div>
|
||||||
|
|
||||||
|
<p><br /></p>
|
||||||
|
|
||||||
|
<h2 id="install-git">Install <a href="https://git-scm.com/">Git</a></h2>
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<p><a href="https://git-scm.com/">Git</a> is the most popular version control system on Linux. It is easy to use, amazingly fast, it’s very efficient with large projects, and it has an incredible branching system for non-linear development.</p>
|
||||||
|
|
||||||
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nv">$ </span><span class="nb">sudo </span>apt <span class="nb">install install </span>git
|
||||||
|
</code></pre></div></div>
|
||||||
|
|
||||||
|
<p><br /></p>
|
||||||
|
|
||||||
|
<h2 id="install-python3">Install Python3</h2>
|
||||||
|
|
||||||
|
<p>Ubuntu comes with both Python 2.7 and Python 3.5 by default. You can install Python 3.6 along with them via a <a href="https://launchpad.net/~jonathonf/+archive/ubuntu/python-3.6">third-party PPA</a> by doing the following steps:</p>
|
||||||
|
|
||||||
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nv">$ </span><span class="nb">sudo </span>add-apt-repository ppa:jonathonf/python-3.6
|
||||||
|
</code></pre></div></div>
|
||||||
|
|
||||||
|
<blockquote>
|
||||||
|
<p>And Python3 libraries for development</p>
|
||||||
|
</blockquote>
|
||||||
|
|
||||||
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nv">$ </span><span class="nb">sudo </span>apt-get update
|
||||||
|
<span class="nv">$ </span><span class="nb">sudo </span>apt-get <span class="nb">install </span>python3.6
|
||||||
|
</code></pre></div></div>
|
||||||
|
|
||||||
|
<p><br /></p>
|
||||||
|
|
||||||
|
<h2 id="installing-nodejs">Installing <a href="https://nodejs.org/">Node.js</a></h2>
|
||||||
|
|
||||||
|
<p>Node.js is an open-source, cross-platform, JavaScript runtime environment that executes JavaScript code outside of a browser.</p>
|
||||||
|
|
||||||
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nv">$ </span><span class="nb">sudo </span>apt-get <span class="nb">install install </span>nodejs
|
||||||
|
<span class="err">$</span>
|
||||||
|
<span class="nv">$ </span><span class="c"># check the version</span>
|
||||||
|
<span class="nv">$ </span>node <span class="nt">--version</span>
|
||||||
|
</code></pre></div></div>
|
||||||
|
|
||||||
|
<p><br /></p>
|
||||||
|
|
||||||
|
<h2 id="installing-yarn">Installing <a href="https://yarnpkg.com/">Yarn</a></h2>
|
||||||
|
|
||||||
|
<p>The yarn is an advanced package management software for Node.js applications. It is a fast, secure, and reliable alternative that any other Nodejs package manager.</p>
|
||||||
|
|
||||||
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nv">$ </span><span class="nb">sudo </span>npm <span class="nb">install </span>yarn <span class="nt">-g</span>
|
||||||
|
<span class="err">$</span>
|
||||||
|
<span class="nv">$ </span><span class="c"># check the version</span>
|
||||||
|
<span class="nv">$ </span>yarn <span class="nt">-v</span>
|
||||||
|
</code></pre></div></div>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
998
docs/1.0/getting-started/setup-windows-for-development.html
Normal file
@ -0,0 +1,998 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||||
|
<ul class="section-nav">
|
||||||
|
<li class="toc-entry toc-h1"><a href="#setup-windows-for-developers">Setup Windows for developers</a>
|
||||||
|
<ul>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#install-basic-development-tools">Install basic development tools</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#visual-studio-code">Visual Studio Code</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#install-python">Install Python</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#install-git">Install Git</a></li>
|
||||||
|
<li class="toc-entry toc-h2"><a href="#install-nodejs">Install Node.js</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">Setup Windows for Developers</h1>
|
||||||
|
<p class="bd-lead"></p>
|
||||||
|
<h1 id="setup-windows-for-developers">Setup <a href="https://www.microsoft.com/en-us/windows">Windows</a> for developers</h1>
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<p>Microsoft Windows, commonly referred to as Windows, is a group of several proprietary graphical operating system families, all of which are developed and marketed by Microsoft. Each family caters to a certain sector of the computing industry. Active Microsoft Windows families include Windows NT and Windows IoT; these may encompass subfamilies, e.g. Windows Server or Windows Embedded Compact (Windows CE). Defunct Microsoft Windows families include Windows 9x, Windows Mobile and Windows Phone.</p>
|
||||||
|
|
||||||
|
<p><br /></p>
|
||||||
|
|
||||||
|
<h2 id="install-basic-development-tools">Install basic development tools</h2>
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<p>This guide is written for Windows 10 version but can be used as a starting point for older versions of Windows.</p>
|
||||||
|
|
||||||
|
<p><br /></p>
|
||||||
|
|
||||||
|
<h2 id="visual-studio-code"><a href="https://code.visualstudio.com/">Visual Studio Code</a></h2>
|
||||||
|
|
||||||
|
<p>Visual Studio Code is a lightweight but powerful source code editor that runs on your desktop and is available for Windows, MacOS and Linux. It comes with built-in support for JavaScript, TypeScript and Node.js and has a rich ecosystem of extensions for other languages (such as C++, C#, Java, Python, PHP, Go) and runtimes (such as .NET and Unity).</p>
|
||||||
|
|
||||||
|
<p><strong>Links</strong>:</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li><a href="https://code.visualstudio.com/">Visual Studio Code</a> - the official page</li>
|
||||||
|
<li><a href="https://code.visualstudio.com/docs">Visual Studio Code</a> - documentation</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p><br /></p>
|
||||||
|
|
||||||
|
<h2 id="install-python">Install <a href="https://www.python.org">Python</a></h2>
|
||||||
|
|
||||||
|
<p>It is highly unlikely that your Windows system shipped with Python already installed. Fortunately, installing does not involve much more than downloading the Python installer from the python.org website and running it. Let’s take a look at how to install Python3 on Windows:</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>Access the <a href="https://www.python.org/downloads/windows/">download page</a></li>
|
||||||
|
<li>Click on the installer that matches your operating system version 32b or 64b</li>
|
||||||
|
<li>Run the installer and mark the option that includes Python executable to your PATH variable (image credit: RealPython )</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p><img src="https://files.realpython.com/media/win-install-dialog.40e3ded144b0.png" alt="Install Python - The Visual Installer Screen." /></p>
|
||||||
|
|
||||||
|
<p>If the installation goes well, test the Python execution from the terminal:</p>
|
||||||
|
|
||||||
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nv">$ </span>python <span class="nt">--version</span>
|
||||||
|
Python 3.7.2
|
||||||
|
</code></pre></div></div>
|
||||||
|
|
||||||
|
<p><br /></p>
|
||||||
|
|
||||||
|
<h2 id="install-git">Install <a href="https://git-scm.com/downloads">Git</a></h2>
|
||||||
|
|
||||||
|
<p>To install Git on Windows you will need to download the installer from the <a href="https://git-scm.com/downloads">Git</a> website:</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>Download the installer</li>
|
||||||
|
<li>Execute the installer, using the default options</li>
|
||||||
|
<li>Test the installation by typing <code class="highlighter-rouge">git</code></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nv">$ </span>git
|
||||||
|
usage: git <span class="o">[</span><span class="nt">--version</span><span class="o">]</span> <span class="o">[</span><span class="nt">--help</span><span class="o">]</span> <span class="o">[</span><span class="nt">-C</span> <path>] <span class="o">[</span><span class="nt">-c</span> <span class="nv">name</span><span class="o">=</span>value]
|
||||||
|
<span class="o">[</span><span class="nt">--exec-path</span><span class="o">[=</span><path>]] <span class="o">[</span><span class="nt">--html-path</span><span class="o">]</span> <span class="o">[</span><span class="nt">--man-path</span><span class="o">]</span> <span class="o">[</span><span class="nt">--info-path</span><span class="o">]</span>
|
||||||
|
<span class="o">[</span><span class="nt">-p</span> | <span class="nt">--paginate</span> | <span class="nt">--no-pager</span><span class="o">]</span> <span class="o">[</span><span class="nt">--no-replace-objects</span><span class="o">]</span> <span class="o">[</span><span class="nt">--bare</span><span class="o">]</span>
|
||||||
|
<span class="o">[</span><span class="nt">--git-dir</span><span class="o">=</span><path>] <span class="o">[</span><span class="nt">--work-tree</span><span class="o">=</span><path>] <span class="o">[</span><span class="nt">--namespace</span><span class="o">=</span><name>]
|
||||||
|
<<span class="nb">command</span><span class="o">></span> <span class="o">[</span><args>]
|
||||||
|
</code></pre></div></div>
|
||||||
|
|
||||||
|
<p>For more information about Git please access:</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li><a href="https://www.linode.com/docs/development/version-control/how-to-install-git-on-linux-mac-and-windows/">How to Install Git on Linux, Mac or Windows</a></li>
|
||||||
|
<li><a href="https://www.linode.com/docs/development/version-control/how-to-configure-git/">Getting Started with Git</a></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p><br /></p>
|
||||||
|
|
||||||
|
<h2 id="install-nodejs">Install <a href="https://nodejs.org/en/">Node.js</a></h2>
|
||||||
|
|
||||||
|
<p>Node.js is a run-time environment that includes everything you need to execute a program written in JavaScript. It’s used for running scripts on the server to render content before it is delivered to a web browser. NPM stands for Node Package Manager, which is an application and repository for developing and sharing JavaScript code.</p>
|
||||||
|
|
||||||
|
<p><strong>Download the installer</strong></p>
|
||||||
|
|
||||||
|
<p>In a web browser, navigate to https://nodejs.org/en/download/. Click the Windows Installer button to download the latest default version. At the time this article was written, version 10.16.0-x64 was the latest version. The Node.js installer includes the NPM package manager.</p>
|
||||||
|
|
||||||
|
<p><img src="https://raw.githubusercontent.com/app-generator/docs-creativetim/master/static/donwload-nodejs-installer-windows-1.png" alt="NodeJs Installer." /></p>
|
||||||
|
|
||||||
|
<p>Execute the installer, and choosing the default options should be enough to have a successfull installation:</p>
|
||||||
|
|
||||||
|
<div class="language-bash highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nv">$ </span>node <span class="nt">-v</span>
|
||||||
|
<span class="nv">$ </span>npm <span class="nt">-v</span>
|
||||||
|
</code></pre></div></div>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
1046
docs/1.0/plugins/bootstrap-notify.html
Normal file
994
docs/1.0/plugins/chart-js.html
Normal file
@ -0,0 +1,994 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="active bd-sidenav-active">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||||
|
<ul class="section-nav">
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">Chart.js v2.7.2</h1>
|
||||||
|
<p class="bd-lead"></p>
|
||||||
|
<p>Simple yet flexible JavaScript charting for designers & developers. Made by our friends from <a target="_blank" href="http://www.chartjs.org">Charts.js</a>. Please check the <a target="_blank" href="http://www.chartjs.org/docs/latest/"></a>full documentation</a>.</p>
|
||||||
|
|
||||||
|
<div class="bd-example" data-example-id="">
|
||||||
|
<!-- markup -->
|
||||||
|
<canvas id="lineChartExample"></canvas>
|
||||||
|
</div>
|
||||||
|
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- markup --></span>
|
||||||
|
<span class="nt"><canvas</span> <span class="na">id=</span><span class="s">"lineChartExample"</span><span class="nt">></canvas></span></code></pre></div>
|
||||||
|
|
||||||
|
<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- javascript init --></span>
|
||||||
|
// General configuration for the charts with Line gradientStroke
|
||||||
|
gradientChartOptionsConfiguration = {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
|
||||||
|
tooltips: {
|
||||||
|
backgroundColor: '#fff',
|
||||||
|
titleFontColor: '#333',
|
||||||
|
bodyFontColor: '#666',
|
||||||
|
bodySpacing: 4,
|
||||||
|
xPadding: 12,
|
||||||
|
mode: "nearest",
|
||||||
|
intersect: 0,
|
||||||
|
position: "nearest"
|
||||||
|
},
|
||||||
|
responsive: true,
|
||||||
|
scales:{
|
||||||
|
yAxes: [{
|
||||||
|
barPercentage: 1.6,
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(29,140,248,0.0)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
suggestedMin:50,
|
||||||
|
suggestedMax: 110,
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#9a9a9a"
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
|
||||||
|
xAxes: [{
|
||||||
|
barPercentage: 1.6,
|
||||||
|
gridLines: {
|
||||||
|
drawBorder: false,
|
||||||
|
color: 'rgba(220,53,69,0.1)',
|
||||||
|
zeroLineColor: "transparent",
|
||||||
|
},
|
||||||
|
ticks: {
|
||||||
|
padding: 20,
|
||||||
|
fontColor: "#9a9a9a"
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
var ctx = document.getElementById("lineChartExample").getContext("2d");
|
||||||
|
|
||||||
|
var gradientStroke = ctx.createLinearGradient(0,230,0,50);
|
||||||
|
|
||||||
|
gradientStroke.addColorStop(1, 'rgba(72,72,176,0.2)');
|
||||||
|
gradientStroke.addColorStop(0.2, 'rgba(72,72,176,0.0)');
|
||||||
|
gradientStroke.addColorStop(0, 'rgba(119,52,169,0)'); //purple colors
|
||||||
|
|
||||||
|
var data = {
|
||||||
|
labels: ['JAN','FEB','MAR','APR','MAY','JUN','JUL','AUG','SEP','OCT','NOV','DEC'],
|
||||||
|
datasets: [{
|
||||||
|
label: "Data",
|
||||||
|
fill: true,
|
||||||
|
backgroundColor: gradientStroke,
|
||||||
|
borderColor: '#d048b6',
|
||||||
|
borderWidth: 2,
|
||||||
|
borderDash: [],
|
||||||
|
borderDashOffset: 0.0,
|
||||||
|
pointBackgroundColor: '#d048b6',
|
||||||
|
pointBorderColor:'rgba(255,255,255,0)',
|
||||||
|
pointHoverBackgroundColor: '#d048b6',
|
||||||
|
pointBorderWidth: 20,
|
||||||
|
pointHoverRadius: 4,
|
||||||
|
pointHoverBorderWidth: 15,
|
||||||
|
pointRadius: 4,
|
||||||
|
data: [ 60,110,70,100, 75, 90, 80, 100, 70, 80, 120, 80],
|
||||||
|
}]
|
||||||
|
};
|
||||||
|
|
||||||
|
var myChart = new Chart(ctx, {
|
||||||
|
type: 'line',
|
||||||
|
data: data,
|
||||||
|
options: gradientChartOptionsConfiguration
|
||||||
|
});</code></pre></figure>
|
||||||
|
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
934
docs/1.0/plugins/datetimepicker.html
Normal file
@ -0,0 +1,934 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||||
|
<ul class="section-nav">
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">DateTimePicker v4.17.47</h1>
|
||||||
|
<p class="bd-lead"></p>
|
||||||
|
<p>We have created the design of the date-time picker made by <strong><a href="https://github.com/Eonasdan" target="_blank">Eonasdan</a></strong>. We have changed the colors, typography and buttons, so it can look like the rest of the dashboard.</p>
|
||||||
|
|
||||||
|
<p>For more information please check <strong><a href="https://eonasdan.github.io/bootstrap-datetimepicker/" target="_blank">Full Github Documentation</a></strong>.</p>
|
||||||
|
|
||||||
|
<p>Here is a coded example:</p>
|
||||||
|
|
||||||
|
<div class="bd-example" data-example-id="">
|
||||||
|
<!-- input with datetimepicker -->
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="label-control">Datetime Picker</label>
|
||||||
|
<input type="text" class="form-control datetimepicker" value="10/05/2018" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- input with datetimepicker --></span>
|
||||||
|
<span class="nt"><div</span> <span class="na">class=</span><span class="s">"form-group"</span><span class="nt">></span>
|
||||||
|
<span class="nt"><label</span> <span class="na">class=</span><span class="s">"label-control"</span><span class="nt">></span>Datetime Picker<span class="nt"></label></span>
|
||||||
|
<span class="nt"><input</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">class=</span><span class="s">"form-control datetimepicker"</span> <span class="na">value=</span><span class="s">"10/05/2018"</span><span class="nt">/></span>
|
||||||
|
<span class="nt"></div></span></code></pre></div>
|
||||||
|
|
||||||
|
<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- javascript for init --></span>
|
||||||
|
$('.datetimepicker').datetimepicker({
|
||||||
|
icons: {
|
||||||
|
time: "tim-icons icon-watch-time",
|
||||||
|
date: "tim-icons icon-calendar-60",
|
||||||
|
up: "fa fa-chevron-up",
|
||||||
|
down: "fa fa-chevron-down",
|
||||||
|
previous: 'tim-icons icon-minimal-left',
|
||||||
|
next: 'tim-icons icon-minimal-right',
|
||||||
|
today: 'fa fa-screenshot',
|
||||||
|
clear: 'fa fa-trash',
|
||||||
|
close: 'fa fa-remove'
|
||||||
|
}
|
||||||
|
});</code></pre></figure>
|
||||||
|
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
915
docs/1.0/plugins/perfect-scrollbar.html
Normal file
@ -0,0 +1,915 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="active bd-sidenav-active">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||||
|
<ul class="section-nav">
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">Perfect Scrollbar v1.4.0</h1>
|
||||||
|
<p class="bd-lead"></p>
|
||||||
|
<p>“Minimalistic but perfect custom scrollbar plugin.”</p>
|
||||||
|
|
||||||
|
<p>!IMPORTANT Perfect Scrollbar is applied on the <code class="highlighter-rouge">.main-panel</code> and <code class="highlighter-rouge">.sidebar .sidebar-wrapper</code> so we will have a nice scrollbar that is visible only when you actually scroll. Since it is changing the overflows of the CSS it is also affecting the child elements which have a scroll so please make sure that you add the class <code class="highlighter-rouge">.ps-child</code> to any element that should have scroll.</p>
|
||||||
|
|
||||||
|
<p>For more information please check <strong><a href="https://github.com/utatti/perfect-scrollbar" target="_blank">Full Github Documentation</a></strong>.</p>
|
||||||
|
|
||||||
|
<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- javascript for activating the Perfect Scrollbar --></span>
|
||||||
|
$('.sidebar .sidebar-wrapper, .main-panel').perfectScrollbar();
|
||||||
|
|
||||||
|
<span class="c"><!-- javascript for detroying the Perfect Scrollbar --></span>
|
||||||
|
$('.main-panel').perfectScrollbar('destroy');
|
||||||
|
|
||||||
|
<span class="c"><!-- javascript for updating the Perfect Scrollbar when the content of the page is changing --></span>
|
||||||
|
$('.main-panel').perfectScrollbar('update');</code></pre></figure>
|
||||||
|
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
913
docs/1.0/plugins/sweet-alert-2.html
Normal file
@ -0,0 +1,913 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" sizes="76x76" href="../../../assets/img/dashboard/free/apple-icon.png">
|
||||||
|
<link rel="icon" type="image/png" href="../../../assets/img/dashboard/free/favicon.png">
|
||||||
|
|
||||||
|
<title>
|
||||||
|
|
||||||
|
Black Dashboard Flask by Creative Tim
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</title>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Fonts and icons -->
|
||||||
|
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||||||
|
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<!-- Nucleo Icons -->
|
||||||
|
<link href="../../../assets/css/nucleo-icons.css" rel="stylesheet" />
|
||||||
|
<!-- CSS Files -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<link href="../../../assets/css/dashboard-free.css?v=1.0.0" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Documentation extras -->
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../../../assets/demo/docs.min.css">
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.navbar-absolute-logo{
|
||||||
|
padding-left: 45px;
|
||||||
|
}
|
||||||
|
.navbar-absolute-logo img{
|
||||||
|
position: absolute;
|
||||||
|
left: 15px;
|
||||||
|
margin-top: -6px;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||||||
|
<link href="../../../assets/demo/dashboard/free/demo.css" rel="stylesheet" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body class="bd-docs" data-spy="scroll" data-target=".bd-sidenav-active">
|
||||||
|
|
||||||
|
|
||||||
|
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
|
||||||
|
<div class="container">
|
||||||
|
<span class="skiplink-text">Skip to main content</span>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<header class="navbar navbar-expand bg-primary flex-column flex-md-row bd-navbar">
|
||||||
|
<a class="navbar-brand mr-0 mr-md-2 navbar-absolute-logo" href="https://www.creative-tim.com/product/black-dashboard-flask" target="_blank">
|
||||||
|
Black Dashboard Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="navbar-nav flex-row d-none d-md-flex">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="#version">
|
||||||
|
1.0.0
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- <li class="nav-item dropdown">
|
||||||
|
<a class="nav-item nav-link dropdown-toggle mr-md-2" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
v2.0.0
|
||||||
|
</a>
|
||||||
|
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
|
||||||
|
<a class="dropdown-item active" href="/docs/1.0/">BS4 - 1.0.0</a>
|
||||||
|
<a class="dropdown-item" href="">BS3 - 1.2.1</a>
|
||||||
|
</div>
|
||||||
|
</li> -->
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener" aria-label="GitHub">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 499.36" focusable="false"><title>GitHub</title><path d="M256 0C114.64 0 0 114.61 0 256c0 113.09 73.34 209 175.08 242.9 12.8 2.35 17.47-5.56 17.47-12.34 0-6.08-.22-22.18-.35-43.54-71.2 15.49-86.2-34.34-86.2-34.34-11.64-29.57-28.42-37.45-28.42-37.45-23.27-15.84 1.73-15.55 1.73-15.55 25.69 1.81 39.21 26.38 39.21 26.38 22.84 39.12 59.92 27.82 74.5 21.27 2.33-16.54 8.94-27.82 16.25-34.22-56.84-6.43-116.6-28.43-116.6-126.49 0-27.95 10-50.8 26.35-68.69-2.63-6.48-11.42-32.5 2.51-67.75 0 0 21.49-6.88 70.4 26.24a242.65 242.65 0 0 1 128.18 0c48.87-33.13 70.33-26.24 70.33-26.24 14 35.25 5.18 61.27 2.55 67.75 16.41 17.9 26.31 40.75 26.31 68.69 0 98.35-59.85 120-116.88 126.32 9.19 7.9 17.38 23.53 17.38 47.41 0 34.22-.31 61.83-.31 70.23 0 6.85 4.61 14.81 17.6 12.31C438.72 464.97 512 369.08 512 256.02 512 114.62 397.37 0 256 0z" fill="currentColor" fill-rule="evenodd"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link p-2" href="https://twitter.com/CreativeTim" target="_blank" rel="noopener" aria-label="Twitter">
|
||||||
|
<svg class="navbar-nav-svg" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 416.32" focusable="false"><title>Twitter</title><path d="M160.83 416.32c193.2 0 298.92-160.22 298.92-298.92 0-4.51 0-9-.2-13.52A214 214 0 0 0 512 49.38a212.93 212.93 0 0 1-60.44 16.6 105.7 105.7 0 0 0 46.3-58.19 209 209 0 0 1-66.79 25.37 105.09 105.09 0 0 0-181.73 71.91 116.12 116.12 0 0 0 2.66 24c-87.28-4.3-164.73-46.3-216.56-109.82A105.48 105.48 0 0 0 68 159.6a106.27 106.27 0 0 1-47.53-13.11v1.43a105.28 105.28 0 0 0 84.21 103.06 105.67 105.67 0 0 1-47.33 1.84 105.06 105.06 0 0 0 98.14 72.94A210.72 210.72 0 0 1 25 370.84a202.17 202.17 0 0 1-25-1.43 298.85 298.85 0 0 0 160.83 46.92" fill="currentColor"/></svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="navbar-nav-scroll ml-md-auto ">
|
||||||
|
<ul class="navbar-nav bd-navbar-nav flex-row">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a target="_blank" href="javascript:void(0)" rel="nofollow" class="btn btn-round btn-default disabled"><i class="tim-icons icon-send mr-2"></i>Upgrade to PRO</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link active" href="../../../docs/1.0/getting-started/introduction.html"><i class="tim-icons icon-app"></i> Documentation</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://www.creative-tim.com/live/black-dashboard-flask"><i class="tim-icons icon-tv-2"></i> Live Preview</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/creativetimofficial/black-dashboard-flask" target="_blank" rel="noopener"><i class="tim-icons icon-shape-star"></i> Help with a star</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="" target="_blank" rel="noopener"></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<a href="https://github.com/creativetimofficial/black-dashboard-flask" class="github-corner" aria-label="View source on Github"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; color:#9c27b0; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
|
||||||
|
|
||||||
|
<!-- <a class="btn btn-white d-none d-lg-inline-block" href="">Download</a> -->
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row flex-xl-nowrap">
|
||||||
|
<div class="col-12 col-md-3 col-xl-2 bd-sidebar">
|
||||||
|
<nav class="collapse bd-links" id="bd-docs-nav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Getting started
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/getting-started-flask.html">
|
||||||
|
Getting Started Flask
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/getting-started/license.html">
|
||||||
|
License
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Foundation
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/foundation/colors.html">
|
||||||
|
Colors
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Components
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/alerts.html">
|
||||||
|
Alerts
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/badge.html">
|
||||||
|
Badge
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/breadcrumb.html">
|
||||||
|
Breadcrumb
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/buttons.html">
|
||||||
|
Buttons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/card.html">
|
||||||
|
Card
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/collapse.html">
|
||||||
|
Collapse
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/dropdowns.html">
|
||||||
|
Dropdowns
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/forms.html">
|
||||||
|
Forms
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/google-maps.html">
|
||||||
|
Google Maps
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/modal.html">
|
||||||
|
Modal
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navs.html">
|
||||||
|
Navs
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/navbar.html">
|
||||||
|
Navbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/nucleo-icons.html">
|
||||||
|
Nucleo Icons
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/components/tables.html">
|
||||||
|
Tables
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="bd-toc-item active">
|
||||||
|
<a class="bd-toc-link" href="#docs">
|
||||||
|
Plugins
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<ul class="nav bd-sidenav">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/perfect-scrollbar.html">
|
||||||
|
Perfect Scrollbar
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<li class="">
|
||||||
|
|
||||||
|
<a href="../../../docs/1.0/plugins/chart-js.html">
|
||||||
|
Chart.js
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="d-none d-xl-block col-xl-2 bd-toc">
|
||||||
|
<ul class="section-nav">
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
|
||||||
|
<h1 class="bd-title" id="content">Sweet Alert 2</h1>
|
||||||
|
<p class="bd-lead"></p>
|
||||||
|
<p>If you want to replace the classic alert box with something that looks amazing, you can use the Sweet Alert 2 Plugin. We have changed the typography and colors for the plugin provided by <a href="https://twitter.com/t4t5">Tristan Edwards</a>.</p>
|
||||||
|
|
||||||
|
<p>For more information please check <strong><a href="https://sweetalert2.github.io/" target="_blank">Full Documentation</a></strong></p>
|
||||||
|
|
||||||
|
<div class="bd-example" data-example-id="">
|
||||||
|
<!-- markup -->
|
||||||
|
<button class="btn btn-primary btn-fill" onclick="swal({ title:"Good job!", text: "You clicked the button!", type: "success", buttonsStyling: false, confirmButtonClass: "btn btn-success"})">Try me!</button>
|
||||||
|
<!-- for more actions that you can use onclick, please check out assets/assets-for-demo/js/demo.js -->
|
||||||
|
</div>
|
||||||
|
<div class="highlight"><pre><code class="language-html" data-lang="html"><span class="c"><!-- markup --></span>
|
||||||
|
<span class="nt"><button</span> <span class="na">class=</span><span class="s">"btn btn-primary btn-fill"</span> <span class="na">onclick=</span><span class="s">'swal({ title:"Good job!", text: "You clicked the button!", type: "success", buttonsStyling: false, confirmButtonClass: "btn btn-success"})'</span><span class="nt">></span>Try me!<span class="nt"></button></span>
|
||||||
|
<span class="c"><!-- for more actions that you can use onclick, please check out assets/assets-for-demo/js/demo.js --></span></code></pre></div>
|
||||||
|
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Core JS Files -->
|
||||||
|
<script src="../../../assets/js/core/jquery.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/popper.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/core/bootstrap.min.js" ></script>
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/perfect-scrollbar.jquery.min.js" ></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Google Maps Plugin -->
|
||||||
|
|
||||||
|
<!-- Place this tag in your head or just before your close body tag. -->
|
||||||
|
|
||||||
|
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Chart JS -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/chartjs.min.js"></script>
|
||||||
|
|
||||||
|
<!-- Notifications Plugin -->
|
||||||
|
<script src="../../../assets/js/plugins/dashboard/free/bootstrap-notify.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Control Center for Black Dashboard: parallax effects, scripts for the example pages etc --><script src="../../../assets/js/dashboard-free.js?v=1.0.0"></script><!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||||||
|
<script src="../../../assets/demo/dashboard/free/demo.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
$().ready(function(){
|
||||||
|
$sidebar = $('.sidebar');
|
||||||
|
$navbar = $('.navbar');
|
||||||
|
$main_panel = $('.main-panel');
|
||||||
|
|
||||||
|
$full_page = $('.full-page');
|
||||||
|
|
||||||
|
$sidebar_responsive = $('body > .navbar-collapse');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
white_color = false;
|
||||||
|
|
||||||
|
window_width = $(window).width();
|
||||||
|
|
||||||
|
fixed_plugin_open = $('.sidebar .sidebar-wrapper .nav li.active a p').html();
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$('.fixed-plugin a').click(function(event){
|
||||||
|
if($(this).hasClass('switch-trigger')){
|
||||||
|
if(event.stopPropagation){
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
else if(window.event){
|
||||||
|
window.event.cancelBubble = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.fixed-plugin .background-color span').click(function(){
|
||||||
|
$(this).siblings().removeClass('active');
|
||||||
|
$(this).addClass('active');
|
||||||
|
|
||||||
|
var new_color = $(this).data('color');
|
||||||
|
|
||||||
|
if($sidebar.length != 0){
|
||||||
|
$sidebar.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($main_panel.length != 0){
|
||||||
|
$main_panel.attr('data',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($full_page.length != 0){
|
||||||
|
$full_page.attr('filter-color',new_color);
|
||||||
|
}
|
||||||
|
|
||||||
|
if($sidebar_responsive.length != 0){
|
||||||
|
$sidebar_responsive.attr('data',new_color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-sidebar-mini input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(sidebar_mini_active == true){
|
||||||
|
$('body').removeClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = false;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini deactivated...');
|
||||||
|
}else{
|
||||||
|
$('body').addClass('sidebar-mini');
|
||||||
|
sidebar_mini_active = true;
|
||||||
|
blackDashboard.showSidebarMessage('Sidebar mini activated...');
|
||||||
|
}
|
||||||
|
|
||||||
|
// we simulate the window Resize so the charts will get updated in realtime.
|
||||||
|
var simulateWindowResize = setInterval(function(){
|
||||||
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
},180);
|
||||||
|
|
||||||
|
// we stop the simulation of Window Resize after the animations are completed
|
||||||
|
setTimeout(function(){
|
||||||
|
clearInterval(simulateWindowResize);
|
||||||
|
},1000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.switch-change-color input').on("switchChange.bootstrapSwitch", function(){
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
if(white_color == true){
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').removeClass('white-content'); }, 900);
|
||||||
|
white_color = false;
|
||||||
|
}else{
|
||||||
|
|
||||||
|
$('body').addClass('change-background');
|
||||||
|
setTimeout(function(){ $('body').removeClass('change-background');
|
||||||
|
$('body').addClass('white-content');}, 900);
|
||||||
|
|
||||||
|
white_color = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.light-badge').click(function(){
|
||||||
|
$('body').addClass('white-content');
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.dark-badge').click(function(){
|
||||||
|
$('body').removeClass('white-content');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../assets/demo/docs.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/anchor.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/clipboard.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/vendor/holder.min.js"></script>
|
||||||
|
<script src="../../../assets/demo/src/application.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
if($('#lineChartExample').length != 0){
|
||||||
|
demo.initDocChart();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
Holder.addTheme('gray', {
|
||||||
|
bg: '#777',
|
||||||
|
fg: 'rgba(255,255,255,.75)',
|
||||||
|
font: 'Helvetica',
|
||||||
|
fontweight: 'normal'
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script><script>
|
||||||
|
window.TrackJS &&
|
||||||
|
TrackJS.install({
|
||||||
|
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||||||
|
application: "black-dashboard-free"
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||