mirror of
https://github.com/ajayyy/SponsorBlock.git
synced 2024-09-20 04:53:43 +02:00
Improve close popup button
This commit is contained in:
parent
24fc5e4370
commit
f7510eea88
2 changed files with 132 additions and 107 deletions
|
@ -7,14 +7,26 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* IDs on container element (when inserted in page), <html> element,
|
* Container when popup displayed in-page
|
||||||
* <body> element and main container
|
|
||||||
*/
|
*/
|
||||||
|
|
||||||
#sponsorBlockPopupContainer {
|
#sponsorBlockPopupContainer {
|
||||||
|
position: relative;
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Disable fixed popup width when displayed in-page
|
||||||
|
*/
|
||||||
|
|
||||||
|
#sponsorBlockPopupContainer #sponsorBlockPopupBody {
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Main containers
|
||||||
|
*/
|
||||||
|
|
||||||
#sponsorBlockPopupHTML {
|
#sponsorBlockPopupHTML {
|
||||||
color-scheme: dark;
|
color-scheme: dark;
|
||||||
}
|
}
|
||||||
|
@ -33,14 +45,6 @@
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
|
||||||
* Disable fixed popup width when displayed inline
|
|
||||||
*/
|
|
||||||
|
|
||||||
#sponsorBlockPopupContainer #sponsorBlockPopupBody {
|
|
||||||
width: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Disable transition on all elements until the extension has loaded
|
* Disable transition on all elements until the extension has loaded
|
||||||
*/
|
*/
|
||||||
|
@ -49,6 +53,25 @@
|
||||||
transition: none !important;
|
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
|
* Header logo
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -1677,13 +1677,15 @@ function openInfoMenu() {
|
||||||
popup.innerHTML = htmlData;
|
popup.innerHTML = htmlData;
|
||||||
|
|
||||||
//close button
|
//close button
|
||||||
const closeButton = document.createElement("div");
|
const closeButton = document.createElement("button");
|
||||||
closeButton.innerText = chrome.i18n.getMessage("closePopup");
|
const closeButtonIcon = document.createElement("img");
|
||||||
closeButton.classList.add("smallLink");
|
closeButtonIcon.src = chrome.extension.getURL("icons/close.png");
|
||||||
closeButton.setAttribute("align", "center");
|
closeButtonIcon.width = 16;
|
||||||
|
closeButtonIcon.height = 16;
|
||||||
|
closeButton.appendChild(closeButtonIcon);
|
||||||
|
closeButton.setAttribute("title", chrome.i18n.getMessage("closePopup"));
|
||||||
|
closeButton.classList.add("sbCloseButton");
|
||||||
closeButton.addEventListener("click", closeInfoMenu);
|
closeButton.addEventListener("click", closeInfoMenu);
|
||||||
// Theme based color
|
|
||||||
closeButton.style.color = "var(--yt-spec-text-primary)";
|
|
||||||
|
|
||||||
//add the close button
|
//add the close button
|
||||||
popup.prepend(closeButton);
|
popup.prepend(closeButton);
|
||||||
|
|
Loading…
Reference in a new issue