( function() {
    const modeSwitch = document.getElementById( 'mode-switch' );
    const light = modeSwitch.getElementsByClassName( "light" );
    const dark = modeSwitch.getElementsByClassName( "dark" );
    const body = document.getElementsByTagName( "body" );

light[ 0 ].addEventListener( 'click', function() {
    localStorage.setItem("mode", "dark")
    if ( !body[ 0 ].classList.contains( 'dark' ) ) {
        body[ 0 ].classList.add( 'dark' );
        light[ 0 ].classList.remove('active');
        dark[ 0 ].classList.add('active');
        document.getElementsByClassName('menu-main-container')[0].classList.add("dark");
        document.getElementsByClassName('menu-toggle')[0].classList.add("dark");
    }
    
} )

dark[ 0 ].addEventListener( "click", function() {
    localStorage.removeItem("mode");
    if ( body[ 0 ].classList.contains( 'dark' ) ) {
        body[ 0 ].classList.remove( 'dark' );
        light[ 0 ].classList.add('active');
        dark[ 0 ].classList.remove('active');
        document.getElementsByClassName('menu-main-container')[0].classList.remove("dark");
        document.getElementsByClassName('menu-toggle')[0].classList.remove("dark");
    }
})

window.onload = function() {
    if ( localStorage.getItem("mode") == "dark" ) {
        body[ 0 ].classList.add( 'dark' );
        light[ 0 ].classList.remove('active');
        dark[ 0 ].classList.add('active');
        document.getElementsByClassName('menu-main-container')[0].classList.add("dark");
        document.getElementsByClassName('menu-toggle')[0].classList.add("dark");
    }
}

} )()