chrome/browser/resources/md_downloads/toolbar.css

   1 /* Copyright 2015 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   align-items: center;
   7   background: rgb(63, 85, 102);
   8   color: white;
   9   content-sizing: padding-box;
  10   display: flex;
  11   height: 56px;
  12 }
  13
  14 #title h1 {
  15   -webkit-margin-end: 0;
  16   -webkit-margin-start: 24px;
  17   font-size: 107.7%;
  18   font-weight: normal;
  19   margin-bottom: 0;
  20   margin-top: 0;
  21 }
  22
  23 #actions {
  24   display: flex;
  25   flex: none;
  26   width: var(--downloads-item-width);
  27 }
  28
  29 :host(:not([downloads-showing])) #actions {
  30   justify-content: center;
  31 }
  32
  33 #actions paper-button {
  34   -webkit-margin-end: 8px;
  35 }
  36
  37 #actions {
  38   color: rgb(192, 199, 205);
  39 }
  40
  41 #search {
  42   -webkit-padding-end: 10px;
  43   box-sizing: border-box;
  44   display: flex;
  45   justify-content: flex-end;
  46 }
  47
  48 #title,
  49 #search {
  50   /* (1024 total width - 622 item width) / 2 = 201 room to play. */
  51   flex: 1 0 201px;
  52 }
  53
  54 paper-icon-button {
  55   --iron-icon-height: 20px;
  56   --iron-icon-width: 20px;
  57   --paper-icon-button: {
  58     height: 20px;
  59     padding: 6px;
  60     width: 20px;
  61   };
  62 }
  63
  64 #more {
  65   --paper-menu-button: {
  66     padding: 0;
  67   };
  68   -webkit-margin-start: 16px;
  69 }
  70
  71 paper-item {
  72   -webkit-user-select: none;
  73   cursor: pointer;
  74   font: inherit;
  75   min-height: 40px;
  76 }
  77
  78 paper-item:hover {
  79   background: #eaeaea;  /* TODO(dbeam): real color? */
  80 }
  81
  82 @media not all and (max-width: 1024px) {
  83   /* Hide vertical dot menu when there's enough room for #actions. */
  84   paper-menu-button {
  85     display: none;
  86   }
  87 }
  88
  89 @media all and (max-width: 1024px) {
  90   /* Hide #actions for narrow windows; they're shown in a vertical dot menu. */
  91   #actions {
  92     display: none;
  93   }
  94 }