Improve close popup button

This commit is contained in:
Alec Rust 2022-03-13 11:42:16 +00:00
parent 24fc5e4370
commit f7510eea88
No known key found for this signature in database
GPG key ID: EB374231DBCA5067
2 changed files with 132 additions and 107 deletions

View file

@ -7,14 +7,26 @@
}
/*
* IDs on container element (when inserted in page), <html> element,
* <body> element and main container
* Container when popup displayed in-page
*/
#sponsorBlockPopupContainer {
position: relative;
margin-bottom: 16px;
}
/*
* Disable fixed popup width when displayed in-page
*/
#sponsorBlockPopupContainer #sponsorBlockPopupBody {
width: auto;
}
/*
* Main containers
*/
#sponsorBlockPopupHTML {
color-scheme: dark;
}
@ -33,14 +45,6 @@
text-align: center;
}
/*
* Disable fixed popup width when displayed inline
*/
#sponsorBlockPopupContainer #sponsorBlockPopupBody {
width: auto;
}
/*
* Disable transition on all elements until the extension has loaded
*/
@ -49,6 +53,25 @@
transition: none !important;
}
/*
* Close popup button when displayed in-page
*/
.sbCloseButton {
background: transparent;
border: 0;
padding: 8px;
cursor: pointer;
position: absolute;
top: 5px;
right: 5px;
opacity: 0.5;
}
.sbCloseButton:hover {
opacity: 1;
}
/*
* Header logo
*/

View file

@ -1677,13 +1677,15 @@ function openInfoMenu() {
popup.innerHTML = htmlData;
//close button
const closeButton = document.createElement("div");
closeButton.innerText = chrome.i18n.getMessage("closePopup");
closeButton.classList.add("smallLink");
closeButton.setAttribute("align", "center");
const closeButton = document.createElement("button");
const closeButtonIcon = document.createElement("img");
closeButtonIcon.src = chrome.extension.getURL("icons/close.png");
closeButtonIcon.width = 16;
closeButtonIcon.height = 16;
closeButton.appendChild(closeButtonIcon);
closeButton.setAttribute("title", chrome.i18n.getMessage("closePopup"));
closeButton.classList.add("sbCloseButton");
closeButton.addEventListener("click", closeInfoMenu);
// Theme based color
closeButton.style.color = "var(--yt-spec-text-primary)";
//add the close button
popup.prepend(closeButton);