1 /* Copyright 2014 The Chromium Authors. All rights reserved. 2 * Use of this source code is governed by a BSD-style license that can be 3 * found in the LICENSE file. */ 4 5 :host { 6 background: white; 7 display: block; 8 height: 100px; 9 position: relative; 10 width: 32px; 11 } 12 13 #background { 14 height: 100%; /* will be overridden by javascript */ 15 left: 0; 16 position: absolute; 17 top: 0; 18 width: 100%; 19 } 20 21 input[type='range'] { 22 -webkit-appearance: none !important; 23 -webkit-transform: rotate(90deg); 24 background: transparent; 25 outline: none; 26 position: absolute; 27 z-index: 1; 28 } 29 30 input[type='range']::-webkit-slider-thumb { 31 -webkit-appearance: none; 32 -webkit-transform: rotate(-90deg); 33 background-image: -webkit-image-set( 34 url(../assets/100/player_timeline_handler.png) 1x, 35 url(../assets/200/player_timeline_handler.png) 2x); 36 background-position: 50% 50%; 37 background-repeat: no-repeat no-repeat; 38 height: 24px; 39 position: relative; 40 width: 24px; 41 } 42 43 #bar { 44 background: #000; 45 bottom: 14px; 46 position: absolute; 47 top: 14px; 48 } 49 50 #bar .filled { 51 background: #aaa; 52 } 53