function themeToggle() {
  const oldValue = localStorage.getItem('theme');
  let newValue;
  if (oldValue == 'light') {
    newValue = 'dark';
  } else if (oldValue == 'dark') {
    newValue = 'light';
  }
  localStorage.setItem('theme', newValue);
  themeRefresh();
}

function themeClear() {
  localStorage.setItem('theme', '');
  themeRefresh();
}

function themeRefresh(newValue) {
  if (newValue !== undefined) {
    localStorage.setItem('theme', newValue);
  }

  const theme = localStorage.getItem('theme')
  const el = document.getElementsByTagName('html')[0];
  if (theme == 'light') {
    el.setAttribute('theme', 'light');
  } else if (theme == 'dark') {
    el.setAttribute('theme', 'dark');
  } else {
    el.setAttribute('theme', '');
  }
}

function main() {
  const buttonToggle = document.getElementsByClassName('theme-toggle');
  for (const el of buttonToggle) {
    el.onclick = themeToggle;
  }
  const buttonClear = document.getElementsByTagName('theme-clear');
  for (const el of buttonClear) {
    el.onclick = themeClear;
  }
  themeRefresh();
}

main();