src/chrome/common/extensions/docs/examples/extensions/plugin_settings/options/css/list.css

   1 /*
   2 Copyright (c) 2011 The Chromium Authors. All rights reserved.
   3 Use of this source code is governed by a BSD-style license that can be
   4 found in the LICENSE file.
   5 */
   6
   7 .raw-button,
   8 .raw-button:hover,
   9 .raw-button:active {
  10   -webkit-box-shadow: none;
  11   background-color: transparent;
  12   background-repeat: no-repeat;
  13   border: none;
  14   min-width: 0;
  15   padding: 1px 6px;
  16 }
  17
  18 list > * {
  19   -webkit-box-align: center;
  20   -webkit-transition: .15s background-color;
  21   box-sizing: border-box;
  22   border-radius: 0;
  23   display: -webkit-box;
  24   height: 32px;
  25   border: none;
  26   margin: 0;
  27 }
  28
  29 list:not([disabled]) > :hover {
  30   background-color: #e4ecf7;
  31 }
  32
  33 /* TODO(stuartmorgan): Once this becomes the list style for other WebUI pages
  34  * these rules can be simplified (since they wont need to override other rules).
  35  */
  36
  37 list:not([hasElementFocus]) > [selected],
  38 list:not([hasElementFocus]) > [lead][selected] {
  39   background-color: #d0d0d0;
  40   background-image: none;
  41 }
  42
  43 list[hasElementFocus] > [selected],
  44 list[hasElementFocus] > [lead][selected],
  45 list:not([hasElementFocus]) > [selected]:hover,
  46 list:not([hasElementFocus]) > [selected][lead]:hover {
  47   background-color: #bbcee9;
  48   background-image: none;
  49 }
  50
  51 list[disabled] {
  52   opacity: 0.6;
  53 }
  54
  55 list > .heading {
  56   color: #666666;
  57 }
  58
  59 list > .heading:hover {
  60   background-color: transparent;
  61   border-color: transparent;
  62 }
  63
  64 list .deletable-item {
  65   -webkit-box-align: center;
  66 }
  67
  68 list .deletable-item > :first-child {
  69   -webkit-box-align: center;
  70   -webkit-box-flex: 1;
  71   -webkit-padding-end: 5px;
  72   display: -webkit-box;
  73 }
  74
  75 list .close-button {
  76   -webkit-transition: .15s opacity;
  77   background-color: transparent;
  78   /* TODO(stuartmorgan): Replace with real images once they are available. */
  79   background-image: url("../images/close_bar.png");
  80   border: none;
  81   display: block;
  82   height: 16px;
  83   opacity: 1;
  84   width: 16px;
  85 }
  86
  87 list > *:not(:hover):not([lead]) .close-button,
  88 list > *:not(:hover):not([selected]) .close-button,
  89 list:not([hasElementFocus]) > *:not(:hover) .close-button,
  90 list[disabled] .close-button,
  91 list .close-button[disabled] {
  92   opacity: 0;
  93   pointer-events: none;
  94 }
  95
  96 list .close-button:hover {
  97   background-image: url("../images/close_bar_h.png");
  98 }
  99
 100 list .close-button:active {
 101   background-image: url("../images/close_bar_p.png");
 102 }
 103
 104 list .static-text {
 105   overflow: hidden;
 106   text-overflow: ellipsis;
 107   white-space: nowrap;
 108 }
 109
 110 list[inlineeditable] input {
 111   box-sizing: border-box;
 112   margin: 0;
 113   width: 100%;
 114 }
 115
 116 list[inlineeditable] > :not([editing]) [displaymode="edit"],
 117 list[inlineeditable] > [editing] [displaymode="static"] {
 118   display: none;
 119 }
 120
 121 list > [editing] input:invalid {
 122   /* TODO(stuartmorgan): Replace with validity badge */
 123   background-color: pink;
 124 }