CV/script.js at master · vanvong1989/CV · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
const sideMenu = document.querySelector('#sideMenu');
const navBar =  document.querySelector('nav');
const navLinks =  document.querySelector('nav ul');

function openMenu(){
    sideMenu.style.transform = 'translateX(-16rem)';

}

function closeMenu(){
    sideMenu.style.transform = 'translateX(16rem)';

}

window.addEventListener('scroll', () =>{
    if(scrollY > 50){
      navBar.classList.add('bg-white', 'bg-opacity-50', 'backdrop-blur-lg', 'shadow-sm', 'dark:bg-darkTheme', 'dark:shadow-white/20');
      navLinks.classList.remove('bg-white', 'shadow-sm', 'bg-opacity-50', 'dark:border', 'dark:bordr-white/50', 'dark:bg-transparent');
    }else {
        navBar.classList.remove('bg-white', 'bg-opacity-50', 'backdrop-blur-lg', 'shadow-sm', 'dark:bg-darkTheme', 'dark:shadow-white/20');
        navLinks.classList.add('bg-white', 'shadow-sm', 'bg-opacity-50', 'dark:border', 'dark:bordr-white/50', 'dark:bg-transparent');
    }
})

// --------------------- light mode and dark mode  -----------------------

if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
    document.documentElement.classList.add('dark')
  } else {
    document.documentElement.classList.remove('dark')
  }

  function toggleTheme() {
    document.documentElement.classList.toggle('dark');
    if(document.documentElement.classList.contains('dark')){
        localStorage.theme = 'dark';
    } else {

            localStorage.theme = 'light';
    }
  }