2 * selectize.css (v0.12.6)
3 * Copyright (c) 2013–2015 Brian Reavis & contributors
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
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.
14 * @author Brian Reavis <brian@thirdroute.com>
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 #fff;
23 box-shadow: inset 0 0 12px 4px #fff;
25 .selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
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);
33 .selectize-dropdown-header {
36 border-bottom: 1px solid #d0d0d0;
38 -webkit-border-radius: 3px 3px 0 0;
39 -moz-border-radius: 3px 3px 0 0;
40 border-radius: 3px 3px 0 0;
42 .selectize-dropdown-header-close {
50 font-size: 20px !important;
52 .selectize-dropdown-header-close:hover {
55 .selectize-dropdown.plugin-optgroup_columns .optgroup {
56 border-right: 1px solid #f2f2f2;
59 -webkit-box-sizing: border-box;
60 -moz-box-sizing: border-box;
61 box-sizing: border-box;
63 .selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
66 .selectize-dropdown.plugin-optgroup_columns .optgroup:before {
69 .selectize-dropdown.plugin-optgroup_columns .optgroup-header {
72 .selectize-control.plugin-remove_button [data-value] {
74 padding-right: 24px !important;
76 .selectize-control.plugin-remove_button [data-value] .remove {
78 /* fixes ie bug (see #392) */
88 text-decoration: none;
89 vertical-align: middle;
90 display: inline-block;
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;
100 .selectize-control.plugin-remove_button [data-value] .remove:hover {
101 background: rgba(0, 0, 0, 0.05);
103 .selectize-control.plugin-remove_button [data-value].active .remove {
104 border-left-color: #cacaca;
106 .selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
109 .selectize-control.plugin-remove_button .disabled [data-value] .remove {
110 border-left-color: #ffffff;
112 .selectize-control.plugin-remove_button .remove-single {
123 .selectize-input input {
125 font-family: inherit;
128 -webkit-font-smoothing: inherit;
131 .selectize-control.single .selectize-input.input-active {
134 display: inline-block;
137 border: 1px solid #d0d0d0;
139 display: inline-block;
144 -webkit-box-sizing: border-box;
145 -moz-box-sizing: border-box;
146 box-sizing: border-box;
147 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
148 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
149 -webkit-border-radius: 3px;
150 -moz-border-radius: 3px;
153 .selectize-control.multi .selectize-input.has-items {
154 padding: 6px 8px 3px;
156 .selectize-input.full {
157 background-color: #fff;
159 .selectize-input.disabled,
160 .selectize-input.disabled * {
161 cursor: default !important;
163 .selectize-input.focus {
164 -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
165 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
167 .selectize-input.dropdown-active {
168 -webkit-border-radius: 3px 3px 0 0;
169 -moz-border-radius: 3px 3px 0 0;
170 border-radius: 3px 3px 0 0;
172 .selectize-input > * {
173 vertical-align: baseline;
174 display: -moz-inline-stack;
175 display: inline-block;
179 .selectize-control.multi .selectize-input > div {
185 border: 0 solid #d0d0d0;
187 .selectize-control.multi .selectize-input > div.active {
190 border: 0 solid #cacaca;
192 .selectize-control.multi .selectize-input.disabled > div,
193 .selectize-control.multi .selectize-input.disabled > div.active {
196 border: 0 solid #ffffff;
198 .selectize-input > input {
199 display: inline-block !important;
200 padding: 0 !important;
201 min-height: 0 !important;
202 max-height: none !important;
203 max-width: 100% !important;
204 margin: 0 2px 0 0 !important;
205 text-indent: 0 !important;
206 border: 0 none !important;
207 background: none !important;
208 line-height: inherit !important;
209 -webkit-user-select: auto !important;
210 -webkit-box-shadow: none !important;
211 box-shadow: none !important;
213 .selectize-input > input::-ms-clear {
216 .selectize-input > input:focus {
217 outline: none !important;
219 .selectize-input::after {
224 .selectize-input.dropdown-active::before {
234 .selectize-dropdown {
237 border: 1px solid #d0d0d0;
241 -webkit-box-sizing: border-box;
242 -moz-box-sizing: border-box;
243 box-sizing: border-box;
244 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
245 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
246 -webkit-border-radius: 0 0 3px 3px;
247 -moz-border-radius: 0 0 3px 3px;
248 border-radius: 0 0 3px 3px;
250 .selectize-dropdown [data-selectable] {
254 .selectize-dropdown [data-selectable] .highlight {
255 background: rgba(125, 168, 208, 0.2);
256 -webkit-border-radius: 1px;
257 -moz-border-radius: 1px;
260 .selectize-dropdown .option,
261 .selectize-dropdown .optgroup-header {
264 .selectize-dropdown .option,
265 .selectize-dropdown [data-disabled],
266 .selectize-dropdown [data-disabled] [data-selectable].option {
270 .selectize-dropdown [data-selectable].option {
273 .selectize-dropdown .optgroup:first-child .optgroup-header {
276 .selectize-dropdown .optgroup-header {
281 .selectize-dropdown .active {
282 background-color: #f5fafd;
285 .selectize-dropdown .active.create {
288 .selectize-dropdown .create {
289 color: rgba(48, 48, 48, 0.5);
291 .selectize-dropdown-content {
295 -webkit-overflow-scrolling: touch;
297 .selectize-control.single .selectize-input,
298 .selectize-control.single .selectize-input input {
301 .selectize-control.single .selectize-input.input-active,
302 .selectize-control.single .selectize-input.input-active input {
305 .selectize-control.single .selectize-input:after {
315 border-width: 5px 5px 0 5px;
316 border-color: #808080 transparent transparent transparent;
318 .selectize-control.single .selectize-input.dropdown-active:after {
320 border-width: 0 5px 5px 5px;
321 border-color: transparent transparent #808080 transparent;
323 .selectize-control.rtl.single .selectize-input:after {
327 .selectize-control.rtl .selectize-input > input {
328 margin: 0 4px 0 -2px !important;
330 .selectize-control .selectize-input.disabled {
332 background-color: #fafafa;