add: React Bootstrap Framework & Argon Dashboard 2

styles/argon-dashboard-2.0.4/assets/js/argon-dashboard.js

@@ -0,0 +1,754 @@
+"use strict";
+(function() {
+  var isWindows = navigator.platform.indexOf('Win') > -1 ? true : false;
+
+  if (isWindows) {
+    // if we are on windows OS we activate the perfectScrollbar function
+    if (document.getElementsByClassName('main-content')[0]) {
+      var mainpanel = document.querySelector('.main-content');
+      var ps = new PerfectScrollbar(mainpanel);
+    };
+
+    if (document.getElementsByClassName('sidenav')[0]) {
+      var sidebar = document.querySelector('.sidenav');
+      var ps1 = new PerfectScrollbar(sidebar);
+    };
+
+    if (document.getElementsByClassName('navbar-collapse')[0]) {
+      var fixedplugin = document.querySelector('.navbar:not(.navbar-expand-lg) .navbar-collapse');
+      var ps2 = new PerfectScrollbar(fixedplugin);
+    };
+
+    if (document.getElementsByClassName('fixed-plugin')[0]) {
+      var fixedplugin = document.querySelector('.fixed-plugin');
+      var ps3 = new PerfectScrollbar(fixedplugin);
+    };
+  };
+})();
+
+// Verify navbar blur on scroll
+if (document.getElementById('navbarBlur')) {
+  navbarBlurOnScroll('navbarBlur');
+}
+
+// initialization of Tooltips
+var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
+var tooltipList = tooltipTriggerList.map(function(tooltipTriggerEl) {
+  return new bootstrap.Tooltip(tooltipTriggerEl)
+})
+
+
+// when input is focused add focused class for style
+function focused(el) {
+  if (el.parentElement.classList.contains('input-group')) {
+    el.parentElement.classList.add('focused');
+  }
+}
+
+// when input is focused remove focused class for style
+function defocused(el) {
+  if (el.parentElement.classList.contains('input-group')) {
+    el.parentElement.classList.remove('focused');
+  }
+}
+
+// helper for adding on all elements multiple attributes
+function setAttributes(el, options) {
+  Object.keys(options).forEach(function(attr) {
+    el.setAttribute(attr, options[attr]);
+  })
+}
+
+// adding on inputs attributes for calling the focused and defocused functions
+if (document.querySelectorAll('.input-group').length != 0) {
+  var allInputs = document.querySelectorAll('input.form-control');
+  allInputs.forEach(el => setAttributes(el, {
+    "onfocus": "focused(this)",
+    "onfocusout": "defocused(this)"
+  }));
+}
+
+// Fixed Plugin
+if (document.querySelector('.fixed-plugin')) {
+  var fixedPlugin = document.querySelector('.fixed-plugin');
+  var fixedPluginButton = document.querySelector('.fixed-plugin-button');
+  var fixedPluginButtonNav = document.querySelector('.fixed-plugin-button-nav');
+  var fixedPluginCard = document.querySelector('.fixed-plugin .card');
+  var fixedPluginCloseButton = document.querySelectorAll('.fixed-plugin-close-button');
+  var navbar = document.getElementById('navbarBlur');
+  var buttonNavbarFixed = document.getElementById('navbarFixed');
+
+  if (fixedPluginButton) {
+    fixedPluginButton.onclick = function() {
+      if (!fixedPlugin.classList.contains('show')) {
+        fixedPlugin.classList.add('show');
+      } else {
+        fixedPlugin.classList.remove('show');
+      }
+    }
+  }
+
+  if (fixedPluginButtonNav) {
+    fixedPluginButtonNav.onclick = function() {
+      if (!fixedPlugin.classList.contains('show')) {
+        fixedPlugin.classList.add('show');
+      } else {
+        fixedPlugin.classList.remove('show');
+      }
+    }
+  }
+
+  fixedPluginCloseButton.forEach(function(el) {
+    el.onclick = function() {
+      fixedPlugin.classList.remove('show');
+    }
+  })
+
+  document.querySelector('body').onclick = function(e) {
+    if (e.target != fixedPluginButton && e.target != fixedPluginButtonNav && e.target.closest('.fixed-plugin .card') != fixedPluginCard) {
+      fixedPlugin.classList.remove('show');
+    }
+  }
+
+  if (navbar) {
+    if (navbar.getAttribute('data-scroll') == 'true' && buttonNavbarFixed) {
+      buttonNavbarFixed.setAttribute("checked", "true");
+    }
+  }
+
+}
+
+//Set Sidebar Color
+function sidebarColor(a) {
+  var parent = a.parentElement.children;
+  var color = a.getAttribute("data-color");
+
+  for (var i = 0; i < parent.length; i++) {
+    parent[i].classList.remove('active');
+  }
+
+  if (!a.classList.contains('active')) {
+    a.classList.add('active');
+  } else {
+    a.classList.remove('active');
+  }
+
+  var sidebar = document.querySelector('.sidenav');
+  sidebar.setAttribute("data-color", color);
+
+  if (document.querySelector('#sidenavCard')) {
+    var sidenavCard = document.querySelector('#sidenavCard+.btn+.btn');
+    let sidenavCardClasses = ['btn', 'btn-sm', 'w-100', 'mb-0', 'bg-gradient-' + color];
+    sidenavCard.removeAttribute('class');
+    sidenavCard.classList.add(...sidenavCardClasses);
+  }
+}
+
+// Set Sidebar Type
+function sidebarType(a) {
+  var parent = a.parentElement.children;
+  var color = a.getAttribute("data-class");
+  var body = document.querySelector("body");
+  var bodyWhite = document.querySelector("body:not(.dark-version)");
+  var bodyDark = body.classList.contains('dark-version');
+
+  var colors = [];
+
+  for (var i = 0; i < parent.length; i++) {
+    parent[i].classList.remove('active');
+    colors.push(parent[i].getAttribute('data-class'));
+  }
+
+  if (!a.classList.contains('active')) {
+    a.classList.add('active');
+  } else {
+    a.classList.remove('active');
+  }
+
+  var sidebar = document.querySelector('.sidenav');
+
+  for (var i = 0; i < colors.length; i++) {
+    sidebar.classList.remove(colors[i]);
+  }
+
+  sidebar.classList.add(color);
+
+
+  // Remove text-white/text-dark classes
+  if (color == 'bg-white') {
+    var textWhites = document.querySelectorAll('.sidenav .text-white');
+    for (let i = 0; i < textWhites.length; i++) {
+      textWhites[i].classList.remove('text-white');
+      textWhites[i].classList.add('text-dark');
+    }
+  } else {
+    var textDarks = document.querySelectorAll('.sidenav .text-dark');
+    for (let i = 0; i < textDarks.length; i++) {
+      textDarks[i].classList.add('text-white');
+      textDarks[i].classList.remove('text-dark');
+    }
+  }
+
+  if (color == 'bg-default' && bodyDark) {
+    var textDarks = document.querySelectorAll('.navbar-brand .text-dark');
+    for (let i = 0; i < textDarks.length; i++) {
+      textDarks[i].classList.add('text-white');
+      textDarks[i].classList.remove('text-dark');
+    }
+  }
+
+  // Remove logo-white/logo-dark
+
+  if ((color == 'bg-white') && bodyWhite) {
+    var navbarBrand = document.querySelector('.navbar-brand-img');
+    var navbarBrandImg = navbarBrand.src;
+
+    if (navbarBrandImg.includes('logo-ct.png')) {
+      var navbarBrandImgNew = navbarBrandImg.replace("logo-ct", "logo-ct-dark");
+      navbarBrand.src = navbarBrandImgNew;
+    }
+  } else {
+    var navbarBrand = document.querySelector('.navbar-brand-img');
+    var navbarBrandImg = navbarBrand.src;
+    if (navbarBrandImg.includes('logo-ct-dark.png')) {
+      var navbarBrandImgNew = navbarBrandImg.replace("logo-ct-dark", "logo-ct");
+      navbarBrand.src = navbarBrandImgNew;
+    }
+  }
+
+  if (color == 'bg-white' && bodyDark) {
+    var navbarBrand = document.querySelector('.navbar-brand-img');
+    var navbarBrandImg = navbarBrand.src;
+
+    if (navbarBrandImg.includes('logo-ct.png')) {
+      var navbarBrandImgNew = navbarBrandImg.replace("logo-ct", "logo-ct-dark");
+      navbarBrand.src = navbarBrandImgNew;
+    }
+  }
+}
+
+// Set Navbar Fixed
+function navbarFixed(el) {
+  let classes = ['position-sticky', 'bg-white', 'left-auto', 'top-2', 'z-index-sticky'];
+  const navbar = document.getElementById('navbarBlur');
+
+  if (!el.getAttribute("checked")) {
+    toggleNavLinksColor('blur');
+    navbar.classList.add(...classes);
+    navbar.setAttribute('data-scroll', 'true');
+    navbarBlurOnScroll('navbarBlur');
+    el.setAttribute("checked", "true");
+  } else {
+    toggleNavLinksColor('transparent');
+    navbar.classList.remove(...classes);
+    navbar.setAttribute('data-scroll', 'false');
+    navbarBlurOnScroll('navbarBlur');
+    el.removeAttribute("checked");
+  }
+};
+
+// Set Navbar Minimized
+function navbarMinimize(el) {
+  var sidenavShow = document.getElementsByClassName('g-sidenav-show')[0];
+
+  if (!el.getAttribute("checked")) {
+    sidenavShow.classList.remove('g-sidenav-pinned');
+    sidenavShow.classList.add('g-sidenav-hidden');
+    el.setAttribute("checked", "true");
+  } else {
+    sidenavShow.classList.remove('g-sidenav-hidden');
+    sidenavShow.classList.add('g-sidenav-pinned');
+    el.removeAttribute("checked");
+  }
+}
+
+function toggleNavLinksColor(type) {
+  let navLinks = document.querySelectorAll('.navbar-main .nav-link, .navbar-main .breadcrumb-item, .navbar-main .breadcrumb-item a, .navbar-main h6')
+  let navLinksToggler = document.querySelectorAll('.navbar-main .sidenav-toggler-line')
+
+  if (type === "blur") {
+    navLinks.forEach(element => {
+      element.classList.remove('text-white')
+    });
+
+    navLinksToggler.forEach(element => {
+      element.classList.add('bg-dark')
+      element.classList.remove('bg-white')
+    });
+  } else if (type === "transparent") {
+    navLinks.forEach(element => {
+      element.classList.add('text-white')
+    });
+
+    navLinksToggler.forEach(element => {
+      element.classList.remove('bg-dark')
+      element.classList.add('bg-white')
+    });
+  }
+}
+
+
+// Navbar blur on scroll
+function navbarBlurOnScroll(id) {
+  const navbar = document.getElementById(id);
+  let navbarScrollActive = navbar ? navbar.getAttribute("data-scroll") : false;
+  let scrollDistance = 5;
+  let classes = ['bg-white', 'left-auto', 'position-sticky'];
+  let toggleClasses = ['shadow-none'];
+
+  if (navbarScrollActive == 'true') {
+    window.onscroll = debounce(function() {
+      if (window.scrollY > scrollDistance) {
+        blurNavbar();
+      } else {
+        transparentNavbar();
+      }
+    }, 10);
+  } else {
+    window.onscroll = debounce(function() {
+      transparentNavbar();
+    }, 10);
+  }
+
+  var isWindows = navigator.platform.indexOf('Win') > -1 ? true : false;
+
+  if (isWindows) {
+    var content = document.querySelector('.main-content');
+    if (navbarScrollActive == 'true') {
+      content.addEventListener('ps-scroll-y', debounce(function() {
+        if (content.scrollTop > scrollDistance) {
+          blurNavbar();
+        } else {
+          transparentNavbar();
+        }
+      }, 10));
+    } else {
+      content.addEventListener('ps-scroll-y', debounce(function() {
+        transparentNavbar();
+      }, 10));
+    }
+  }
+
+  function blurNavbar() {
+    navbar.classList.add(...classes)
+    navbar.classList.remove(...toggleClasses)
+
+    toggleNavLinksColor('blur');
+  }
+
+  function transparentNavbar() {
+    navbar.classList.remove(...classes)
+    navbar.classList.add(...toggleClasses)
+
+    toggleNavLinksColor('transparent');
+  }
+}
+
+
+// Debounce Function
+// Returns a function, that, as long as it continues to be invoked, will not
+// be triggered. The function will be called after it stops being called for
+// N milliseconds. If `immediate` is passed, trigger the function on the
+// leading edge, instead of the trailing.
+function debounce(func, wait, immediate) {
+  var timeout;
+  return function() {
+    var context = this,
+      args = arguments;
+    var later = function() {
+      timeout = null;
+      if (!immediate) func.apply(context, args);
+    };
+    var callNow = immediate && !timeout;
+    clearTimeout(timeout);
+    timeout = setTimeout(later, wait);
+    if (callNow) func.apply(context, args);
+  };
+};
+
+// Toggle Sidenav
+const iconNavbarSidenav = document.getElementById('iconNavbarSidenav');
+const iconSidenav = document.getElementById('iconSidenav');
+const sidenav = document.getElementById('sidenav-main');
+let body = document.getElementsByTagName('body')[0];
+let className = 'g-sidenav-pinned';
+
+if (iconNavbarSidenav) {
+  iconNavbarSidenav.addEventListener("click", toggleSidenav);
+}
+
+if (iconSidenav) {
+  iconSidenav.addEventListener("click", toggleSidenav);
+}
+
+function toggleSidenav() {
+  if (body.classList.contains(className)) {
+    body.classList.remove(className);
+    setTimeout(function() {
+      sidenav.classList.remove('bg-white');
+    }, 100);
+    sidenav.classList.remove('bg-transparent');
+
+  } else {
+    body.classList.add(className);
+    sidenav.classList.add('bg-white');
+    sidenav.classList.remove('bg-transparent');
+    iconSidenav.classList.remove('d-none');
+  }
+}
+
+let html = document.getElementsByTagName('html')[0];
+
+html.addEventListener("click", function(e) {
+  if (body.classList.contains('g-sidenav-pinned') && !e.target.classList.contains('sidenav-toggler-line')) {
+    body.classList.remove(className);
+  }
+});
+
+// Resize navbar color depends on configurator active type of sidenav
+
+let referenceButtons = document.querySelector('[data-class]');
+
+window.addEventListener("resize", navbarColorOnResize);
+
+function navbarColorOnResize() {
+  if (window.innerWidth > 1200) {
+    if (referenceButtons.classList.contains('active') && referenceButtons.getAttribute('data-class') === 'bg-transparent') {
+      sidenav.classList.remove('bg-white');
+    } else {
+      if (!body.classList.contains('dark-version')) {
+        sidenav.classList.add('bg-white');
+      }
+    }
+  } else {
+    sidenav.classList.add('bg-white');
+    sidenav.classList.remove('bg-transparent');
+  }
+}
+
+// Deactivate sidenav type buttons on resize and small screens
+window.addEventListener("resize", sidenavTypeOnResize);
+window.addEventListener("load", sidenavTypeOnResize);
+
+function sidenavTypeOnResize() {
+  let elements = document.querySelectorAll('[onclick="sidebarType(this)"]');
+  if (window.innerWidth < 1200) {
+    elements.forEach(function(el) {
+      el.classList.add('disabled');
+    });
+  } else {
+    elements.forEach(function(el) {
+      el.classList.remove('disabled');
+    });
+  }
+}
+
+
+// Tabs navigation
+
+var total = document.querySelectorAll('.nav-pills');
+
+total.forEach(function(item, i) {
+  var moving_div = document.createElement('div');
+  var first_li = item.querySelector('li:first-child .nav-link');
+  var tab = first_li.cloneNode();
+  tab.innerHTML = "-";
+
+  moving_div.classList.add('moving-tab', 'position-absolute', 'nav-link');
+  moving_div.appendChild(tab);
+  item.appendChild(moving_div);
+
+  var list_length = item.getElementsByTagName("li").length;
+
+  moving_div.style.padding = '0px';
+  moving_div.style.width = item.querySelector('li:nth-child(1)').offsetWidth + 'px';
+  moving_div.style.transform = 'translate3d(0px, 0px, 0px)';
+  moving_div.style.transition = '.5s ease';
+
+  item.onmouseover = function(event) {
+    let target = getEventTarget(event);
+    let li = target.closest('li'); // get reference
+    if (li) {
+      let nodes = Array.from(li.closest('ul').children); // get array
+      let index = nodes.indexOf(li) + 1;
+      item.querySelector('li:nth-child(' + index + ') .nav-link').onclick = function() {
+        moving_div = item.querySelector('.moving-tab');
+        let sum = 0;
+        if (item.classList.contains('flex-column')) {
+          for (var j = 1; j <= nodes.indexOf(li); j++) {
+            sum += item.querySelector('li:nth-child(' + j + ')').offsetHeight;
+          }
+          moving_div.style.transform = 'translate3d(0px,' + sum + 'px, 0px)';
+          moving_div.style.height = item.querySelector('li:nth-child(' + j + ')').offsetHeight;
+        } else {
+          for (var j = 1; j <= nodes.indexOf(li); j++) {
+            sum += item.querySelector('li:nth-child(' + j + ')').offsetWidth;
+          }
+          moving_div.style.transform = 'translate3d(' + sum + 'px, 0px, 0px)';
+          moving_div.style.width = item.querySelector('li:nth-child(' + index + ')').offsetWidth + 'px';
+        }
+      }
+    }
+  }
+});
+
+
+// Tabs navigation resize
+
+window.addEventListener('resize', function(event) {
+  total.forEach(function(item, i) {
+    item.querySelector('.moving-tab').remove();
+    var moving_div = document.createElement('div');
+    var tab = item.querySelector(".nav-link.active").cloneNode();
+    tab.innerHTML = "-";
+
+    moving_div.classList.add('moving-tab', 'position-absolute', 'nav-link');
+    moving_div.appendChild(tab);
+
+    item.appendChild(moving_div);
+
+    moving_div.style.padding = '0px';
+    moving_div.style.transition = '.5s ease';
+
+    let li = item.querySelector(".nav-link.active").parentElement;
+
+    if (li) {
+      let nodes = Array.from(li.closest('ul').children); // get array
+      let index = nodes.indexOf(li) + 1;
+
+      let sum = 0;
+      if (item.classList.contains('flex-column')) {
+        for (var j = 1; j <= nodes.indexOf(li); j++) {
+          sum += item.querySelector('li:nth-child(' + j + ')').offsetHeight;
+        }
+        moving_div.style.transform = 'translate3d(0px,' + sum + 'px, 0px)';
+        moving_div.style.width = item.querySelector('li:nth-child(' + index + ')').offsetWidth + 'px';
+        moving_div.style.height = item.querySelector('li:nth-child(' + j + ')').offsetHeight;
+      } else {
+        for (var j = 1; j <= nodes.indexOf(li); j++) {
+          sum += item.querySelector('li:nth-child(' + j + ')').offsetWidth;
+        }
+        moving_div.style.transform = 'translate3d(' + sum + 'px, 0px, 0px)';
+        moving_div.style.width = item.querySelector('li:nth-child(' + index + ')').offsetWidth + 'px';
+
+      }
+    }
+  });
+
+  if (window.innerWidth < 991) {
+    total.forEach(function(item, i) {
+      if (!item.classList.contains('flex-column')) {
+        item.classList.add('flex-column', 'on-resize');
+      }
+    });
+  } else {
+    total.forEach(function(item, i) {
+      if (item.classList.contains('on-resize')) {
+        item.classList.remove('flex-column', 'on-resize');
+      }
+    })
+  }
+});
+
+
+function getEventTarget(e) {
+  e = e || window.event;
+  return e.target || e.srcElement;
+}
+
+// End tabs navigation
+
+// Light Mode / Dark Mode
+function darkMode(el) {
+  const body = document.getElementsByTagName('body')[0];
+  const hr = document.querySelectorAll('div:not(.sidenav) > hr');
+  const sidebar = document.querySelector('.sidenav');
+  const sidebarWhite = document.querySelectorAll('.sidenav.bg-white');
+  const hr_card = document.querySelectorAll('div:not(.bg-gradient-dark) hr');
+  const text_btn = document.querySelectorAll('button:not(.btn) > .text-dark');
+  const text_span = document.querySelectorAll('span.text-dark, .breadcrumb .text-dark');
+  const text_span_white = document.querySelectorAll('span.text-white');
+  const text_strong = document.querySelectorAll('strong.text-dark');
+  const text_strong_white = document.querySelectorAll('strong.text-white');
+  const text_nav_link = document.querySelectorAll('a.nav-link.text-dark');
+  const secondary = document.querySelectorAll('.text-secondary');
+  const bg_gray_100 = document.querySelectorAll('.bg-gray-100');
+  const bg_gray_600 = document.querySelectorAll('.bg-gray-600');
+  const btn_text_dark = document.querySelectorAll('.btn.btn-link.text-dark, .btn .ni.text-dark');
+  const btn_text_white = document.querySelectorAll('.btn.btn-link.text-white, .btn .ni.text-white');
+  const card_border = document.querySelectorAll('.card.border');
+  const card_border_dark = document.querySelectorAll('.card.border.border-dark');
+  const svg = document.querySelectorAll('g');
+  const navbarBrand = document.querySelector('.navbar-brand-img');
+  const navbarBrandImg = navbarBrand.src;
+  const navLinks = document.querySelectorAll('.navbar-main .nav-link, .navbar-main .breadcrumb-item, .navbar-main .breadcrumb-item a, .navbar-main h6');
+  const cardNavLinksIcons = document.querySelectorAll('.card .nav .nav-link i');
+  const cardNavSpan = document.querySelectorAll('.card .nav .nav-link span');
+
+
+  if (!el.getAttribute("checked")) {
+    body.classList.add('dark-version');
+    if (navbarBrandImg.includes('logo-ct-dark.png')) {
+      var navbarBrandImgNew = navbarBrandImg.replace("logo-ct-dark", "logo-ct");
+      navbarBrand.src = navbarBrandImgNew;
+    }
+    for (var i = 0; i < cardNavLinksIcons.length; i++) {
+      if (cardNavLinksIcons[i].classList.contains('text-dark')) {
+        cardNavLinksIcons[i].classList.remove('text-dark');
+        cardNavLinksIcons[i].classList.add('text-white');
+      }
+    }
+    for (var i = 0; i < cardNavSpan.length; i++) {
+      if (cardNavSpan[i].classList.contains('text-sm')) {
+        cardNavSpan[i].classList.add('text-white');
+      }
+    }
+    for (var i = 0; i < hr.length; i++) {
+      if (hr[i].classList.contains('dark')) {
+        hr[i].classList.remove('dark');
+        hr[i].classList.add('light');
+      }
+    }
+    for (var i = 0; i < hr_card.length; i++) {
+      if (hr_card[i].classList.contains('dark')) {
+        hr_card[i].classList.remove('dark');
+        hr_card[i].classList.add('light');
+      }
+    }
+    for (var i = 0; i < text_btn.length; i++) {
+      if (text_btn[i].classList.contains('text-dark')) {
+        text_btn[i].classList.remove('text-dark');
+        text_btn[i].classList.add('text-white');
+      }
+    }
+    for (var i = 0; i < text_span.length; i++) {
+      if (text_span[i].classList.contains('text-dark')) {
+        text_span[i].classList.remove('text-dark');
+        text_span[i].classList.add('text-white');
+      }
+    }
+    for (var i = 0; i < text_strong.length; i++) {
+      if (text_strong[i].classList.contains('text-dark')) {
+        text_strong[i].classList.remove('text-dark');
+        text_strong[i].classList.add('text-white');
+      }
+    }
+    for (var i = 0; i < text_nav_link.length; i++) {
+      if (text_nav_link[i].classList.contains('text-dark')) {
+        text_nav_link[i].classList.remove('text-dark');
+        text_nav_link[i].classList.add('text-white');
+      }
+    }
+    for (var i = 0; i < secondary.length; i++) {
+      if (secondary[i].classList.contains('text-secondary')) {
+        secondary[i].classList.remove('text-secondary');
+        secondary[i].classList.add('text-white');
+        secondary[i].classList.add('opacity-8');
+      }
+    }
+    for (var i = 0; i < bg_gray_100.length; i++) {
+      if (bg_gray_100[i].classList.contains('bg-gray-100')) {
+        bg_gray_100[i].classList.remove('bg-gray-100');
+        bg_gray_100[i].classList.add('bg-gray-600');
+      }
+    }
+    for (var i = 0; i < btn_text_dark.length; i++) {
+      btn_text_dark[i].classList.remove('text-dark');
+      btn_text_dark[i].classList.add('text-white');
+    }
+    for (var i = 0; i < sidebarWhite.length; i++) {
+      sidebarWhite[i].classList.remove('bg-white');
+    }
+    for (var i = 0; i < svg.length; i++) {
+      if (svg[i].hasAttribute('fill')) {
+        svg[i].setAttribute('fill', '#fff');
+      }
+    }
+    for (var i = 0; i < card_border.length; i++) {
+      card_border[i].classList.add('border-dark');
+    }
+    el.setAttribute("checked", "true");
+  } else {
+    body.classList.remove('dark-version');
+    sidebar.classList.add('bg-white');
+    if (navbarBrandImg.includes('logo-ct.png')) {
+      var navbarBrandImgNew = navbarBrandImg.replace("logo-ct", "logo-ct-dark");
+      navbarBrand.src = navbarBrandImgNew;
+    }
+    for (var i = 0; i < navLinks.length; i++) {
+      if (navLinks[i].classList.contains('text-dark')) {
+        navLinks[i].classList.add('text-white');
+        navLinks[i].classList.remove('text-dark');
+      }
+    }
+    for (var i = 0; i < cardNavLinksIcons.length; i++) {
+      if (cardNavLinksIcons[i].classList.contains('text-white')) {
+        cardNavLinksIcons[i].classList.remove('text-white');
+        cardNavLinksIcons[i].classList.add('text-dark');
+      }
+    }
+    for (var i = 0; i < cardNavSpan.length; i++) {
+      if (cardNavSpan[i].classList.contains('text-white')) {
+        cardNavSpan[i].classList.remove('text-white');
+      }
+    }
+    for (var i = 0; i < hr.length; i++) {
+      if (hr[i].classList.contains('light')) {
+        hr[i].classList.add('dark');
+        hr[i].classList.remove('light');
+      }
+    }
+    for (var i = 0; i < hr_card.length; i++) {
+      if (hr_card[i].classList.contains('light')) {
+        hr_card[i].classList.add('dark');
+        hr_card[i].classList.remove('light');
+      }
+    }
+    for (var i = 0; i < text_btn.length; i++) {
+      if (text_btn[i].classList.contains('text-white')) {
+        text_btn[i].classList.remove('text-white');
+        text_btn[i].classList.add('text-dark');
+      }
+    }
+    for (var i = 0; i < text_span_white.length; i++) {
+      if (text_span_white[i].classList.contains('text-white') && !text_span_white[i].closest('.sidenav') && !text_span_white[i].closest('.card.bg-gradient-dark')) {
+        text_span_white[i].classList.remove('text-white');
+        text_span_white[i].classList.add('text-dark');
+      }
+    }
+    for (var i = 0; i < text_strong_white.length; i++) {
+      if (text_strong_white[i].classList.contains('text-white')) {
+        text_strong_white[i].classList.remove('text-white');
+        text_strong_white[i].classList.add('text-dark');
+      }
+    }
+    for (var i = 0; i < secondary.length; i++) {
+      if (secondary[i].classList.contains('text-white')) {
+        secondary[i].classList.remove('text-white');
+        secondary[i].classList.remove('opacity-8');
+        secondary[i].classList.add('text-dark');
+      }
+    }
+    for (var i = 0; i < bg_gray_600.length; i++) {
+      if (bg_gray_600[i].classList.contains('bg-gray-600')) {
+        bg_gray_600[i].classList.remove('bg-gray-600');
+        bg_gray_600[i].classList.add('bg-gray-100');
+      }
+    }
+    for (var i = 0; i < svg.length; i++) {
+      if (svg[i].hasAttribute('fill')) {
+        svg[i].setAttribute('fill', '#252f40');
+      }
+    }
+    for (var i = 0; i < btn_text_white.length; i++) {
+      if (!btn_text_white[i].closest('.card.bg-gradient-dark')) {
+        btn_text_white[i].classList.remove('text-white');
+        btn_text_white[i].classList.add('text-dark');
+      }
+    }
+    for (var i = 0; i < card_border_dark.length; i++) {
+      card_border_dark[i].classList.remove('border-dark');
+    }
+    el.removeAttribute("checked");
+  }
+};

