1 |
/* @group Base */ |
2 |
.chosen-container { |
3 |
position: relative; |
4 |
display: inline-block; |
5 |
vertical-align: middle; |
6 |
font-size: 13px; |
7 |
zoom: 1; |
8 |
*display: inline; |
9 |
-webkit-user-select: none; |
10 |
-moz-user-select: none; |
11 |
user-select: none; |
12 |
} |
13 |
.chosen-container .chosen-drop { |
14 |
position: absolute; |
15 |
top: 100%; |
16 |
left: -9999px; |
17 |
z-index: 1010; |
18 |
-webkit-box-sizing: border-box; |
19 |
-moz-box-sizing: border-box; |
20 |
box-sizing: border-box; |
21 |
width: 100%; |
22 |
border: 1px solid #aaa; |
23 |
border-top: 0; |
24 |
background: #fff; |
25 |
box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15); |
26 |
} |
27 |
.chosen-container.chosen-with-drop .chosen-drop { |
28 |
left: 0; |
29 |
} |
30 |
.chosen-container a { |
31 |
cursor: pointer; |
32 |
} |
33 |
|
34 |
/* @end */ |
35 |
/* @group Single Chosen */ |
36 |
.chosen-container-single .chosen-single { |
37 |
position: relative; |
38 |
display: block; |
39 |
overflow: hidden; |
40 |
padding: 0 0 0 8px; |
41 |
height: 23px; |
42 |
border: 1px solid #aaa; |
43 |
border-radius: 5px; |
44 |
background-color: #fff; |
45 |
background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #ffffff), color-stop(50%, #f6f6f6), color-stop(52%, #eeeeee), color-stop(100%, #f4f4f4)); |
46 |
background: -webkit-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%); |
47 |
background: -moz-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%); |
48 |
background: -o-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%); |
49 |
background: linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%); |
50 |
background-clip: padding-box; |
51 |
box-shadow: 0 0 3px white inset, 0 1px 1px rgba(0, 0, 0, 0.1); |
52 |
color: #444; |
53 |
text-decoration: none; |
54 |
white-space: nowrap; |
55 |
line-height: 24px; |
56 |
} |
57 |
.chosen-container-single .chosen-default { |
58 |
color: #999; |
59 |
} |
60 |
.chosen-container-single .chosen-single span { |
61 |
display: block; |
62 |
overflow: hidden; |
63 |
margin-right: 26px; |
64 |
text-overflow: ellipsis; |
65 |
white-space: nowrap; |
66 |
} |
67 |
.chosen-container-single .chosen-single-with-deselect span { |
68 |
margin-right: 38px; |
69 |
} |
70 |
.chosen-container-single .chosen-single abbr { |
71 |
position: absolute; |
72 |
top: 6px; |
73 |
right: 26px; |
74 |
display: block; |
75 |
width: 12px; |
76 |
height: 12px; |
77 |
background: url('chosen-sprite.png') -42px 1px no-repeat; |
78 |
font-size: 1px; |
79 |
} |
80 |
.chosen-container-single .chosen-single abbr:hover { |
81 |
background-position: -42px -10px; |
82 |
} |
83 |
.chosen-container-single.chosen-disabled .chosen-single abbr:hover { |
84 |
background-position: -42px -10px; |
85 |
} |
86 |
.chosen-container-single .chosen-single div { |
87 |
position: absolute; |
88 |
top: 0; |
89 |
right: 0; |
90 |
display: block; |
91 |
width: 18px; |
92 |
height: 100%; |
93 |
} |
94 |
.chosen-container-single .chosen-single div b { |
95 |
display: block; |
96 |
width: 100%; |
97 |
height: 100%; |
98 |
background: url('chosen-sprite.png') no-repeat 0px 2px; |
99 |
} |
100 |
.chosen-container-single .chosen-search { |
101 |
position: relative; |
102 |
z-index: 1010; |
103 |
margin: 0; |
104 |
padding: 3px 4px; |
105 |
white-space: nowrap; |
106 |
} |
107 |
.chosen-container-single .chosen-search input[type="text"] { |
108 |
-webkit-box-sizing: border-box; |
109 |
-moz-box-sizing: border-box; |
110 |
box-sizing: border-box; |
111 |
margin: 1px 0; |
112 |
padding: 4px 20px 4px 5px; |
113 |
width: 100%; |
114 |
height: auto; |
115 |
outline: 0; |
116 |
border: 1px solid #aaa; |
117 |
background: white url('chosen-sprite.png') no-repeat 100% -20px; |
118 |
background: url('chosen-sprite.png') no-repeat 100% -20px, -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff)); |
119 |
background: url('chosen-sprite.png') no-repeat 100% -20px, -webkit-linear-gradient(#eeeeee 1%, #ffffff 15%); |
120 |
background: url('chosen-sprite.png') no-repeat 100% -20px, -moz-linear-gradient(#eeeeee 1%, #ffffff 15%); |
121 |
background: url('chosen-sprite.png') no-repeat 100% -20px, -o-linear-gradient(#eeeeee 1%, #ffffff 15%); |
122 |
background: url('chosen-sprite.png') no-repeat 100% -20px, linear-gradient(#eeeeee 1%, #ffffff 15%); |
123 |
font-size: 1em; |
124 |
font-family: sans-serif; |
125 |
line-height: normal; |
126 |
border-radius: 0; |
127 |
} |
128 |
.chosen-container-single .chosen-drop { |
129 |
margin-top: -1px; |
130 |
border-radius: 0 0 4px 4px; |
131 |
background-clip: padding-box; |
132 |
} |
133 |
.chosen-container-single.chosen-container-single-nosearch .chosen-search { |
134 |
position: absolute; |
135 |
left: -9999px; |
136 |
} |
137 |
|
138 |
/* @end */ |
139 |
/* @group Results */ |
140 |
.chosen-container .chosen-results { |
141 |
position: relative; |
142 |
overflow-x: hidden; |
143 |
overflow-y: auto; |
144 |
margin: 0 4px 4px 0; |
145 |
padding: 0 0 0 4px; |
146 |
max-height: 240px; |
147 |
-webkit-overflow-scrolling: touch; |
148 |
} |
149 |
.chosen-container .chosen-results li { |
150 |
display: none; |
151 |
margin: 0; |
152 |
padding: 5px 6px; |
153 |
list-style: none; |
154 |
line-height: 15px; |
155 |
} |
156 |
.chosen-container .chosen-results li.active-result { |
157 |
display: list-item; |
158 |
cursor: pointer; |
159 |
} |
160 |
.chosen-container .chosen-results li.disabled-result { |
161 |
display: list-item; |
162 |
color: #ccc; |
163 |
cursor: default; |
164 |
} |
165 |
.chosen-container .chosen-results li.highlighted { |
166 |
background-color: #3875d7; |
167 |
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #3875d7), color-stop(90%, #2a62bc)); |
168 |
background-image: -webkit-linear-gradient(#3875d7 20%, #2a62bc 90%); |
169 |
background-image: -moz-linear-gradient(#3875d7 20%, #2a62bc 90%); |
170 |
background-image: -o-linear-gradient(#3875d7 20%, #2a62bc 90%); |
171 |
background-image: linear-gradient(#3875d7 20%, #2a62bc 90%); |
172 |
color: #fff; |
173 |
} |
174 |
.chosen-container .chosen-results li.no-results { |
175 |
display: list-item; |
176 |
background: #f4f4f4; |
177 |
} |
178 |
.chosen-container .chosen-results li.group-result { |
179 |
display: list-item; |
180 |
font-weight: bold; |
181 |
cursor: default; |
182 |
} |
183 |
.chosen-container .chosen-results li.group-option { |
184 |
padding-left: 15px; |
185 |
} |
186 |
.chosen-container .chosen-results li em { |
187 |
font-style: normal; |
188 |
text-decoration: underline; |
189 |
} |
190 |
|
191 |
/* @end */ |
192 |
/* @group Multi Chosen */ |
193 |
.chosen-container-multi .chosen-choices { |
194 |
position: relative; |
195 |
overflow: hidden; |
196 |
-webkit-box-sizing: border-box; |
197 |
-moz-box-sizing: border-box; |
198 |
box-sizing: border-box; |
199 |
margin: 0; |
200 |
padding: 0; |
201 |
width: 100%; |
202 |
height: auto !important; |
203 |
height: 1%; |
204 |
border: 1px solid #aaa; |
205 |
background-color: #fff; |
206 |
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff)); |
207 |
background-image: -webkit-linear-gradient(#eeeeee 1%, #ffffff 15%); |
208 |
background-image: -moz-linear-gradient(#eeeeee 1%, #ffffff 15%); |
209 |
background-image: -o-linear-gradient(#eeeeee 1%, #ffffff 15%); |
210 |
background-image: linear-gradient(#eeeeee 1%, #ffffff 15%); |
211 |
cursor: text; |
212 |
} |
213 |
.chosen-container-multi .chosen-choices li { |
214 |
float: left; |
215 |
list-style: none; |
216 |
} |
217 |
.chosen-container-multi .chosen-choices li.search-field { |
218 |
margin: 0; |
219 |
padding: 0; |
220 |
white-space: nowrap; |
221 |
} |
222 |
.chosen-container-multi .chosen-choices li.search-field input[type="text"] { |
223 |
margin: 1px 0; |
224 |
padding: 5px; |
225 |
height: 15px; |
226 |
outline: 0; |
227 |
border: 0 !important; |
228 |
background: transparent !important; |
229 |
box-shadow: none; |
230 |
color: #666; |
231 |
font-size: 100%; |
232 |
font-family: sans-serif; |
233 |
line-height: normal; |
234 |
border-radius: 0; |
235 |
} |
236 |
.chosen-container-multi .chosen-choices li.search-field .default { |
237 |
color: #999; |
238 |
} |
239 |
.chosen-container-multi .chosen-choices li.search-choice { |
240 |
position: relative; |
241 |
margin: 3px 0 3px 5px; |
242 |
padding: 3px 20px 3px 5px; |
243 |
border: 1px solid #aaa; |
244 |
border-radius: 3px; |
245 |
background-color: #e4e4e4; |
246 |
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee)); |
247 |
background-image: -webkit-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); |
248 |
background-image: -moz-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); |
249 |
background-image: -o-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); |
250 |
background-image: linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); |
251 |
background-clip: padding-box; |
252 |
box-shadow: 0 0 2px white inset, 0 1px 0 rgba(0, 0, 0, 0.05); |
253 |
color: #333; |
254 |
line-height: 13px; |
255 |
cursor: default; |
256 |
} |
257 |
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close { |
258 |
position: absolute; |
259 |
top: 4px; |
260 |
right: 3px; |
261 |
display: block; |
262 |
width: 12px; |
263 |
height: 12px; |
264 |
background: url('chosen-sprite.png') -42px 1px no-repeat; |
265 |
font-size: 1px; |
266 |
} |
267 |
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover { |
268 |
background-position: -42px -10px; |
269 |
} |
270 |
.chosen-container-multi .chosen-choices li.search-choice-disabled { |
271 |
padding-right: 5px; |
272 |
border: 1px solid #ccc; |
273 |
background-color: #e4e4e4; |
274 |
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee)); |
275 |
background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); |
276 |
background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); |
277 |
background-image: -o-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); |
278 |
background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); |
279 |
color: #666; |
280 |
} |
281 |
.chosen-container-multi .chosen-choices li.search-choice-focus { |
282 |
background: #d4d4d4; |
283 |
} |
284 |
.chosen-container-multi .chosen-choices li.search-choice-focus .search-choice-close { |
285 |
background-position: -42px -10px; |
286 |
} |
287 |
.chosen-container-multi .chosen-results { |
288 |
margin: 0; |
289 |
padding: 0; |
290 |
} |
291 |
.chosen-container-multi .chosen-drop .result-selected { |
292 |
display: list-item; |
293 |
color: #ccc; |
294 |
cursor: default; |
295 |
} |
296 |
|
297 |
/* @end */ |
298 |
/* @group Active */ |
299 |
.chosen-container-active .chosen-single { |
300 |
border: 1px solid #5897fb; |
301 |
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); |
302 |
} |
303 |
.chosen-container-active.chosen-with-drop .chosen-single { |
304 |
border: 1px solid #aaa; |
305 |
-moz-border-radius-bottomright: 0; |
306 |
border-bottom-right-radius: 0; |
307 |
-moz-border-radius-bottomleft: 0; |
308 |
border-bottom-left-radius: 0; |
309 |
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #eeeeee), color-stop(80%, #ffffff)); |
310 |
background-image: -webkit-linear-gradient(#eeeeee 20%, #ffffff 80%); |
311 |
background-image: -moz-linear-gradient(#eeeeee 20%, #ffffff 80%); |
312 |
background-image: -o-linear-gradient(#eeeeee 20%, #ffffff 80%); |
313 |
background-image: linear-gradient(#eeeeee 20%, #ffffff 80%); |
314 |
box-shadow: 0 1px 0 #fff inset; |
315 |
} |
316 |
.chosen-container-active.chosen-with-drop .chosen-single div { |
317 |
border-left: none; |
318 |
background: transparent; |
319 |
} |
320 |
.chosen-container-active.chosen-with-drop .chosen-single div b { |
321 |
background-position: -18px 2px; |
322 |
} |
323 |
.chosen-container-active .chosen-choices { |
324 |
border: 1px solid #5897fb; |
325 |
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); |
326 |
} |
327 |
.chosen-container-active .chosen-choices li.search-field input[type="text"] { |
328 |
color: #111 !important; |
329 |
} |
330 |
|
331 |
/* @end */ |
332 |
/* @group Disabled Support */ |
333 |
.chosen-disabled { |
334 |
opacity: 0.5 !important; |
335 |
cursor: default; |
336 |
} |
337 |
.chosen-disabled .chosen-single { |
338 |
cursor: default; |
339 |
} |
340 |
.chosen-disabled .chosen-choices .search-choice .search-choice-close { |
341 |
cursor: default; |
342 |
} |
343 |
|
344 |
/* @end */ |
345 |
/* @group Right to Left */ |
346 |
.chosen-rtl { |
347 |
text-align: right; |
348 |
} |
349 |
.chosen-rtl .chosen-single { |
350 |
overflow: visible; |
351 |
padding: 0 8px 0 0; |
352 |
} |
353 |
.chosen-rtl .chosen-single span { |
354 |
margin-right: 0; |
355 |
margin-left: 26px; |
356 |
direction: rtl; |
357 |
} |
358 |
.chosen-rtl .chosen-single-with-deselect span { |
359 |
margin-left: 38px; |
360 |
} |
361 |
.chosen-rtl .chosen-single div { |
362 |
right: auto; |
363 |
left: 3px; |
364 |
} |
365 |
.chosen-rtl .chosen-single abbr { |
366 |
right: auto; |
367 |
left: 26px; |
368 |
} |
369 |
.chosen-rtl .chosen-choices li { |
370 |
float: right; |
371 |
} |
372 |
.chosen-rtl .chosen-choices li.search-field input[type="text"] { |
373 |
direction: rtl; |
374 |
} |
375 |
.chosen-rtl .chosen-choices li.search-choice { |
376 |
margin: 3px 5px 3px 0; |
377 |
padding: 3px 5px 3px 19px; |
378 |
} |
379 |
.chosen-rtl .chosen-choices li.search-choice .search-choice-close { |
380 |
right: auto; |
381 |
left: 4px; |
382 |
} |
383 |
.chosen-rtl.chosen-container-single-nosearch .chosen-search, |
384 |
.chosen-rtl .chosen-drop { |
385 |
left: 9999px; |
386 |
} |
387 |
.chosen-rtl.chosen-container-single .chosen-results { |
388 |
margin: 0 0 4px 4px; |
389 |
padding: 0 4px 0 0; |
390 |
} |
391 |
.chosen-rtl .chosen-results li.group-option { |
392 |
padding-right: 15px; |
393 |
padding-left: 0; |
394 |
} |
395 |
.chosen-rtl.chosen-container-active.chosen-with-drop .chosen-single div { |
396 |
border-right: none; |
397 |
} |
398 |
.chosen-rtl .chosen-search input[type="text"] { |
399 |
padding: 4px 5px 4px 20px; |
400 |
background: white url('chosen-sprite.png') no-repeat -30px -20px; |
401 |
background: url('chosen-sprite.png') no-repeat -30px -20px, -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff)); |
402 |
background: url('chosen-sprite.png') no-repeat -30px -20px, -webkit-linear-gradient(#eeeeee 1%, #ffffff 15%); |
403 |
background: url('chosen-sprite.png') no-repeat -30px -20px, -moz-linear-gradient(#eeeeee 1%, #ffffff 15%); |
404 |
background: url('chosen-sprite.png') no-repeat -30px -20px, -o-linear-gradient(#eeeeee 1%, #ffffff 15%); |
405 |
background: url('chosen-sprite.png') no-repeat -30px -20px, linear-gradient(#eeeeee 1%, #ffffff 15%); |
406 |
direction: rtl; |
407 |
} |
408 |
.chosen-rtl.chosen-container-single .chosen-single div b { |
409 |
background-position: 6px 2px; |
410 |
} |
411 |
.chosen-rtl.chosen-container-single.chosen-with-drop .chosen-single div b { |
412 |
background-position: -12px 2px; |
413 |
} |
414 |
|
415 |
/* @end */ |
416 |
/* @group Retina compatibility */ |
417 |
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 144dpi) { |
418 |
.chosen-rtl .chosen-search input[type="text"], |
419 |
.chosen-container-single .chosen-single abbr, |
420 |
.chosen-container-single .chosen-single div b, |
421 |
.chosen-container-single .chosen-search input[type="text"], |
422 |
.chosen-container-multi .chosen-choices .search-choice .search-choice-close, |
423 |
.chosen-container .chosen-results-scroll-down span, |
424 |
.chosen-container .chosen-results-scroll-up span { |
425 |
background-image: url('chosen-sprite@2x.png') !important; |
426 |
background-size: 52px 37px !important; |
427 |
background-repeat: no-repeat !important; |
428 |
} |
429 |
} |
430 |
/* @end */ |