diff options
author | Horst3180 | 2016-09-25 13:48:09 +0200 |
---|---|---|
committer | Horst3180 | 2016-09-25 13:48:09 +0200 |
commit | 1d6fd7158566981aef6b8eef84bf110d23189500 (patch) | |
tree | fb23016c1069dc830cade3f359ef29d6a6005a1f /arc-firefox-theme/chrome/global/media/videocontrols.css | |
parent | 98a2f994a8626e1ca34305465fe668ff893f8b17 (diff) | |
download | solarc-firefox-theme-1d6fd7158566981aef6b8eef84bf110d23189500.tar.gz solarc-firefox-theme-1d6fd7158566981aef6b8eef84bf110d23189500.tar.xz solarc-firefox-theme-1d6fd7158566981aef6b8eef84bf110d23189500.zip |
update to 50.0b1
Diffstat (limited to 'arc-firefox-theme/chrome/global/media/videocontrols.css')
-rw-r--r-- | arc-firefox-theme/chrome/global/media/videocontrols.css | 123 |
1 files changed, 116 insertions, 7 deletions
diff --git a/arc-firefox-theme/chrome/global/media/videocontrols.css b/arc-firefox-theme/chrome/global/media/videocontrols.css index 09e9a5f..6907620 100644 --- a/arc-firefox-theme/chrome/global/media/videocontrols.css +++ b/arc-firefox-theme/chrome/global/media/videocontrols.css @@ -12,6 +12,7 @@ .playButton, .muteButton, +.closedCaptionButton, .fullscreenButton { background-color: transparent; background-repeat: no-repeat; @@ -27,12 +28,14 @@ .playButton:hover, .muteButton:hover, +.closedCaptionButton:hover, .fullscreenButton:hover { opacity: 1; } .playButton:hover:active, .muteButton:hover:active, +.closedCaptionButton:hover:active, .fullscreenButton:hover:active { opacity: 0.4; } @@ -63,6 +66,19 @@ display: none; } +.closedCaptionButton { + background-image: url(chrome://global/skin/media/closeCaptionButton.png); + background-position: 4px; +} + +.closedCaptionButton[enabled] { + opacity: 1; +} + +.closedCaptionButton[hidden] { + display: none; +} + .fullscreenButton { background-image: -moz-image-rect(url("chrome://global/skin/media/fullscreenButton.png"), 0, 16, 16, 0); } @@ -92,9 +108,44 @@ background-clip: content-box; } -.controlBar[fullscreen-unavailable] > .volumeStack { +.textTrackList { + display: -moz-box; + -moz-appearance: none; + -moz-box-pack: end; + -moz-box-align: end; + padding: 0; +} + +.textTrackList[hidden] { + display: none; +} + +.textTrackList > html|*.textTrackItem { + -moz-appearance: none; + -moz-box-align: start; + text-align: start; + overflow: hidden; + margin: 0; + padding: 2px 10px; + -moz-margin-end: 10px; + border: none; + color: rgba(255,255,255,.5); + background-color: rgba(35,31,32,.74); + white-space: nowrap; +} + +.textTrackList > html|*.textTrackItem[on] { + color: white; + background-color: black; +} + +.textTrackList > html|*.textTrackItem:hover { + background-color: rgba(0,0,0,.55); +} + +.controlBar[fullscreen-unavailable] { /* This value is duplicated in the videocontrols.xml adjustControlSize function. */ - margin-inline-end: 8px; + padding-inline-end: 8px; } .volumeControl .scale-thumb { @@ -109,10 +160,13 @@ .durationLabel { margin-left: -22px; /* 1/2 of scrubber thumb width, for overhang. */ padding-left: 8px; /* don't bump into the scrubber bar */ - padding-top: 0; /* center vertically with scrubber bar */ color: rgba(255,255,255,.75); + font: message-box; font-size: 11px; - font-family: Arial, sans-serif; +} + +.durationLabel { + padding-top: 0; /* center vertically with scrubber bar */ } .positionLabel { @@ -171,7 +225,6 @@ margin-top: -10px; margin-bottom: 10px; } - /* .scale-thumb is an element inside the <scale> implementation. */ .scrubber .scale-thumb, .volumeControl .scale-thumb { @@ -194,10 +247,14 @@ .timeLabel { color: rgba(255,255,255,.75); + font: message-box; font-size: 10px; - font-family: Arial, sans-serif; text-shadow: rgba(0,0,0,.3) 0 1px; - padding-top: 5px; + padding-top: 7px; +} + +.timeLabel { + padding-top: 5px; /* center vertically with scrubber bar */ } .statusOverlay { @@ -317,3 +374,55 @@ html|table { padding: 0 10px; text-align: center; } + +@media (min-resolution: 2dppx) { + .playButton { + background-image: url(chrome://global/skin/media/pauseButton@2x.png); + background-size: 28px 28px; + } + .playButton[paused] { + background-image: url(chrome://global/skin/media/playButton@2x.png); + background-size: 28px 28px; + } + .volumeBackground { + background-image: url(chrome://global/skin/media/volume-empty@2x.png); + background-size: 32px 16px; + } + .volumeForeground { + background-image: url(chrome://global/skin/media/volume-full@2x.png); + background-size: 32px 16px; + } + .muteButton { + background-image: url(chrome://global/skin/media/muteButton@2x.png); + background-size: 33px 28px; + } + .muteButton[muted] { + background-image: url(chrome://global/skin/media/unmuteButton@2x.png); + background-size: 33px 28px; + } + .muteButton[noAudio] { + background-image: url(chrome://global/skin/media/noAudio@2x.png); + background-size: 33px 28px; + } + .closedCaptionButton { + background-image: url(chrome://global/skin/media/closeCaptionButton@2x.png); + background-position: 4px; + background-size: 28px 28px; + } + .fullscreenButton { + background-image: -moz-image-rect(url("chrome://global/skin/media/fullscreenButton@2x.png"), 0, 32, 32, 0); + background-size: 16px 16px; + } + .fullscreenButton[fullscreened] { + background-image: -moz-image-rect(url("chrome://global/skin/media/fullscreenButton@2x.png"), 0, 64, 32, 32); + background-size: 16px 16px; + } + .timeThumb { + background-image: url(chrome://global/skin/media/scrubberThumb@2x.png); + background-size: 33px 28px; + } + .timeThumb[showhours="true"] { + background-image: url(chrome://global/skin/media/scrubberThumbWide@2x.png); + background-size: 45px 28px; + } +} |