apply 10.8 css changes
- No use optimizing conditionally - Add animation on skipButton entry and exit
This commit is contained in:
parent
a98b9c7a37
commit
196dd4c30c
@ -41,7 +41,7 @@ introSkipper.fetchWrapper = async function (...args) {
|
|||||||
introSkipper.viewShow = function () {
|
introSkipper.viewShow = function () {
|
||||||
const location = window.location.hash;
|
const location = window.location.hash;
|
||||||
introSkipper.d("Location changed to " + location);
|
introSkipper.d("Location changed to " + location);
|
||||||
if (location !== "#/video") {
|
if (location !== "#!/video") {
|
||||||
introSkipper.d("Ignoring location change");
|
introSkipper.d("Ignoring location change");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@ -66,6 +66,18 @@ introSkipper.injectCss = function () {
|
|||||||
let styleElement = document.createElement("style");
|
let styleElement = document.createElement("style");
|
||||||
styleElement.id = "introSkipperCss";
|
styleElement.id = "introSkipperCss";
|
||||||
styleElement.innerText = `
|
styleElement.innerText = `
|
||||||
|
@media (hover:hover) and (pointer:fine) {
|
||||||
|
#skipIntro .paper-icon-button-light:hover:not(:disabled) {
|
||||||
|
color: black !important;
|
||||||
|
background-color: rgba(47, 93, 98, 0) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
#skipIntro .paper-icon-button-light.show-focus:focus {
|
||||||
|
transform: scale(1.04) !important;
|
||||||
|
}
|
||||||
|
#skipIntro.upNextContainer {
|
||||||
|
width: unset;
|
||||||
|
}
|
||||||
#skipIntro {
|
#skipIntro {
|
||||||
padding: 0 1px;
|
padding: 0 1px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -81,32 +93,22 @@ introSkipper.injectCss = function () {
|
|||||||
-webkit-transition: ease-out 0.4s;
|
-webkit-transition: ease-out 0.4s;
|
||||||
-moz-transition: ease-out 0.4s;
|
-moz-transition: ease-out 0.4s;
|
||||||
transition: ease-out 0.4s;
|
transition: ease-out 0.4s;
|
||||||
|
}
|
||||||
|
#skipIntro #btnSkipSegmentText {
|
||||||
|
padding-right: 3px;
|
||||||
|
padding-bottom: 2px;
|
||||||
|
}
|
||||||
@media (max-width: 1080px) {
|
@media (max-width: 1080px) {
|
||||||
|
#skipIntro {
|
||||||
right: 10%;
|
right: 10%;
|
||||||
}
|
}
|
||||||
&:hover {
|
}
|
||||||
|
#skipIntro:hover {
|
||||||
box-shadow: inset 400px 0 0 0 #f9f9f9;
|
box-shadow: inset 400px 0 0 0 #f9f9f9;
|
||||||
-webkit-transition: ease-in 1s;
|
-webkit-transition: ease-in 1s;
|
||||||
-moz-transition: ease-in 1s;
|
-moz-transition: ease-in 1s;
|
||||||
transition: ease-in 1s;
|
transition: ease-in 1s;
|
||||||
}
|
}
|
||||||
&.upNextContainer {
|
|
||||||
width: unset;
|
|
||||||
}
|
|
||||||
@media (hover:hover) and (pointer:fine) {
|
|
||||||
.paper-icon-button-light:hover:not(:disabled) {
|
|
||||||
color: black !important;
|
|
||||||
background-color: rgba(47, 93, 98, 0) !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.paper-icon-button-light.show-focus:focus {
|
|
||||||
transform: scale(1.04) !important;
|
|
||||||
}
|
|
||||||
#btnSkipSegmentText {
|
|
||||||
padding-right: 3px;
|
|
||||||
padding-bottom: 2px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
`;
|
`;
|
||||||
document.querySelector("head").appendChild(styleElement);
|
document.querySelector("head").appendChild(styleElement);
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user