select2.css (17604B)
1 .select2-container { 2 box-sizing: border-box; 3 display: inline-block; 4 margin: 0; 5 position: relative; 6 vertical-align: middle; } 7 .select2-container .select2-selection--single { 8 box-sizing: border-box; 9 cursor: pointer; 10 display: block; 11 height: 28px; 12 user-select: none; 13 -webkit-user-select: none; } 14 .select2-container .select2-selection--single .select2-selection__rendered { 15 display: block; 16 padding-left: 8px; 17 padding-right: 20px; 18 overflow: hidden; 19 text-overflow: ellipsis; 20 white-space: nowrap; } 21 .select2-container .select2-selection--single .select2-selection__clear { 22 position: relative; } 23 .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { 24 padding-right: 8px; 25 padding-left: 20px; } 26 .select2-container .select2-selection--multiple { 27 box-sizing: border-box; 28 cursor: pointer; 29 display: block; 30 min-height: 32px; 31 user-select: none; 32 -webkit-user-select: none; } 33 .select2-container .select2-selection--multiple .select2-selection__rendered { 34 display: inline-block; 35 overflow: hidden; 36 padding-left: 8px; 37 text-overflow: ellipsis; 38 white-space: nowrap; } 39 .select2-container .select2-search--inline { 40 float: left; } 41 .select2-container .select2-search--inline .select2-search__field { 42 box-sizing: border-box; 43 border: none; 44 font-size: 100%; 45 margin-top: 5px; 46 padding: 0; } 47 .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { 48 -webkit-appearance: none; } 49 50 .select2-dropdown { 51 background-color: white; 52 border: 1px solid #aaa; 53 border-radius: 4px; 54 box-sizing: border-box; 55 display: block; 56 position: absolute; 57 left: -100000px; 58 width: 100%; 59 z-index: 1051; } 60 61 .select2-results { 62 display: block; } 63 64 .select2-results__options { 65 list-style: none; 66 margin: 0; 67 padding: 0; } 68 69 .select2-results__option { 70 padding: 6px; 71 user-select: none; 72 -webkit-user-select: none; } 73 .select2-results__option[aria-selected] { 74 cursor: pointer; } 75 76 .select2-container--open .select2-dropdown { 77 left: 0; } 78 79 .select2-container--open .select2-dropdown--above { 80 border-bottom: none; 81 border-bottom-left-radius: 0; 82 border-bottom-right-radius: 0; } 83 84 .select2-container--open .select2-dropdown--below { 85 border-top: none; 86 border-top-left-radius: 0; 87 border-top-right-radius: 0; } 88 89 .select2-search--dropdown { 90 display: block; 91 padding: 4px; } 92 .select2-search--dropdown .select2-search__field { 93 padding: 4px; 94 width: 100%; 95 box-sizing: border-box; } 96 .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { 97 -webkit-appearance: none; } 98 .select2-search--dropdown.select2-search--hide { 99 display: none; } 100 101 .select2-close-mask { 102 border: 0; 103 margin: 0; 104 padding: 0; 105 display: block; 106 position: fixed; 107 left: 0; 108 top: 0; 109 min-height: 100%; 110 min-width: 100%; 111 height: auto; 112 width: auto; 113 opacity: 0; 114 z-index: 99; 115 background-color: #fff; 116 filter: alpha(opacity=0); } 117 118 .select2-hidden-accessible { 119 border: 0 !important; 120 clip: rect(0 0 0 0) !important; 121 height: 1px !important; 122 margin: -1px !important; 123 overflow: hidden !important; 124 padding: 0 !important; 125 position: absolute !important; 126 width: 1px !important; } 127 128 .select2-container--default .select2-selection--single { 129 background-color: #fff; 130 border: 1px solid #aaa; 131 border-radius: 4px; } 132 .select2-container--default .select2-selection--single .select2-selection__rendered { 133 color: #444; 134 line-height: 28px; } 135 .select2-container--default .select2-selection--single .select2-selection__clear { 136 cursor: pointer; 137 float: right; 138 font-weight: bold; } 139 .select2-container--default .select2-selection--single .select2-selection__placeholder { 140 color: #999; } 141 .select2-container--default .select2-selection--single .select2-selection__arrow { 142 height: 26px; 143 position: absolute; 144 top: 1px; 145 right: 1px; 146 width: 20px; } 147 .select2-container--default .select2-selection--single .select2-selection__arrow b { 148 border-color: #888 transparent transparent transparent; 149 border-style: solid; 150 border-width: 5px 4px 0 4px; 151 height: 0; 152 left: 50%; 153 margin-left: -4px; 154 margin-top: -2px; 155 position: absolute; 156 top: 50%; 157 width: 0; } 158 159 .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { 160 float: left; } 161 162 .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { 163 left: 1px; 164 right: auto; } 165 166 .select2-container--default.select2-container--disabled .select2-selection--single { 167 background-color: #eee; 168 cursor: default; } 169 .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { 170 display: none; } 171 172 .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { 173 border-color: transparent transparent #888 transparent; 174 border-width: 0 4px 5px 4px; } 175 176 .select2-container--default .select2-selection--multiple { 177 background-color: white; 178 border: 1px solid #aaa; 179 border-radius: 4px; 180 cursor: text; } 181 .select2-container--default .select2-selection--multiple .select2-selection__rendered { 182 box-sizing: border-box; 183 list-style: none; 184 margin: 0; 185 padding: 0 5px; 186 width: 100%; } 187 .select2-container--default .select2-selection--multiple .select2-selection__rendered li { 188 list-style: none; } 189 .select2-container--default .select2-selection--multiple .select2-selection__placeholder { 190 color: #999; 191 margin-top: 5px; 192 float: left; } 193 .select2-container--default .select2-selection--multiple .select2-selection__clear { 194 cursor: pointer; 195 float: right; 196 font-weight: bold; 197 margin-top: 5px; 198 margin-right: 10px; } 199 .select2-container--default .select2-selection--multiple .select2-selection__choice { 200 background-color: #e4e4e4; 201 border: 1px solid #aaa; 202 border-radius: 4px; 203 cursor: default; 204 float: left; 205 margin-right: 5px; 206 margin-top: 5px; 207 padding: 0 5px; } 208 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { 209 color: #999; 210 cursor: pointer; 211 display: inline-block; 212 font-weight: bold; 213 margin-right: 2px; } 214 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { 215 color: #333; } 216 217 .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { 218 float: right; } 219 220 .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { 221 margin-left: 5px; 222 margin-right: auto; } 223 224 .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { 225 margin-left: 2px; 226 margin-right: auto; } 227 228 .select2-container--default.select2-container--focus .select2-selection--multiple { 229 border: solid black 1px; 230 outline: 0; } 231 232 .select2-container--default.select2-container--disabled .select2-selection--multiple { 233 background-color: #eee; 234 cursor: default; } 235 236 .select2-container--default.select2-container--disabled .select2-selection__choice__remove { 237 display: none; } 238 239 .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { 240 border-top-left-radius: 0; 241 border-top-right-radius: 0; } 242 243 .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { 244 border-bottom-left-radius: 0; 245 border-bottom-right-radius: 0; } 246 247 .select2-container--default .select2-search--dropdown .select2-search__field { 248 border: 1px solid #aaa; } 249 250 .select2-container--default .select2-search--inline .select2-search__field { 251 background: transparent; 252 border: none; 253 outline: 0; 254 box-shadow: none; 255 -webkit-appearance: textfield; } 256 257 .select2-container--default .select2-results > .select2-results__options { 258 max-height: 200px; 259 overflow-y: auto; } 260 261 .select2-container--default .select2-results__option[role=group] { 262 padding: 0; } 263 264 .select2-container--default .select2-results__option[aria-disabled=true] { 265 color: #999; } 266 267 .select2-container--default .select2-results__option[aria-selected=true] { 268 background-color: #ddd; } 269 270 .select2-container--default .select2-results__option .select2-results__option { 271 padding-left: 1em; } 272 .select2-container--default .select2-results__option .select2-results__option .select2-results__group { 273 padding-left: 0; } 274 .select2-container--default .select2-results__option .select2-results__option .select2-results__option { 275 margin-left: -1em; 276 padding-left: 2em; } 277 .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { 278 margin-left: -2em; 279 padding-left: 3em; } 280 .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { 281 margin-left: -3em; 282 padding-left: 4em; } 283 .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { 284 margin-left: -4em; 285 padding-left: 5em; } 286 .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { 287 margin-left: -5em; 288 padding-left: 6em; } 289 290 .select2-container--default .select2-results__option--highlighted[aria-selected] { 291 background-color: #5897fb; 292 color: white; } 293 294 .select2-container--default .select2-results__group { 295 cursor: default; 296 display: block; 297 padding: 6px; } 298 299 .select2-container--classic .select2-selection--single { 300 background-color: #f7f7f7; 301 border: 1px solid #aaa; 302 border-radius: 4px; 303 outline: 0; 304 background-image: -webkit-linear-gradient(top, white 50%, #eeeeee 100%); 305 background-image: -o-linear-gradient(top, white 50%, #eeeeee 100%); 306 background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); 307 background-repeat: repeat-x; 308 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } 309 .select2-container--classic .select2-selection--single:focus { 310 border: 1px solid #5897fb; } 311 .select2-container--classic .select2-selection--single .select2-selection__rendered { 312 color: #444; 313 line-height: 28px; } 314 .select2-container--classic .select2-selection--single .select2-selection__clear { 315 cursor: pointer; 316 float: right; 317 font-weight: bold; 318 margin-right: 10px; } 319 .select2-container--classic .select2-selection--single .select2-selection__placeholder { 320 color: #999; } 321 .select2-container--classic .select2-selection--single .select2-selection__arrow { 322 background-color: #ddd; 323 border: none; 324 border-left: 1px solid #aaa; 325 border-top-right-radius: 4px; 326 border-bottom-right-radius: 4px; 327 height: 26px; 328 position: absolute; 329 top: 1px; 330 right: 1px; 331 width: 20px; 332 background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%); 333 background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%); 334 background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); 335 background-repeat: repeat-x; 336 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } 337 .select2-container--classic .select2-selection--single .select2-selection__arrow b { 338 border-color: #888 transparent transparent transparent; 339 border-style: solid; 340 border-width: 5px 4px 0 4px; 341 height: 0; 342 left: 50%; 343 margin-left: -4px; 344 margin-top: -2px; 345 position: absolute; 346 top: 50%; 347 width: 0; } 348 349 .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { 350 float: left; } 351 352 .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { 353 border: none; 354 border-right: 1px solid #aaa; 355 border-radius: 0; 356 border-top-left-radius: 4px; 357 border-bottom-left-radius: 4px; 358 left: 1px; 359 right: auto; } 360 361 .select2-container--classic.select2-container--open .select2-selection--single { 362 border: 1px solid #5897fb; } 363 .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { 364 background: transparent; 365 border: none; } 366 .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { 367 border-color: transparent transparent #888 transparent; 368 border-width: 0 4px 5px 4px; } 369 370 .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { 371 border-top: none; 372 border-top-left-radius: 0; 373 border-top-right-radius: 0; 374 background-image: -webkit-linear-gradient(top, white 0%, #eeeeee 50%); 375 background-image: -o-linear-gradient(top, white 0%, #eeeeee 50%); 376 background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); 377 background-repeat: repeat-x; 378 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } 379 380 .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { 381 border-bottom: none; 382 border-bottom-left-radius: 0; 383 border-bottom-right-radius: 0; 384 background-image: -webkit-linear-gradient(top, #eeeeee 50%, white 100%); 385 background-image: -o-linear-gradient(top, #eeeeee 50%, white 100%); 386 background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); 387 background-repeat: repeat-x; 388 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } 389 390 .select2-container--classic .select2-selection--multiple { 391 background-color: white; 392 border: 1px solid #aaa; 393 border-radius: 4px; 394 cursor: text; 395 outline: 0; } 396 .select2-container--classic .select2-selection--multiple:focus { 397 border: 1px solid #5897fb; } 398 .select2-container--classic .select2-selection--multiple .select2-selection__rendered { 399 list-style: none; 400 margin: 0; 401 padding: 0 5px; } 402 .select2-container--classic .select2-selection--multiple .select2-selection__clear { 403 display: none; } 404 .select2-container--classic .select2-selection--multiple .select2-selection__choice { 405 background-color: #e4e4e4; 406 border: 1px solid #aaa; 407 border-radius: 4px; 408 cursor: default; 409 float: left; 410 margin-right: 5px; 411 margin-top: 5px; 412 padding: 0 5px; } 413 .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { 414 color: #888; 415 cursor: pointer; 416 display: inline-block; 417 font-weight: bold; 418 margin-right: 2px; } 419 .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { 420 color: #555; } 421 422 .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { 423 float: right; } 424 425 .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { 426 margin-left: 5px; 427 margin-right: auto; } 428 429 .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { 430 margin-left: 2px; 431 margin-right: auto; } 432 433 .select2-container--classic.select2-container--open .select2-selection--multiple { 434 border: 1px solid #5897fb; } 435 436 .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { 437 border-top: none; 438 border-top-left-radius: 0; 439 border-top-right-radius: 0; } 440 441 .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { 442 border-bottom: none; 443 border-bottom-left-radius: 0; 444 border-bottom-right-radius: 0; } 445 446 .select2-container--classic .select2-search--dropdown .select2-search__field { 447 border: 1px solid #aaa; 448 outline: 0; } 449 450 .select2-container--classic .select2-search--inline .select2-search__field { 451 outline: 0; 452 box-shadow: none; } 453 454 .select2-container--classic .select2-dropdown { 455 background-color: white; 456 border: 1px solid transparent; } 457 458 .select2-container--classic .select2-dropdown--above { 459 border-bottom: none; } 460 461 .select2-container--classic .select2-dropdown--below { 462 border-top: none; } 463 464 .select2-container--classic .select2-results > .select2-results__options { 465 max-height: 200px; 466 overflow-y: auto; } 467 468 .select2-container--classic .select2-results__option[role=group] { 469 padding: 0; } 470 471 .select2-container--classic .select2-results__option[aria-disabled=true] { 472 color: grey; } 473 474 .select2-container--classic .select2-results__option--highlighted[aria-selected] { 475 background-color: #3875d7; 476 color: white; } 477 478 .select2-container--classic .select2-results__group { 479 cursor: default; 480 display: block; 481 padding: 6px; } 482 483 .select2-container--classic.select2-container--open .select2-dropdown { 484 border-color: #5897fb; }