src/chrome/browser/resources/chromeos/login/network_dropdown.css

   1 /* Copyright (c) 2012 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  * This is the stylesheet used by the network drop-down control.
   6  */
   7
   8 .dropdown-title {
   9   -webkit-appearance: none;
  10   -webkit-box-align: start;
  11   -webkit-padding-end: 20px;
  12   -webkit-padding-start: 1px;
  13   -webkit-user-select: none;
  14   background-image: url('../../../../../ui/webui/resources/images/select.png'),
  15       linear-gradient(to bottom,
  16                        rgb(237, 237, 237),
  17                        rgb(237, 237, 237) 38%,
  18                        rgb(222, 222, 222));
  19   background-position: center right;
  20   background-repeat: no-repeat;
  21   border: 1px solid rgba(0, 0, 0, 0.25);
  22   border-radius: 2px;
  23   box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08),
  24       inset 0 1px 2px rgba(255, 255, 255, 0.75);
  25   color: #444;
  26   display: -webkit-box;
  27   font-size: inherit;
  28   height: 22px;
  29   margin: 0;
  30   overflow: hidden;
  31   padding-bottom: 2px;
  32   padding-top: 2px;
  33   text-align: left;
  34   text-indent: 4px;
  35   text-overflow: ellipsis;
  36   text-shadow: 0 1px 0 rgb(240, 240, 240);
  37   white-space: nowrap;
  38   z-index: 10;
  39 }
  40
  41 html[dir=rtl] .dropdown-title {
  42   background-position: center left;
  43 }
  44
  45 .dropdown-title:enabled:hover {
  46   background-image: url('../../../../../ui/webui/resources/images/select.png'),
  47       linear-gradient(to bottom,
  48                        rgb(237, 237, 237),
  49                        rgb(237, 237, 237) 38%,
  50                        rgb(222, 222, 222));
  51   border-color: rgba(0, 0, 0, 0.3);
  52   box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12),
  53       inset 0 1px 2px rgba(255, 255, 255, 0.95);
  54   color: black;
  55 }
  56
  57 .dropdown-title:enabled:active {
  58   background-image: url('../../../../../ui/webui/resources/images/select.png'),
  59       linear-gradient(to bottom,
  60                        rgb(231, 231, 231),
  61                        rgb(231, 231, 231) 38%,
  62                        rgb(215, 215, 215));
  63   box-shadow: none;
  64   text-shadow: none;
  65 }
  66
  67 .dropdown-title:focus {
  68   -webkit-transition: border-color 200ms;
  69   border-color: rgb(77, 144, 254);
  70   outline: none;
  71 }
  72
  73 html[highlight=strong] .dropdown-title:focus {
  74   box-shadow: 0 0 23px rgb(77, 144, 254);
  75 }
  76
  77 .dropdown-title img {
  78   margin-top: -1px;
  79 }
  80
  81 .dropdown-title div {
  82   -webkit-box-flex: 1;
  83   margin-top: 1px;
  84   overflow: hidden;
  85   text-overflow: ellipsis;
  86 }
  87
  88 .dropdown-container {
  89   background: #f7f7f7;
  90   border: 1px solid rgb(124, 145, 191);
  91   max-height: 234px;
  92   overflow-x: hidden;
  93   overflow-y: auto;
  94   padding-bottom: 2px;
  95   padding-top: 2px;
  96   position: absolute;
  97   top: 100%;
  98   width: 99.5%;
  99   z-index: 10;
 100 }
 101
 102 .dropdown-item-container {
 103   -webkit-padding-start: 5px;
 104   display: -webkit-box;
 105   height: 24px;
 106 }
 107
 108 .dropdown-item-container.hover {
 109   background: rgb(220, 228, 250);
 110 }
 111
 112 .dropdown-image {
 113   width: 25px;
 114 }
 115
 116 .dropdown-item {
 117   -webkit-box-flex: 1;
 118   color: #555;
 119   cursor: default;
 120   overflow: hidden;
 121   padding-top: 4px;
 122   text-overflow: ellipsis;
 123   white-space: nowrap;
 124 }
 125
 126 .dropdown-divider {
 127   height: 3px;
 128 }
 129
 130 .dropdown-divider hr {
 131   margin-bottom: 2px;
 132   margin-top: 2px;
 133 }
 134
 135 .dropdown-item.disabled-item {
 136   color: graytext;
 137 }
 138
 139 .dropdown-overlay {
 140   bottom: 0;
 141   left: 0;
 142   position: fixed;
 143   right: 0;
 144   top: 0;
 145   z-index: 5;
 146 }