buildSearchSpotlight() {
this.spotlightModal = document.createElement('DIV');
this.spotlightModal.setAttribute('id', 'spotlightModal')
this.spotlightModal.classList.add('hidden');
this.searchBar = document.createElement('INPUT');
this.searchBar.setAttribute('id', 'search-box')
this.searchbarWrapper = document.createElement('DIV');
this.searchbarWrapper.appendChild(this.searchBar)
this.spotlightModal.appendChild(this.searchbarWrapper);
// Add styling
this.spotlightModal.style.position = 'absolute'
this.spotlightModal.style.width = '100vw'
this.spotlightModal.style.height = '100vh'
this.spotlightModal.style.left = '0'
this.spotlightModal.style.top = '0'
this.spotlightModal.style.backgroundColor = 'rgba(0, 0, 0, 0.2)'
this.spotlightModal.style.display = 'flex'
this.spotlightModal.style.justifyContent = 'center'
this.spotlightModal.style.padding = '40px'
this.searchBar.style.height = '50px'
this.searchBar.style.width = '600px'
this.searchBar.style.borderRadius = '10px'
document.body.appendChild(this.spotlightModal);
// Add event listeners
this.spotlightInitiator.addEventListener('click', e => {
this.toggleSpotlight()
})
this.spotlightModal.addEventListener('click', e => {
this.toggleSpotlight()
})
// Stop the clicking of the search bar closing the modal
this.searchBar.addEventListener('click', e => {
e.stopPropagation()
})
}
For further actions, you may consider blocking this person and/or reporting abuse
Top comments (0)