1/* 2 * BlackBerry specific overrides for HTML5 media elements. 3 * 4 * Copyright (C) 2009 Apple Inc. All rights reserved. 5 * Copyright (C) 2010, 2011, 2012 Research In Motion Limited. All rights reserved. 6 * 7 * Redistribution and use in source and binary forms, with or without 8 * modification, are permitted provided that the following conditions 9 * are met: 10 * 1. Redistributions of source code must retain the above copyright 11 * notice, this list of conditions and the following disclaimer. 12 * 2. Redistributions in binary form must reproduce the above copyright 13 * notice, this list of conditions and the following disclaimer in the 14 * documentation and/or other materials provided with the distribution. 15 * 16 * THIS SOFTWARE IS PROVIDED BY APPLE COMPUTER, INC. ``AS IS'' AND ANY 17 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE 18 * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR 19 * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE COMPUTER, INC. OR 20 * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, 21 * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, 22 * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY 23 * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 24 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE 25 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 26 */ 27 28 /* BlackBerry fullscreen video controls. */ 29 30body:-webkit-full-page-media { 31 background-color: rgb(0, 0, 0); 32} 33 34video:-webkit-full-screen::-webkit-media-controls-embedded-panel { 35 display: none; 36} 37 38video:-webkit-full-screen::-webkit-media-controls-panel { 39 display: -webkit-flex; 40 -webkit-flex-direction: column; 41 -webkit-align-items: stretch; 42 position: absolute; 43 bottom: 0px; 44 width: 100%; 45 height: auto; 46 background-color: rgba(38, 38, 38, 0.8); 47 color: rgb(250, 250, 250); 48} 49 50video:-webkit-full-screen::-webkit-media-controls-button-group-container { 51 -webkit-appearance: media-controls-background; 52 display: -webkit-flex; 53 -webkit-flex-direction: row; 54 -webkit-align-items: center; 55 -webkit-justify-content: space-between; 56 -webkit-flex: 1; 57 background-color: rgb(0, 0, 0); 58} 59 60video:-webkit-full-screen::-webkit-media-controls-fullscreen-time-display-container { 61 -webkit-appearance: media-controls-background; 62 display: -webkit-flex; 63 -webkit-flex-direction: row; 64 -webkit-align-items: center; 65 -webkit-justify-content: space-between; 66 -webkit-flex: 1; 67} 68 69video:-webkit-full-screen::-webkit-media-controls-time-display-container { 70 display: none; 71} 72 73video:-webkit-full-screen::-webkit-media-controls-fullscreen-play-button { 74 -webkit-appearance: media-play-button; 75 display: -webkit-flex; 76} 77 78video:-webkit-full-screen::-webkit-media-controls-play-button { 79 display: none; 80} 81 82video:-webkit-full-screen::-webkit-media-controls-fullscreen-timeline-container { 83 -webkit-appearance: media-controls-background; 84 display: -webkit-flex; 85 -webkit-flex-direction: column; 86 -webkit-align-items: stretch; 87 -webkit-justify-content: center; 88 -webkit-flex: 1; 89 height: auto; 90 width: 100%; 91} 92 93video:-webkit-full-screen::-webkit-media-controls-timeline-container { 94 display: none; 95} 96 97video:-webkit-full-screen::-webkit-media-controls-fullscreen-current-time-display { 98 -webkit-appearance: media-current-time-display; 99 display: -webkit-flex; 100 -webkit-flex-direction: row; 101 -webkit-align-items: center; 102 -webkit-justify-content: flex-end; 103 -webkit-flex: 0; 104} 105 106video:-webkit-full-screen::-webkit-media-controls-current-time-display { 107 display: none; 108} 109 110video:-webkit-full-screen::-webkit-media-controls-fullscreen-time-remaining-display { 111 -webkit-appearance: media-time-remaining-display; 112 display: -webkit-flex; 113 -webkit-flex-direction: row; 114 -webkit-align-items: center; 115 -webkit-justify-content: flex-end; 116 -webkit-flex: 0; 117 color: rgb(125, 125, 125); 118} 119 120video:-webkit-full-screen::-webkit-media-controls-time-remaining-display { 121 display: none; 122} 123 124video:-webkit-full-screen::-webkit-media-controls-fullscreen-timeline { 125 -webkit-appearance: media-slider; 126 display: -webkit-flex; 127 -webkit-flex: 1; 128} 129 130video:-webkit-full-screen::-webkit-media-controls-timeline { 131 display: none; 132} 133 134video:-webkit-full-screen::-webkit-media-controls-fullscreen-fullscreen-button { 135 -webkit-appearance: media-exit-fullscreen-button; 136 display: -webkit-flex; 137} 138 139video:-webkit-full-screen::-webkit-media-controls-fullscreen-button { 140 display: none; 141} 142 143video:-webkit-full-screen::-webkit-media-controls-audio-mute-button { 144 display: none; 145} 146 147video:-webkit-full-screen::-webkit-media-controls-volume-slider-container { 148 display: none; 149} 150 151video:-webkit-full-screen::-webkit-media-controls-volume-slider { 152 display: none; 153} 154 155video:-webkit-full-screen::-webkit-media-controls-fullscreen-button-divider { 156 -webkit-appearance: media-rewind-button; 157 display: -webkit-flex; 158} 159 160video:-webkit-full-screen::-webkit-media-controls-fullscreen-button-container, video:-webkit-full-screen::-webkit-media-controls-play-button-container { 161 -webkit-appearance: media-controls-background; 162 display: -webkit-flex; 163 -webkit-flex-direction: row; 164 -webkit-align-items: center; 165 -webkit-flex: 1; 166 min-width: 100%; 167} 168 169video:-webkit-full-screen::-webkit-media-controls-fullscreen-button-container { 170 -webkit-justify-content: flex-start; 171} 172 173video:-webkit-full-screen::-webkit-media-controls-play-button-container { 174 -webkit-justify-content: center; 175} 176 177video:-webkit-full-screen::-webkit-media-controls-placeholder { 178 -webkit-appearance: media-controls-background; 179 display: -webkit-flex; 180 -webkit-flex: 1; 181 min-width: 100%; 182} 183