X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=EarlyBlue%2Fglobal%2Fmedia%2Fvideocontrols.css;h=e0b56c6518026bd5b453dc15c61b9c87bcd14ecf;hp=c76db36036af094037bded1dc2ff5030004ce585;hb=76c1877e1d85ee27ea6e5da23923778a69442d78;hpb=f128e38f4b564fd22f46f810e104934d864d7caf diff --git a/EarlyBlue/global/media/videocontrols.css b/EarlyBlue/global/media/videocontrols.css index c76db360..e0b56c65 100644 --- a/EarlyBlue/global/media/videocontrols.css +++ b/EarlyBlue/global/media/videocontrols.css @@ -40,10 +40,7 @@ } .fullscreenButton { - background-color: transparent; - list-style-image: url("chrome://global/skin/media/fullscreenButton.png"); - -moz-image-region: rect(0px, 16px, 16px, 0px); - -moz-appearance: none; + background: -moz-image-rect(url("chrome://global/skin/media/fullscreenButton.png"), 0, 16, 16, 0) no-repeat center; margin: 0; padding: 0; min-height: 28px; @@ -52,7 +49,7 @@ } .fullscreenButton[fullscreened] { - -moz-image-region: rect(0px, 32px, 16px, 16px); + background-image: -moz-image-rect(url("chrome://global/skin/media/fullscreenButton.png"), 0, 32, 16, 16); } .volumeStack { @@ -178,7 +175,7 @@ font-size: 10px; font-family: "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif; text-shadow: rgba(102,102,153, 0.3) 0 1px; - padding-top: 2px; + padding-top: 5px; } .statusOverlay { @@ -205,6 +202,24 @@ background: url("chrome://global/skin/icons/alert-error.gif") no-repeat center; } +/* Overlay Play button */ +.clickToPlay { + width: 64px; + height: 64px; + -moz-box-pack: center; + -moz-box-align: center; + opacity: 0.7; + background-image: url("chrome://global/skin/media/clicktoplay-bgtexture.png"), + url("chrome://global/skin/media/videoClickToPlayButton.svg"); + background-repeat: repeat, no-repeat; + background-position: center, center; + background-size: auto, 64px 64px; + background-color: hsla(0,0%,10%,.5); +} +.clickToPlay:hover { + opacity: 1; +} + /* Statistics formatting */ html|*.statsDiv { position: relative; @@ -231,6 +246,18 @@ html|table { } /* CSS Transitions */ +.clickToPlay { + -moz-transition-property: opacity, background-size; + -moz-transition-duration: 400ms, 400ms; +} +.clickToPlay[fadeout] { + background-size: auto, 192px 192px; + opacity: 0; +} +.clickToPlay[fadeout][immediate] { + -moz-transition-property: opacity, background-size; + -moz-transition-duration: 0s, 0s; +} .controlBar:not([immediate]) { -moz-transition-property: opacity; -moz-transition-duration: 200ms;