X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=EarlyBlue%2Fglobal%2Fmedia%2Fvideocontrols.css;h=51276bd56295fef27cb17ed4920caaad878a4bf7;hp=732f3febe1825e5b8638f58e28c38214cc9b92f9;hb=66c00ea1805e36c1c5ed46a3bb703bec0d339acb;hpb=46dc2718163b4e6ffb52ef8f46bef4c8db7ed804 diff --git a/EarlyBlue/global/media/videocontrols.css b/EarlyBlue/global/media/videocontrols.css index 732f3feb..51276bd5 100644 --- a/EarlyBlue/global/media/videocontrols.css +++ b/EarlyBlue/global/media/videocontrols.css @@ -6,35 +6,34 @@ background-color: rgba(102,102,153,0.75); } -.playButton, .muteButton { - /* Remove the usual button appearance and styling */ +.playButton, +.muteButton, +.fullscreenButton { + background-color: transparent; + background-repeat: no-repeat; + background-position: center; margin: 0px; padding: 0px; border: none; min-height: 28px; - background-color: transparent; - background-repeat: no-repeat; - background-position: center center; -} -.playButton { min-width: 28px; - margin-right: -22px; /* 1/2 of scrubber thumb width, for overhang. */ - position: relative; /* Trick to work around negative margin interfering with clicking on the button. */ -} -.muteButton { - min-width: 33px; } .playButton { background-image: url("chrome://global/skin/media/pauseButton.png"); + margin-right: -22px; /* 1/2 of scrubber thumb width, for overhang. */ + position: relative; /* Trick to work around negative margin interfering with clicking on the button. */ } + .playButton[paused] { background-image: url("chrome://global/skin/media/playButton.png"); } .muteButton { background-image: url("chrome://global/skin/media/muteButton.png"); + min-width: 33px; } + .muteButton[muted] { background-image: url("chrome://global/skin/media/unmuteButton.png"); } @@ -44,12 +43,7 @@ } .fullscreenButton { - 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; - min-width: 28px; - border: none; + background-image: -moz-image-rect(url("chrome://global/skin/media/fullscreenButton.png"), 0, 16, 16, 0); } .fullscreenButton[fullscreened] { @@ -77,8 +71,8 @@ -moz-appearance: none; background: url("chrome://global/skin/media/volumeThumb.png") no-repeat center; border: none !important; - min-width: 16px; - min-height: 11px; + min-width: 20px; + min-height: 10px; } .volumeBackgroundBar { @@ -165,7 +159,7 @@ } .timeThumb[showhours="true"] { - background: url("chrome://global/skin/media/scrubberThumbWide.png") no-repeat center; + background-image: url("chrome://global/skin/media/scrubberThumbWide.png"); } /* @@ -251,36 +245,36 @@ html|table { /* CSS Transitions */ .clickToPlay { - -moz-transition-property: opacity, background-size; - -moz-transition-duration: 400ms, 400ms; + transition-property: opacity, background-size; + 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; + transition-property: opacity, background-size; + transition-duration: 0s, 0s; } .controlBar:not([immediate]) { - -moz-transition-property: opacity; - -moz-transition-duration: 200ms; + transition-property: opacity; + transition-duration: 200ms; } .controlBar[fadeout] { opacity: 0; } .volumeStack:not([immediate]) { - -moz-transition-property: opacity, margin-top; - -moz-transition-duration: 200ms, 200ms; + transition-property: opacity, margin-top; + transition-duration: 200ms, 200ms; } .volumeStack[fadeout] { opacity: 0; margin-top: 0; } .statusOverlay:not([immediate]) { - -moz-transition-property: opacity; - -moz-transition-duration: 300ms; - -moz-transition-delay: 750ms; + transition-property: opacity; + transition-duration: 300ms; + transition-delay: 750ms; } .statusOverlay[fadeout] { opacity: 0;