text: const primaryColor = '#4834d4'
  const warningColor = '#f0932b'
  const successColor = '#6ab04c'
  const dangerColor = '#eb4d4b'
  
  const themeCookieName = 'theme'
  const themeDark = 'dark'
  const themeLight = 'light'
  
  const body = document.getElementsByTagName('body')[0]
  
  
  
  function getCookie(cname) {
      var name = cname + "="
      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)
          }
          if (c.indexOf(name) == 0) {
              return c.substring(name.length, c.length)
          }
      }
      return ""
  }
  
  loadTheme()
  
  function loadTheme() {
      var theme = getCookie(themeCookieName)
      body.classList.add(theme === "" ? themeLight : theme)
  }
  
  function collapseSidebar() {
      body.classList.toggle('sidebar-expand')
  }
  
  window.onclick = function(event) {
      openCloseDropdown(event)
  }
  
  function closeAllDropdown() {
      var dropdowns = document.getElementsByClassName('dropdown-expand')
      for (var i = 0; i < dropdowns.length; i++) {
          dropdowns[i].classList.remove('dropdown-expand')
      }
  }
  
  function openCloseDropdown(event) {
      if (!event.target.matches('.dropdown-toggle')) {
          // 
          // Close dropdown when click out of dropdown menu
          // 
          closeAllDropdown()
      } else {
          var toggle = event.target.dataset.toggle
          var content = document.getElementById(toggle)
          if (content.classList.contains('dropdown-expand')) {
              closeAllDropdown()
          } else {
              closeAllDropdown()
              content.classList.add('dropdown-expand')
          }
      }
  }
  
  var ctx = document.getElementById('myChart');
  ctx.height = 500;
  ctx.width = 500;
  var data = {
      labels: ['January', 'February', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
      datasets: [{
          fill: false,
          label: 'Completed',
          borderColor: successColor,
          data: [120, 115, 130, 100, 123, 88, 99, 66, 120, 52, 59],
          borderWidth: 2,
          lineTension: 0,
      }, {
          fill: false,
          label: 'Issues',
          borderColor: dangerColor,
          data: [66, 44, 12, 48, 99, 56, 78, 23, 100, 22, 47],
          borderWidth: 2,
          lineTension: 0,
      }]
  }
  
  var lineChart = new Chart(ctx, {
      type: 'line',
      data: data,
      options: {
          maintainAspectRatio: false,
          bezierCurve: false,
      }
  })