Mirror/SponsorBlock
1
0
Fork 0
mirror of https://github.com/ajayyy/SponsorBlock.git synced 2025-12-11 14:07:13 +03:00
Code Issues Packages Projects Releases Wiki Activity

Fix popup width when embedded in page

Browse Source
This commit is contained in:
Alec Rust
2022-08-21 11:56:31 +01:00
parent 780ea4a9d0
commit bc1263c341
2 changed files with 13 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
public/popup.css
View File

@@ -100,6 +100,10 @@
margin-bottom: 16px; margin-bottom: 16px;
} }
#sponsorBlockPopupContainer iframe {
width: 100%;
}
/* /*
* Disable popup max height when displayed in-page (content.ts) * Disable popup max height when displayed in-page (content.ts)
*/ */
@@ -110,7 +114,7 @@
/* /*
* Disable fixed popup width when displayed in-page (content.ts) * Disable fixed popup width when displayed in-page (content.ts)
*/ */
#sponsorBlockPopupContainer #sponsorBlockPopupBody { #sponsorBlockPopupBody.is-embedded {
width: auto; width: auto;
} }
@@ -207,7 +211,7 @@
border-radius: 50%; border-radius: 50%;
display: inline-block; display: inline-block;
} }
/* /*
* Category name in segment * Category name in segment
*/ */
.summaryLabel { .summaryLabel {
@@ -511,7 +515,7 @@
background: var(--sb-grey-bg-color); background: var(--sb-grey-bg-color);
} }
/* /*
* Submissions * Submissions
*/ */
#sponsorTimesContributionsContainer { #sponsorTimesContributionsContainer {

10
src/popup.ts
View File

@@ -75,6 +75,7 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
const PageElements: PageElements = {}; const PageElements: PageElements = {};
[ [
"sponsorBlockPopupBody",
"sponsorblockPopup", "sponsorblockPopup",
"sponsorStart", "sponsorStart",
// Top toggles // Top toggles
@@ -132,7 +133,7 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
getSegmentsFromContentScript(false); getSegmentsFromContentScript(false);
await utils.wait(() => Config.config !== null && allowPopup, 5000, 5); await utils.wait(() => Config.config !== null && allowPopup, 5000, 5);
document.querySelector("body").style.removeProperty("visibility"); PageElements.sponsorBlockPopupBody.style.removeProperty("visibility");
if (!Config.configSyncListeners.includes(contentConfigUpdateListener)) { if (!Config.configSyncListeners.includes(contentConfigUpdateListener)) {
Config.configSyncListeners.push(contentConfigUpdateListener); Config.configSyncListeners.push(contentConfigUpdateListener);
} }
@@ -145,6 +146,7 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
if (window !== window.top) { if (window !== window.top) {
PageElements.sbCloseButton.classList.remove("hidden"); PageElements.sbCloseButton.classList.remove("hidden");
PageElements.sponsorBlockPopupBody.classList.add("is-embedded");
} }
// Hide donate button if wanted (Safari, or user choice) // Hide donate button if wanted (Safari, or user choice)
@@ -187,7 +189,7 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
if (window !== window.top) { if (window !== window.top) {
document.addEventListener("keydown", (e) => { document.addEventListener("keydown", (e) => {
const target = e.target as HTMLElement; const target = e.target as HTMLElement;
if (target.tagName === "INPUT" if (target.tagName === "INPUT"
|| target.tagName === "TEXTAREA" || target.tagName === "TEXTAREA"
|| e.key === "ArrowUp" || e.key === "ArrowUp"
|| e.key === "ArrowDown") { || e.key === "ArrowDown") {
@@ -255,7 +257,7 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
} }
PageElements.sponsorTimesOthersTimeSavedDisplay.innerText = getFormattedHours(minutesSaved); PageElements.sponsorTimesOthersTimeSavedDisplay.innerText = getFormattedHours(minutesSaved);
} }
Config.config.isVip = userInfo.vip; Config.config.isVip = userInfo.vip;
} }
}); });
@@ -489,7 +491,7 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
} }
segmentTimeFromToNode.style.margin = "5px"; segmentTimeFromToNode.style.margin = "5px";
// for inline-styling purposes // for inline-styling purposes
const labelContainer = document.createElement("div"); const labelContainer = document.createElement("div");
labelContainer.appendChild(categoryColorCircle); labelContainer.appendChild(categoryColorCircle);