Home | History | Annotate | Download | only in css
      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