Mirror/SponsorBlock
1
0
Fork 0
mirror of https://github.com/ajayyy/SponsorBlock.git synced 2025-12-10 21:47:06 +03:00
Code Issues Packages Projects Releases Wiki Activity

Make hiding highlight button smooth

Browse Source
This commit is contained in:
Ajay Ramachandran
2021-09-30 18:15:06 -04:00
parent ebcb600e99
commit 2064afb235
2 changed files with 8 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
public/content.css
View File

@@ -75,26 +75,28 @@
vertical-align: top;
}
.autoHiding {
overflow: visible !important;
}
.autoHiding:not(.hidden) {
transform: translateX(0%) scale(1);
/* opacity is from YouTube page */
transition: transform 0.2s, opacity .1s cubic-bezier(0.4,0.0,1,1) !important;
transition: transform 0.25s, width 0.25s, opacity .1s cubic-bezier(0.4,0.0,1,1) !important;
}
.autoHiding.hidden {
transform: translateX(100%) scale(0);
/* opacity is from YouTube page */
transition: transform 0.2s, opacity .1s cubic-bezier(0.4,0.0,1,1) !important;
transition: transform 0.25s, width 0.25s, opacity .1s cubic-bezier(0.4,0.0,1,1) !important;
width: 0px !important;
}
.autoHiding.hidden.autoHideLeft {
transform: translateX(-100%) scale(0);
}
.autoHiding.hidden.animationDone {
display: none !important;
}
.playerButton.hidden {
display: none;
}

7
src/utils.ts
View File

@@ -199,13 +199,6 @@ export default class Utils {
container.addEventListener("mouseleave", () => {
if (element.classList.contains("autoHiding")) {
element.classList.add("hidden");
const animationEndListener = () => {
if (element.classList.contains("hidden")) element.classList.add("animationDone");
element.removeEventListener("transitionend", animationEndListener);
};
element.addEventListener("transitionend", animationEndListener);
}
});
}