mirror of
https://github.com/ajayyy/SponsorBlock.git
synced 2024-09-19 20:51:28 +02:00
Rename hidden css class to sbhidden to fix compatibility with Piped
Fixes #1865
This commit is contained in:
parent
39cfdc7b6c
commit
04a9f82bdc
9 changed files with 31 additions and 31 deletions
|
@ -7,7 +7,7 @@
|
|||
--sb-dark-red-outline: rgb(130,0,0,0.9);
|
||||
}
|
||||
|
||||
.hidden {
|
||||
.sbhidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
@ -151,7 +151,7 @@ div:hover > .sponsorBlockChapterBar {
|
|||
vertical-align: top;
|
||||
}
|
||||
|
||||
.playerButton.hidden:not(.autoHiding) {
|
||||
.playerButton.sbhidden:not(.autoHiding) {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
@ -169,13 +169,13 @@ div:hover > .sponsorBlockChapterBar {
|
|||
overflow: visible !important;
|
||||
}
|
||||
|
||||
.autoHiding:not(.hidden) {
|
||||
.autoHiding:not(.sbhidden) {
|
||||
transform: translateX(0%) scale(1);
|
||||
/* opacity is from YouTube page */
|
||||
transition: transform 0.2s, width 0.2s, opacity .1s cubic-bezier(0.4,0.0,1,1) !important;
|
||||
}
|
||||
|
||||
.autoHiding.hidden {
|
||||
.autoHiding.sbhidden {
|
||||
transform: translateX(100%) scale(0);
|
||||
/* opacity is from YouTube page */
|
||||
transition: transform 0.2s, width 0.2s, opacity .1s cubic-bezier(0.4,0.0,1,1) !important;
|
||||
|
@ -183,7 +183,7 @@ div:hover > .sponsorBlockChapterBar {
|
|||
width: 0px !important;
|
||||
}
|
||||
|
||||
.autoHiding.hidden.autoHideLeft {
|
||||
.autoHiding.sbhidden.autoHideLeft {
|
||||
transform: translateX(-100%) scale(0);
|
||||
}
|
||||
|
||||
|
@ -272,7 +272,7 @@ div:hover > .sponsorBlockChapterBar {
|
|||
max-width: calc(100% - 50px);
|
||||
}
|
||||
|
||||
.sponsorSkipNotice .hidden {
|
||||
.sponsorSkipNotice .sbhidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
@ -691,7 +691,7 @@ input::-webkit-inner-spin-button {
|
|||
color: white;
|
||||
}
|
||||
|
||||
.skipButtonControlBarContainer.hidden {
|
||||
.skipButtonControlBarContainer.sbhidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
|
|
@ -257,7 +257,7 @@ input[type='number'] {
|
|||
opacity: 0;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
.hidden, .sbhidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
|
|
@ -19,7 +19,7 @@ body {
|
|||
font-weight: bold;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
.hidden, .sbhidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
position: relative;
|
||||
}
|
||||
|
||||
#sponsorBlockPopupBody .hidden {
|
||||
#sponsorBlockPopupBody .hidden, #sponsorBlockPopupBody .sbhidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
|
|
@ -36,7 +36,7 @@
|
|||
max-width: calc(100% - 50px);
|
||||
}
|
||||
|
||||
.sponsorSkipNotice .hidden {
|
||||
.sponsorSkipNotice .sbhidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
|
|
@ -44,7 +44,7 @@ class ChapterVoteComponent extends React.Component<ChapterVoteProps, ChapterVote
|
|||
<>
|
||||
{/* Upvote Button */}
|
||||
<button id={"sponsorTimesDownvoteButtonsContainerUpvoteChapter"}
|
||||
className={"playerButton sbPlayerUpvote ytp-button " + (!this.state.show ? "hidden" : "")}
|
||||
className={"playerButton sbPlayerUpvote ytp-button " + (!this.state.show ? "sbhidden" : "")}
|
||||
draggable="false"
|
||||
title={chrome.i18n.getMessage("upvoteButtonInfo")}
|
||||
onClick={(e) => this.vote(e, 1)}>
|
||||
|
@ -55,7 +55,7 @@ class ChapterVoteComponent extends React.Component<ChapterVoteProps, ChapterVote
|
|||
|
||||
{/* Downvote Button */}
|
||||
<button id={"sponsorTimesDownvoteButtonsContainerDownvoteChapter"}
|
||||
className={"playerButton sbPlayerDownvote ytp-button " + (!this.state.show ? "hidden" : "")}
|
||||
className={"playerButton sbPlayerDownvote ytp-button " + (!this.state.show ? "sbhidden" : "")}
|
||||
draggable="false"
|
||||
title={chrome.i18n.getMessage("reportButtonInfo")}
|
||||
onClick={(e) => {
|
||||
|
|
|
@ -196,21 +196,21 @@ class NoticeComponent extends React.Component<NoticeProps, NoticeState> {
|
|||
<span
|
||||
id={"skipNoticeTimerText" + this.idSuffix}
|
||||
key="skipNoticeTimerText"
|
||||
className={this.state.countdownMode !== CountdownMode.Timer ? "hidden" : ""} >
|
||||
className={this.state.countdownMode !== CountdownMode.Timer ? "sbhidden" : ""} >
|
||||
{chrome.i18n.getMessage("NoticeTimeAfterSkip").replace("{seconds}", this.state.countdownTime.toString())}
|
||||
</span>
|
||||
),(
|
||||
<img
|
||||
id={"skipNoticeTimerPaused" + this.idSuffix}
|
||||
key="skipNoticeTimerPaused"
|
||||
className={this.state.countdownMode !== CountdownMode.Paused ? "hidden" : ""}
|
||||
className={this.state.countdownMode !== CountdownMode.Paused ? "sbhidden" : ""}
|
||||
src={chrome.runtime.getURL("icons/pause.svg")}
|
||||
alt={chrome.i18n.getMessage("paused")} />
|
||||
),(
|
||||
<img
|
||||
id={"skipNoticeTimerStopped" + this.idSuffix}
|
||||
key="skipNoticeTimerStopped"
|
||||
className={this.state.countdownMode !== CountdownMode.Stopped ? "hidden" : ""}
|
||||
className={this.state.countdownMode !== CountdownMode.Stopped ? "sbhidden" : ""}
|
||||
src={chrome.runtime.getURL("icons/stop.svg")}
|
||||
alt={chrome.i18n.getMessage("manualPaused")} />
|
||||
)];
|
||||
|
|
|
@ -41,7 +41,7 @@ export class SkipButtonControlBar {
|
|||
|
||||
this.container = document.createElement("div");
|
||||
this.container.classList.add("skipButtonControlBarContainer");
|
||||
this.container.classList.add("hidden");
|
||||
this.container.classList.add("sbhidden");
|
||||
if (this.onMobileYouTube) this.container.classList.add("mobile");
|
||||
|
||||
this.skipIcon = document.createElement("img");
|
||||
|
@ -103,7 +103,7 @@ export class SkipButtonControlBar {
|
|||
|
||||
this.refreshText();
|
||||
this.container?.classList?.remove("textDisabled");
|
||||
this.textContainer?.classList?.remove("hidden");
|
||||
this.textContainer?.classList?.remove("sbhidden");
|
||||
AnimationUtils.disableAutoHideAnimation(this.skipIcon);
|
||||
|
||||
this.startTimer();
|
||||
|
@ -111,8 +111,8 @@ export class SkipButtonControlBar {
|
|||
|
||||
refreshText(): void {
|
||||
if (this.segment) {
|
||||
this.chapterText?.classList?.add("hidden");
|
||||
this.container.classList.remove("hidden");
|
||||
this.chapterText?.classList?.add("sbhidden");
|
||||
this.container.classList.remove("sbhidden");
|
||||
this.textContainer.innerText = this.getTitle();
|
||||
this.skipIcon.setAttribute("title", this.getTitle());
|
||||
}
|
||||
|
@ -134,10 +134,10 @@ export class SkipButtonControlBar {
|
|||
}
|
||||
|
||||
disable(): void {
|
||||
this.container.classList.add("hidden");
|
||||
this.container.classList.add("sbhidden");
|
||||
|
||||
this.chapterText?.classList?.remove("hidden");
|
||||
this.getChapterPrefix()?.classList?.remove("hidden");
|
||||
this.chapterText?.classList?.remove("sbhidden");
|
||||
this.getChapterPrefix()?.classList?.remove("sbhidden");
|
||||
|
||||
this.enabled = false;
|
||||
}
|
||||
|
@ -160,10 +160,10 @@ export class SkipButtonControlBar {
|
|||
}
|
||||
|
||||
this.container.classList.add("textDisabled");
|
||||
this.textContainer?.classList?.add("hidden");
|
||||
this.chapterText?.classList?.remove("hidden");
|
||||
this.textContainer?.classList?.add("sbhidden");
|
||||
this.chapterText?.classList?.remove("sbhidden");
|
||||
|
||||
this.getChapterPrefix()?.classList?.add("hidden");
|
||||
this.getChapterPrefix()?.classList?.add("sbhidden");
|
||||
|
||||
AnimationUtils.enableAutoHideAnimation(this.skipIcon);
|
||||
if (this.onMobileYouTube) {
|
||||
|
|
|
@ -27,7 +27,7 @@ function applyLoadingAnimation(element: HTMLElement, time: number, callback?: ()
|
|||
|
||||
function setupCustomHideAnimation(element: Element, container: Element, enabled = true, rightSlide = true): { hide: () => void; show: () => void } {
|
||||
if (enabled) element.classList.add("autoHiding");
|
||||
element.classList.add("hidden");
|
||||
element.classList.add("sbhidden");
|
||||
element.classList.add("animationDone");
|
||||
if (!rightSlide) element.classList.add("autoHideLeft");
|
||||
|
||||
|
@ -37,7 +37,7 @@ function setupCustomHideAnimation(element: Element, container: Element, enabled
|
|||
hide: () => {
|
||||
mouseEntered = false;
|
||||
if (element.classList.contains("autoHiding")) {
|
||||
element.classList.add("hidden");
|
||||
element.classList.add("sbhidden");
|
||||
}
|
||||
},
|
||||
show: () => {
|
||||
|
@ -46,7 +46,7 @@ function setupCustomHideAnimation(element: Element, container: Element, enabled
|
|||
|
||||
// Wait for next event loop
|
||||
setTimeout(() => {
|
||||
if (mouseEntered) element.classList.remove("hidden")
|
||||
if (mouseEntered) element.classList.remove("sbhidden")
|
||||
}, 10);
|
||||
}
|
||||
};
|
||||
|
@ -61,12 +61,12 @@ function setupAutoHideAnimation(element: Element, container: Element, enabled =
|
|||
|
||||
function enableAutoHideAnimation(element: Element): void {
|
||||
element.classList.add("autoHiding");
|
||||
element.classList.add("hidden");
|
||||
element.classList.add("sbhidden");
|
||||
}
|
||||
|
||||
function disableAutoHideAnimation(element: Element): void {
|
||||
element.classList.remove("autoHiding");
|
||||
element.classList.remove("hidden");
|
||||
element.classList.remove("sbhidden");
|
||||
}
|
||||
|
||||
export const AnimationUtils = {
|
||||
|
|
Loading…
Reference in a new issue