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 #video-player .arrow-box { 6 align-items: center; 7 display: flex; 8 height: 100%; 9 justify-content: center; 10 pointer-events: none; 11 position: absolute; 12 width: 100%; 13 z-index: 100; 14 } 15 16 #video-player .arrow-box .arrow-spacer { 17 flex-grow: 1; 18 } 19 20 #video-player[tools] .arrow-box .arrow { 21 pointer-events: auto; 22 } 23 24 /* The arrow icons are in nested divs so that their opacity can be manipulated 25 * independently from their parent (which can be dimmed when the crop frame 26 * overlaps it) */ 27 #video-player .arrow div { 28 background-position: center center; 29 background-repeat: no-repeat; 30 height: 193px; 31 opacity: 0; 32 width: 105px; 33 } 34 35 #video-player[multiple] .arrow-box .arrow div { 36 opacity: 0.25; 37 } 38 39 #video-player[multiple] .arrow-box .arrow div:hover { 40 opacity: 1; 41 } 42 43 #video-player:not([first-video]) .arrow.left div { 44 cursor: pointer; 45 background-image: -webkit-image-set( 46 url(../images/100/arrow_left.png) 1x, 47 url(../images/200/arrow_left.png) 2x); 48 } 49 50 #video-player:not([last-video]) .arrow.right div { 51 cursor: pointer; 52 background-image: -webkit-image-set( 53 url(../images/100/arrow_right.png) 1x, 54 url(../images/200/arrow_right.png) 2x); 55 } 56