SkyGhostAir adlı üyeden alıntı: mesajı görüntüle
querySelectorAll kullanmıştım önceden de çalışmadı nedense. Verdiğiniz kodu aşağıdaki gibi eklemem gerekiyor sanırım, çalışmadı butonların hiçbiri.
var wHeight = window.innerHeight;
const sb = document.querySelectorAll(".search-button");
sb.forEach(item => {
    item.addEventListener("click", () => {})
})
var closeSB = document.querySelector(".search-close");
var SearchOverlay = document.body;
var searchBar = document.querySelector(".search-bar");
// Show
searchBar.style.top=wHeight/2 +'px';
    console.log(wHeight);
    window.addEventListener("resize", function() {
        console.log(wHeight);
        wHeight = window.innerHeight;
        searchBar.style.top=wHeight/2 + 'px';
    }, true);
document.addEventListener("click", function() {
    sb.onclick = function() {
    console.log("Opened Search for Element: ");
    SearchOverlay.classList.add("show-search");
};
// Hide
closeSB.onclick = function() {
    console.log("Closed Search for Element: " + closeSB);
    SearchOverlay.classList.remove("show-search");
    };
}, true);
Yanlış yapıyorsunuz. Aşağıdaki gibi olacak:

const wHeight = window.innerHeight;
const closeSB = document.querySelector(".search-close");
const SearchOverlay = document.body;
const searchBar = document.querySelector(".search-bar");
// Show
searchBar.style.top=wHeight/2 +'px';
    console.log(wHeight);
    window.addEventListener("resize", function() {
        console.log(wHeight);
        wHeight = window.innerHeight;
        searchBar.style.top=wHeight/2 + 'px';
    }, true);

document.queySelectorAll(".search-button").forEach(item => {
     item.addEventListener('click', () => {
         console.log("Opened Search for Element: ");
         SearchOverlay.classList.add("show-search");
     })
})
// Hide
closeSB.onclick = function() {
    console.log("Closed Search for Element: " + closeSB);
    SearchOverlay.classList.remove("show-search");
    };
}, true);