1/* 2 * QtWebKit specific overrides for HTML5 media elements. 3 * 4 * Copyright (C) 2009, 2011 Apple Inc. All rights reserved. 5 * Copyright (C) 2008 Nokia Corporation and/or its subsidiary(-ies) 6 * Copyright (C) 2013 Digia Plc. and/or its subsidiary(-ies) 7 * 8 * Redistribution and use in source and binary forms, with or without 9 * modification, are permitted provided that the following conditions 10 * are met: 11 * 1. Redistributions of source code must retain the above copyright 12 * notice, this list of conditions and the following disclaimer. 13 * 2. Redistributions in binary form must reproduce the above copyright 14 * notice, this list of conditions and the following disclaimer in the 15 * documentation and/or other materials provided with the distribution. 16 * 17 * THIS SOFTWARE IS PROVIDED BY APPLE COMPUTER, INC. ``AS IS'' AND ANY 18 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE 19 * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR 20 * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE COMPUTER, INC. OR 21 * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, 22 * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, 23 * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY 24 * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 25 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE 26 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 27 */ 28 29 /* QtWebKit media controls. Extends mediaControls.css */ 30 31audio { 32 height: 34px; 33 width: 400px; 34} 35 36audio::-webkit-media-controls-panel, video::-webkit-media-controls-panel { 37 overflow: visible; 38 height: 34px; 39 max-width: 800px; 40 margin-left: auto; 41 margin-right: auto; 42} 43 44audio::-webkit-media-controls-mute-button, video::-webkit-media-controls-mute-button { 45 width: 12px; 46 height: 12px; 47 padding: 6px; 48 margin-left: 6px; 49 margin-right: 3px; 50 border: none !important; 51 52 position: relative; 53 z-index: 1; 54} 55 56audio::-webkit-media-controls-play-button, video::-webkit-media-controls-play-button { 57 width: 9px; 58 height: 12px; 59 padding: 6px 12px 6px 11px; 60 margin-left: 5px; 61 margin-right: 3px; 62 border: none !important; 63} 64 65audio::-webkit-media-controls-timeline-container, video::-webkit-media-controls-timeline-container { 66 height: 34px; 67} 68 69audio::-webkit-media-controls-current-time-display, video::-webkit-media-controls-current-time-display { 70 -webkit-appearance: media-current-time-display; 71 -webkit-user-select: none; 72 display: inline-block; 73 height: 12px; 74 padding: 6px; 75 margin-left: 3px; 76 margin-right: 5px; 77 78 overflow: hidden; 79 cursor: default; 80 81 text-align: center; 82 font: -webkit-small-control; 83 font-size: 10px; 84 font-weight: bold; 85 color: white; 86} 87 88audio::-webkit-media-controls-time-remaining-display, video::-webkit-media-controls-time-remaining-display { 89 display: none; 90} 91 92audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline { 93 display: -webkit-flex; 94 -webkit-flex: 1 1; 95 height: 12px; /* See RenderThemeQt::adjustSliderThumbSize(). */ 96 padding: 6px 8px; 97} 98 99audio::-webkit-media-controls-volume-slider-container, video::-webkit-media-controls-volume-slider-container { 100 -webkit-appearance: media-volume-slider-container; 101 position: absolute; 102 bottom: 29px; 103 z-index: 2; 104 105 width: 24px; 106 height: 103px; 107} 108 109audio::-webkit-media-controls-volume-slider, video::-webkit-media-controls-volume-slider { 110 -webkit-appearance: media-volume-slider; 111 display: inline; 112 position: absolute; 113 114 top: 0px; 115 left: 6px; 116 117 width: 12px; /* See RenderThemeQt::adjustSliderThumbSize(). */ 118 padding: 6px; 119 height: 88px; 120 121} 122 123audio::-webkit-media-controls-seek-back-button, video::-webkit-media-controls-seek-back-button { 124 display: none; 125} 126 127audio::-webkit-media-controls-seek-forward-button, video::-webkit-media-controls-seek-forward-button { 128 display: none; 129} 130 131audio::-webkit-media-controls-fullscreen-button { 132 display: none; 133} 134 135video::-webkit-media-controls-fullscreen-button { 136 top: 0px; 137 right: 0px; 138 width: 12px; 139 height: 12px; 140 padding: 6px; 141 margin: 5px 5px 5px 3px; 142 border: none !important; 143} 144 145audio::-webkit-media-controls-rewind-button, video::-webkit-media-controls-rewind-button { 146 display: none; 147} 148 149audio::-webkit-media-controls-return-to-realtime-button, video::-webkit-media-controls-return-to-realtime-button { 150 display: none; 151} 152 153audio::-webkit-media-controls-toggle-closed-captions-button, video::-webkit-media-controls-toggle-closed-captions-button { 154 display: none; 155} 156 157::-webkit-media-controls-mute-button, 158::-webkit-media-controls-play-button, 159::-webkit-media-controls-timeline, 160::-webkit-media-controls-volume-slider, 161::-webkit-media-controls-fullscreen-button 162{ 163 box-sizing: content-box !important; 164} 165