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