1/* 2 * WebKitGTK+ specific overrides for HTML5 media elements. 3 * 4 * Copyright (C) 2009 Zan Dobersek <zandobersek@gmail.com> 5 * 6 * This library is free software; you can redistribute it and/or 7 * modify it under the terms of the GNU Library General Public 8 * License as published by the Free Software Foundation; either 9 * version 2 of the License, or (at your option) any later version. 10 * 11 * This library is distributed in the hope that it will be useful, 12 * but WITHOUT ANY WARRANTY; without even the implied warranty of 13 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU 14 * Library General Public License for more details. 15 * 16 * You should have received a copy of the GNU Library General Public License 17 * along with this library; see the file COPYING.LIB. If not, write to 18 * the Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor, 19 * Boston, MA 02110-1301, USA. 20 * 21 */ 22 23audio { 24 height: 20px; 25 width: 300px; 26} 27 28audio::-webkit-media-controls-panel, video::-webkit-media-controls-panel { 29 display: -webkit-box; 30 -webkit-box-orient: horizontal; 31 -webkit-box-align: end; 32 -webkit-user-select: none; 33 position: absolute; 34 bottom: 0; 35 width: 100%; 36 z-index: 0; 37 overflow: hidden; 38 text-align: right; 39 height: 100%; 40} 41 42audio::-webkit-media-controls-mute-button, video::-webkit-media-controls-mute-button { 43 width: 20px; 44 height: 20px; 45} 46 47audio::-webkit-media-controls-play-button, video::-webkit-media-controls-play-button { 48 width: 20px; 49 height: 20px; 50} 51 52audio::-webkit-media-controls-timeline-container, video::-webkit-media-controls-timeline-container { 53 height: 20px; 54 border-left: 1px solid rgba(255, 255, 255, 0.2); 55 border-right: 1px solid rgba(255, 255, 255, 0.2); 56} 57 58audio::-webkit-media-controls-timeline, video::-webkit-media-controls-timeline { 59 height: 20px; 60} 61 62audio::-webkit-media-controls-current-time-display, video::-webkit-media-controls-current-time-display { 63 -webkit-appearance: media-current-time-display; 64 -webkit-user-select: none; 65 display: inline-block; 66 height: 20px; 67 68 padding: 5px; 69 70 text-align: center; 71 font-size: 10px; 72} 73 74audio::-webkit-media-controls-seek-back-button, video::-webkit-media-controls-seek-back-button { 75 width: 20px; 76 height: 20px; 77} 78 79audio::-webkit-media-controls-seek-forward-button, video::-webkit-media-controls-seek-forward-button { 80 width: 20px; 81 height: 20px; 82} 83 84audio::-webkit-media-controls-fullscreen-button, video::-webkit-media-controls-fullscreen-button { 85 width: 20px; 86 height: 20px; 87} 88 89audio::-webkit-media-controls-volume-slider-container, video::-webkit-media-controls-volume-slider-container { 90 -webkit-appearance: media-volume-slider-container; 91 position: absolute; 92 height: 100px; 93 width: 20px; 94} 95 96audio::-webkit-media-controls-volume-slider, video::-webkit-media-controls-volume-slider { 97 -webkit-appearance: media-volume-slider; 98 display: inline; 99 position: absolute; 100 width: 14px; 101 height: 95px; 102 103 left: 3px; 104 top: 5px; 105}