script.js

// Get elements
const searchButton = document.getElementById('searchButton');
const searchInput = document.getElementById('searchInput');
const searchModal = document.getElementById('searchModal');
const closeBtn = document.getElementsByClassName('close')[0];

// Search button click event
searchButton.addEventListener('click', function() {
    const query = searchInput.value;
    const cseElement = document.createElement('div');
    cseElement.className = 'gcse-searchresults-only';
    searchModal.querySelector('#cse').appendChild(cseElement);
    google.search.cse.element.render({
        div: cseElement,
        tag: 'searchresults-only',
        gname: 'gSearchResults',
    });
    searchModal.style.display = 'block';
});

// Close button click event
closeBtn.onclick = function() {
    searchModal.style.display = 'none';
}

// Close modal when clicking outside
window.onclick = function(event) {
    if (event.target === searchModal) {
        searchModal.style.display = 'none';
    }
}