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 41html[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 73html[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 -webkit-margin-after: 2px; 132 -webkit-margin-before: 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} 147