1/** 2 * selectize.css (v0.12.1) 3 * Copyright (c) 2013–2015 Brian Reavis & contributors 4 * 5 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this 6 * file except in compliance with the License. You may obtain a copy of the License at: 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software distributed under 10 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF 11 * ANY KIND, either express or implied. See the License for the specific language 12 * governing permissions and limitations under the License. 13 * 14 * @author Brian Reavis <brian@thirdroute.com> 15 */ 16 17.selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder { 18 visibility: visible !important; 19 background: #f2f2f2 !important; 20 background: rgba(0, 0, 0, 0.06) !important; 21 border: 0 none !important; 22 -webkit-box-shadow: inset 0 0 12px 4px #ffffff; 23 box-shadow: inset 0 0 12px 4px #ffffff; 24} 25.selectize-control.plugin-drag_drop .ui-sortable-placeholder::after { 26 content: '!'; 27 visibility: hidden; 28} 29.selectize-control.plugin-drag_drop .ui-sortable-helper { 30 -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); 31 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); 32} 33.selectize-dropdown-header { 34 position: relative; 35 padding: 5px 8px; 36 border-bottom: 1px solid #d0d0d0; 37 background: #f8f8f8; 38 -webkit-border-radius: 3px 3px 0 0; 39 -moz-border-radius: 3px 3px 0 0; 40 border-radius: 3px 3px 0 0; 41} 42.selectize-dropdown-header-close { 43 position: absolute; 44 right: 8px; 45 top: 50%; 46 color: #303030; 47 opacity: 0.4; 48 margin-top: -12px; 49 line-height: 20px; 50 font-size: 20px !important; 51} 52.selectize-dropdown-header-close:hover { 53 color: #000000; 54} 55.selectize-dropdown.plugin-optgroup_columns .optgroup { 56 border-right: 1px solid #f2f2f2; 57 border-top: 0 none; 58 float: left; 59 -webkit-box-sizing: border-box; 60 -moz-box-sizing: border-box; 61 box-sizing: border-box; 62} 63.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child { 64 border-right: 0 none; 65} 66.selectize-dropdown.plugin-optgroup_columns .optgroup:before { 67 display: none; 68} 69.selectize-dropdown.plugin-optgroup_columns .optgroup-header { 70 border-top: 0 none; 71} 72.selectize-control.plugin-remove_button [data-value] { 73 position: relative; 74 padding-right: 24px !important; 75} 76.selectize-control.plugin-remove_button [data-value] .remove { 77 z-index: 1; 78 /* fixes ie bug (see #392) */ 79 position: absolute; 80 top: 0; 81 right: 0; 82 bottom: 0; 83 width: 17px; 84 text-align: center; 85 font-weight: bold; 86 font-size: 12px; 87 color: inherit; 88 text-decoration: none; 89 vertical-align: middle; 90 display: inline-block; 91 padding: 2px 0 0 0; 92 border-left: 1px solid #d0d0d0; 93 -webkit-border-radius: 0 2px 2px 0; 94 -moz-border-radius: 0 2px 2px 0; 95 border-radius: 0 2px 2px 0; 96 -webkit-box-sizing: border-box; 97 -moz-box-sizing: border-box; 98 box-sizing: border-box; 99} 100.selectize-control.plugin-remove_button [data-value] .remove:hover { 101 background: rgba(0, 0, 0, 0.05); 102} 103.selectize-control.plugin-remove_button [data-value].active .remove { 104 border-left-color: #cacaca; 105} 106.selectize-control.plugin-remove_button .disabled [data-value] .remove:hover { 107 background: none; 108} 109.selectize-control.plugin-remove_button .disabled [data-value] .remove { 110 border-left-color: #ffffff; 111} 112.selectize-control { 113 position: relative; 114} 115.selectize-dropdown, 116.selectize-input, 117.selectize-input input { 118 color: #303030; 119 font-family: inherit; 120 font-size: 13px; 121 line-height: 18px; 122 -webkit-font-smoothing: inherit; 123} 124.selectize-input, 125.selectize-control.single .selectize-input.input-active { 126 background: #ffffff; 127 cursor: text; 128 display: inline-block; 129} 130.selectize-input { 131 border: 1px solid #d0d0d0; 132 padding: 8px 8px; 133 display: inline-block; 134 width: 100%; 135 overflow: hidden; 136 position: relative; 137 z-index: 1; 138 -webkit-box-sizing: border-box; 139 -moz-box-sizing: border-box; 140 box-sizing: border-box; 141 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); 142 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); 143 -webkit-border-radius: 3px; 144 -moz-border-radius: 3px; 145 border-radius: 3px; 146} 147.selectize-control.multi .selectize-input.has-items { 148 padding: 6px 8px 3px; 149} 150.selectize-input.full { 151 background-color: #ffffff; 152} 153.selectize-input.disabled, 154.selectize-input.disabled * { 155 cursor: default !important; 156} 157.selectize-input.focus { 158 -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15); 159 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15); 160} 161.selectize-input.dropdown-active { 162 -webkit-border-radius: 3px 3px 0 0; 163 -moz-border-radius: 3px 3px 0 0; 164 border-radius: 3px 3px 0 0; 165} 166.selectize-input > * { 167 vertical-align: baseline; 168 display: -moz-inline-stack; 169 display: inline-block; 170 zoom: 1; 171 *display: inline; 172} 173.selectize-control.multi .selectize-input > div { 174 cursor: pointer; 175 margin: 0 3px 3px 0; 176 padding: 2px 6px; 177 background: #f2f2f2; 178 color: #303030; 179 border: 0 solid #d0d0d0; 180} 181.selectize-control.multi .selectize-input > div.active { 182 background: #e8e8e8; 183 color: #303030; 184 border: 0 solid #cacaca; 185} 186.selectize-control.multi .selectize-input.disabled > div, 187.selectize-control.multi .selectize-input.disabled > div.active { 188 color: #7d7d7d; 189 background: #ffffff; 190 border: 0 solid #ffffff; 191} 192.selectize-input > input { 193 display: inline-block !important; 194 padding: 0 !important; 195 min-height: 0 !important; 196 max-height: none !important; 197 max-width: 100% !important; 198 margin: 0 2px 0 0 !important; 199 text-indent: 0 !important; 200 border: 0 none !important; 201 background: none !important; 202 line-height: inherit !important; 203 -webkit-user-select: auto !important; 204 -webkit-box-shadow: none !important; 205 box-shadow: none !important; 206} 207.selectize-input > input::-ms-clear { 208 display: none; 209} 210.selectize-input > input:focus { 211 outline: none !important; 212} 213.selectize-input::after { 214 content: ' '; 215 display: block; 216 clear: left; 217} 218.selectize-input.dropdown-active::before { 219 content: ' '; 220 display: block; 221 position: absolute; 222 background: #f0f0f0; 223 height: 1px; 224 bottom: 0; 225 left: 0; 226 right: 0; 227} 228.selectize-dropdown { 229 position: absolute; 230 z-index: 10; 231 border: 1px solid #d0d0d0; 232 background: #ffffff; 233 margin: -1px 0 0 0; 234 border-top: 0 none; 235 -webkit-box-sizing: border-box; 236 -moz-box-sizing: border-box; 237 box-sizing: border-box; 238 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); 239 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); 240 -webkit-border-radius: 0 0 3px 3px; 241 -moz-border-radius: 0 0 3px 3px; 242 border-radius: 0 0 3px 3px; 243} 244.selectize-dropdown [data-selectable] { 245 cursor: pointer; 246 overflow: hidden; 247} 248.selectize-dropdown [data-selectable] .highlight { 249 background: rgba(125, 168, 208, 0.2); 250 -webkit-border-radius: 1px; 251 -moz-border-radius: 1px; 252 border-radius: 1px; 253} 254.selectize-dropdown [data-selectable], 255.selectize-dropdown .optgroup-header { 256 padding: 5px 8px; 257} 258.selectize-dropdown .optgroup:first-child .optgroup-header { 259 border-top: 0 none; 260} 261.selectize-dropdown .optgroup-header { 262 color: #303030; 263 background: #ffffff; 264 cursor: default; 265} 266.selectize-dropdown .active { 267 background-color: #f5fafd; 268 color: #495c68; 269} 270.selectize-dropdown .active.create { 271 color: #495c68; 272} 273.selectize-dropdown .create { 274 color: rgba(48, 48, 48, 0.5); 275} 276.selectize-dropdown-content { 277 overflow-y: auto; 278 overflow-x: hidden; 279 max-height: 200px; 280} 281.selectize-control.single .selectize-input, 282.selectize-control.single .selectize-input input { 283 cursor: pointer; 284} 285.selectize-control.single .selectize-input.input-active, 286.selectize-control.single .selectize-input.input-active input { 287 cursor: text; 288} 289.selectize-control.single .selectize-input:after { 290 content: ' '; 291 display: block; 292 position: absolute; 293 top: 50%; 294 right: 15px; 295 margin-top: -3px; 296 width: 0; 297 height: 0; 298 border-style: solid; 299 border-width: 5px 5px 0 5px; 300 border-color: #808080 transparent transparent transparent; 301} 302.selectize-control.single .selectize-input.dropdown-active:after { 303 margin-top: -4px; 304 border-width: 0 5px 5px 5px; 305 border-color: transparent transparent #808080 transparent; 306} 307.selectize-control.rtl.single .selectize-input:after { 308 left: 15px; 309 right: auto; 310} 311.selectize-control.rtl .selectize-input > input { 312 margin: 0 4px 0 -2px !important; 313} 314.selectize-control .selectize-input.disabled { 315 opacity: 0.5; 316 background-color: #fafafa; 317} 318