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 > .header { 6 -webkit-app-region: drag; 7 background: rgba(30, 30, 30, 0.8); 8 border-bottom: 1px solid rgba(50, 50, 50, 0.8); 9 display: flex; 10 flex-direction: row; 11 height: 45px; 12 opacity: 1; 13 pointer-events: auto; 14 position: absolute; 15 top: 0; 16 width: 100%; 17 z-index: 200; 18 } 19 20 #video-player > .header > #title { 21 color: white; 22 flex-grow: 1; 23 font-size: 16px; 24 line-height: 45px; 25 overflow: hidden; 26 padding-left: 15px; 27 text-overflow: ellipsis; 28 white-space: nowrap; 29 } 30 31 #video-player > .header > button, 32 #video-player > .header > button[disabled] { 33 align-content: center; 34 background-color: rgba(0, 0, 0, 0); 35 background-position: center; 36 background-repeat: no-repeat; 37 border: none; 38 box-shadow: none; 39 color: white; 40 cursor: pointer; 41 padding: 1px; /* Instead of a border. */ 42 position: relative; 43 z-index: 10; 44 } 45 46 #video-player > .header > button { 47 height: 40px; 48 margin: 6px 0; 49 min-width: 40px; /* Reset. */ 50 width: 40px; 51 } 52 53 #video-player > .header > button:hover { 54 background-color: rgba(240, 240, 240, 1); 55 } 56 57 #video-player > .header > button:active, 58 #video-player > .header > button[pressed], 59 #video-player > .header > button[pressed]:hover { 60 color: black; 61 } 62 63 #video-player > .header > button { 64 -webkit-app-region: no-drag; 65 -webkit-margin-end: 10px; 66 cursor: default; 67 height: 32px; 68 min-width: 32px; 69 width: 32px; 70 } 71 72 #video-player > .header > button.minimize-button { 73 background-image: -webkit-image-set( 74 url(chrome://resources/images/apps/topbar_button_minimize.png) 1x, 75 url(chrome://resources/images/2x/apps/topbar_button_minimize.png) 2x); 76 } 77 78 #video-player > .header > button.maximize-button { 79 background-image: -webkit-image-set( 80 url(chrome://resources/images/apps/topbar_button_maximize.png) 1x, 81 url(chrome://resources/images/2x/apps/topbar_button_maximize.png) 2x); 82 } 83 84 #video-player > .header > button.close-button { 85 background-image: -webkit-image-set( 86 url(chrome://resources/images/apps/topbar_button_close.png) 1x, 87 url(chrome://resources/images/2x/apps/topbar_button_close.png) 2x); 88 } 89