1 /* 2 * Copyright 2010, The Android Open Source Project 3 * 4 * Redistribution and use in source and binary forms, with or without 5 * modification, are permitted provided that the following conditions 6 * are met: 7 * * Redistributions of source code must retain the above copyright 8 * notice, this list of conditions and the following disclaimer. 9 * * Redistributions in binary form must reproduce the above copyright 10 * notice, this list of conditions and the following disclaimer in the 11 * documentation and/or other materials provided with the distribution. 12 * 13 * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS ``AS IS'' AND ANY 14 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE 15 * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR 16 * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR 17 * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, 18 * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, 19 * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR 20 * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY 21 * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 22 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE 23 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 24 */ 25 26 /* media controls */ 27 28 audio { 29 width: 200px; 30 height: 32px; 31 } 32 33 audio::-webkit-media-controls-panel, video::-webkit-media-controls-panel { 34 display: -webkit-box; 35 -webkit-box-orient: horizontal; 36 -webkit-box-align: center; 37 -webkit-user-select: none; 38 position: absolute; 39 bottom: 0; 40 width: 100%; 41 z-index: 0; 42 overflow: hidden; 43 height: 32px; 44 text-align: right; 45 } 46 47 video:-webkit-full-page-media::-webkit-media-controls-panel { 48 bottom: -32px; 49 } 50 51 audio::-webkit-media-controls-mute-button, video::-webkit-media-controls-mute-button { 52 -webkit-appearance: media-mute-button; 53 display: -webkit-box; 54 width: 32px; 55 height: 32px; 56 } 57 58 audio::-webkit-media-controls-play-button, video::-webkit-media-controls-play-button { 59 -webkit-appearance: media-play-button; 60 display: -webkit-box; 61 width: 32px; 62 height: 32px; 63 } 64 65 audio::-webkit-media-controls-timeline-container, video::-webkit-media-controls-timeline-container { 66 -webkit-appearance: media-controls-background; 67 display: -webkit-box; 68 -webkit-box-orient: horizontal; 69 -webkit-box-align: center; 70 -webkit-box-pack: end; 71 -webkit-box-flex: 1; 72 -webkit-user-select: none; 73 height: 32px; 74 } 75 76 audio::-webkit-media-controls-current-time-display, video::-webkit-media-controls-current-time-display { 77 display: none; 78 } 79 80 audio::-webkit-media-controls-time-remaining-display, video::-webkit-media-controls-time-remaining-display { 81 display: none; 82 } 83 84 audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline { 85 -webkit-appearance: media-slider; 86 display: -webkit-box; 87 -webkit-box-flex: 1; 88 height: 32px; 89 padding: 0px 2px; 90 } 91 92 audio::-webkit-media-controls-volume-slider-container, video::-webkit-media-controls-volume-slider-container { 93 display: none; 94 } 95 96 audio::-webkit-media-controls-volume-slider, video::-webkit-media-controls-volume-slider { 97 display: none; 98 } 99 100 audio::-webkit-media-controls-seek-back-button, video::-webkit-media-controls-seek-back-button { 101 -webkit-appearance: media-seek-back-button; 102 display: -webkit-box; 103 width: 32px; 104 height: 32px; 105 } 106 107 audio::-webkit-media-controls-seek-forward-button, video::-webkit-media-controls-seek-forward-button { 108 -webkit-appearance: media-seek-forward-button; 109 display: -webkit-box; 110 width: 32px; 111 height: 32px; 112 } 113 114 audio::-webkit-media-controls-fullscreen-button, video::-webkit-media-controls-fullscreen-button { 115 -webkit-appearance: media-fullscreen-button; 116 display: -webkit-box; 117 width: 32px; 118 height: 32px; 119 } 120 121 audio::-webkit-media-controls-rewind-button, video::-webkit-media-controls-rewind-button { 122 display: none; 123 } 124 125 audio::-webkit-media-controls-return-to-realtime-button, video::-webkit-media-controls-return-to-realtime-button { 126 display: none; 127 } 128 129 audio::-webkit-media-controls-toggle-closed-captions-button, video::-webkit-media-controls-toggle-closed-captions-button { 130 -webkit-appearance: media-toggle-closed-captions-button; 131 display: -webkit-box; 132 width: 32px; 133 height: 32px 134 } 135
