const sidebar = document.getElementById('sidebar');
const sidebarWrapper = document.getElementById('sidebarWrapper');
const openBtn = document.getElementById('openSidebarBtn')
const closeBtn = document.getElementById('closeSidebarBtn')

const classList = ['md:w-50', 'lg:w-60'];

openBtn.addEventListener('click', () => openSidebar());
closeBtn.addEventListener('click', () => closeSidebar());

function openSidebar() {
    classList.forEach(cl => sidebarWrapper.classList.toggle(cl))

    sidebar.classList.toggle('hidden');

    closeBtn.classList.toggle('hidden')
    openBtn.classList.toggle('hidden')
}

function closeSidebar() {
    classList.forEach(cl => sidebarWrapper.classList.toggle(cl))
    openBtn.classList.toggle('hidden')
    closeBtn.classList.toggle('hidden')

    sidebar.classList.toggle('hidden');
}