7allSideMenu.forEach(item=> {
8 const li = item.parentElement;
9
10 item.addEventListener('click', function () { 11 allSideMenu.forEach(i=> { 12 i.parentElement.classList.remove('active'); 13 }) 14 li.classList.add('active'); 15 }) 16});
17
18// TOGGLE SIDEBAR
27const searchButtonIcon = document.querySelector('#content nav form .form-input button .bx');
28const searchForm = document.querySelector('#content nav form');
29
30searchButton.addEventListener('click', function (e) { 31 if(window.innerWidth < 576) { 32 e.preventDefault(); 33 searchForm.classList.toggle('show'); 34 if(searchForm.classList.contains('show')) { 35 searchButtonIcon.classList.replace('bx-search', 'bx-x'); 36 } else { 37 searchButtonIcon.classList.replace('bx-x', 'bx-search'); 38 } 39 } 40}) 41
42
43if(window.innerWidth < 768) {
19const menuBar = document.querySelector('#content nav .bx.bx-menu');
20const sidebar = document.getElementById('sidebar');
21
22menuBar.addEventListener('click', function () { 23 sidebar.classList.toggle('hide'); 24}) 25
26const searchButton = document.querySelector('#content nav form .form-input button');
27const searchButtonIcon = document.querySelector('#content nav form .form-input button .bx');
It is recommended to use arrow functions as callbacks.
Arrow functions can be an attractive alternative to function expressions for callbacks or function arguments.
For example, arrow functions are automatically bound to their surrounding scope/context. This provides an alternative to the pre-ES6 standard of explicitly binding function expressions to achieve similar behavior.
Additionally, arrow functions are:
less verbose, and easier to reason about.
bound lexically regardless of where or when they are invoked.
func(function(a) { return a; }); // ERROR
// prefer: func(a => a)
func(function() { return this.a; }.bind(this)); // ERROR
// prefer: func(() => this.a)
// arrow function callback
func(a => a); // OK
// generator as callback
func(function*() { yield; }); // OK
// function expression not used as callback or function argument
var funcVar = function func(a) { return a; }; // OK
// unbound function expression callback
func(function() { return this.a; }); // OK
// recursive named function callback
func(function recursiveFunc(n) { return n && n + recursiveFunc(n - 1); }); // OK