styles/argon-dashboard-2.0.4/assets/js/plugins/Chart.extension.js

@@ -0,0 +1,130 @@
+//
+// Chart extension for making the bars rounded
+// Code from: https://codepen.io/jedtrow/full/ygRYgo
+//
+
+Chart.elements.Rectangle.prototype.draw = function() {
+
+  var ctx = this._chart.ctx;
+  var vm = this._view;
+  var left, right, top, bottom, signX, signY, borderSkipped, radius;
+  var borderWidth = vm.borderWidth;
+  // Set Radius Here
+  // If radius is large enough to cause drawing errors a max radius is imposed
+  var cornerRadius = 6;
+
+  if (!vm.horizontal) {
+    // bar
+    left = vm.x - vm.width / 2;
+    right = vm.x + vm.width / 2;
+    top = vm.y;
+    bottom = vm.base;
+    signX = 1;
+    signY = bottom > top ? 1 : -1;
+    borderSkipped = vm.borderSkipped || 'bottom';
+  } else {
+    // horizontal bar
+    left = vm.base;
+    right = vm.x;
+    top = vm.y - vm.height / 2;
+    bottom = vm.y + vm.height / 2;
+    signX = right > left ? 1 : -1;
+    signY = 1;
+    borderSkipped = vm.borderSkipped || 'left';
+  }
+
+  // Canvas doesn't allow us to stroke inside the width so we can
+  // adjust the sizes to fit if we're setting a stroke on the line
+  if (borderWidth) {
+    // borderWidth shold be less than bar width and bar height.
+    var barSize = Math.min(Math.abs(left - right), Math.abs(top - bottom));
+    borderWidth = borderWidth > barSize ? barSize : borderWidth;
+    var halfStroke = borderWidth / 2;
+    // Adjust borderWidth when bar top position is near vm.base(zero).
+    var borderLeft = left + (borderSkipped !== 'left' ? halfStroke * signX : 0);
+    var borderRight = right + (borderSkipped !== 'right' ? -halfStroke * signX : 0);
+    var borderTop = top + (borderSkipped !== 'top' ? halfStroke * signY : 0);
+    var borderBottom = bottom + (borderSkipped !== 'bottom' ? -halfStroke * signY : 0);
+    // not become a vertical line?
+    if (borderLeft !== borderRight) {
+      top = borderTop;
+      bottom = borderBottom;
+    }
+    // not become a horizontal line?
+    if (borderTop !== borderBottom) {
+      left = borderLeft;
+      right = borderRight;
+    }
+  }
+
+  ctx.beginPath();
+  ctx.fillStyle = vm.backgroundColor;
+  ctx.strokeStyle = vm.borderColor;
+  ctx.lineWidth = borderWidth;
+
+  // Corner points, from bottom-left to bottom-right clockwise
+  // | 1 2 |
+  // | 0 3 |
+  var corners = [
+    [left, bottom],
+    [left, top],
+    [right, top],
+    [right, bottom]
+  ];
+
+  // Find first (starting) corner with fallback to 'bottom'
+  var borders = ['bottom', 'left', 'top', 'right'];
+  var startCorner = borders.indexOf(borderSkipped, 0);
+  if (startCorner === -1) {
+    startCorner = 0;
+  }
+
+  function cornerAt(index) {
+    return corners[(startCorner + index) % 4];
+  }
+
+  // Draw rectangle from 'startCorner'
+  var corner = cornerAt(0);
+  ctx.moveTo(corner[0], corner[1]);
+
+  for (var i = 1; i < 4; i++) {
+    corner = cornerAt(i);
+    nextCornerId = i + 1;
+    if (nextCornerId == 4) {
+      nextCornerId = 0
+    }
+
+    nextCorner = cornerAt(nextCornerId);
+
+    width = corners[2][0] - corners[1][0];
+    height = corners[0][1] - corners[1][1];
+    x = corners[1][0];
+    y = corners[1][1];
+
+    var radius = cornerRadius;
+
+    // Fix radius being too large
+    if (radius > height / 2) {
+      radius = height / 2;
+    }
+    if (radius > width / 2) {
+      radius = width / 2;
+    }
+
+    ctx.moveTo(x + radius, y);
+    ctx.lineTo(x + width - radius, y);
+    ctx.quadraticCurveTo(x + width, y, x + width, y + radius);
+    ctx.lineTo(x + width, y + height - radius);
+    ctx.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
+    ctx.lineTo(x + radius, y + height);
+    ctx.quadraticCurveTo(x, y + height, x, y + height - radius);
+    ctx.lineTo(x, y + radius);
+    ctx.quadraticCurveTo(x, y, x + radius, y);
+
+  }
+
+  ctx.fill();
+  if (borderWidth) {
+    ctx.stroke();
+  }
+};

styles/argon-dashboard-2.0.4/assets/js/plugins/bootstrap-notify.js

@@ -0,0 +1,432 @@
+/*
+
+
+
+     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');
+    }
+  };
+
+
+}));