qcg/static/qcg/selectize/selectize.bootstrap3.css

   1 /**
   2  * selectize.bootstrap3.css (v0.12.0) - Bootstrap 3 Theme
   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 .selectize-control.plugin-drag_drop.multi > .selectize-input > div.ui-sortable-placeholder {
  17   visibility: visible !important;
  18   background: #f2f2f2 !important;
  19   background: rgba(0, 0, 0, 0.06) !important;
  20   border: 0 none !important;
  21   -webkit-box-shadow: inset 0 0 12px 4px #ffffff;
  22   box-shadow: inset 0 0 12px 4px #ffffff;
  23 }
  24 .selectize-control.plugin-drag_drop .ui-sortable-placeholder::after {
  25   content: '!';
  26   visibility: hidden;
  27 }
  28 .selectize-control.plugin-drag_drop .ui-sortable-helper {
  29   -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  30   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  31 }
  32 .selectize-dropdown-header {
  33   position: relative;
  34   padding: 3px 12px;
  35   border-bottom: 1px solid #d0d0d0;
  36   background: #f8f8f8;
  37   -webkit-border-radius: 4px 4px 0 0;
  38   -moz-border-radius: 4px 4px 0 0;
  39   border-radius: 4px 4px 0 0;
  40 }
  41 .selectize-dropdown-header-close {
  42   position: absolute;
  43   right: 12px;
  44   top: 50%;
  45   color: #333333;
  46   opacity: 0.4;
  47   margin-top: -12px;
  48   line-height: 20px;
  49   font-size: 20px !important;
  50 }
  51 .selectize-dropdown-header-close:hover {
  52   color: #000000;
  53 }
  54 .selectize-dropdown.plugin-optgroup_columns .optgroup {
  55   border-right: 1px solid #f2f2f2;
  56   border-top: 0 none;
  57   float: left;
  58   -webkit-box-sizing: border-box;
  59   -moz-box-sizing: border-box;
  60   box-sizing: border-box;
  61 }
  62 .selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
  63   border-right: 0 none;
  64 }
  65 .selectize-dropdown.plugin-optgroup_columns .optgroup:before {
  66   display: none;
  67 }
  68 .selectize-dropdown.plugin-optgroup_columns .optgroup-header {
  69   border-top: 0 none;
  70 }
  71 .selectize-control.plugin-remove_button [data-value] {
  72   position: relative;
  73   padding-right: 24px !important;
  74 }
  75 .selectize-control.plugin-remove_button [data-value] .remove {
  76   z-index: 1;
  77   /* fixes ie bug (see #392) */
  78   position: absolute;
  79   top: 0;
  80   right: 0;
  81   bottom: 0;
  82   width: 17px;
  83   text-align: center;
  84   font-weight: bold;
  85   font-size: 12px;
  86   color: inherit;
  87   text-decoration: none;
  88   vertical-align: middle;
  89   display: inline-block;
  90   padding: 1px 0 0 0;
  91   border-left: 1px solid rgba(0, 0, 0, 0);
  92   -webkit-border-radius: 0 2px 2px 0;
  93   -moz-border-radius: 0 2px 2px 0;
  94   border-radius: 0 2px 2px 0;
  95   -webkit-box-sizing: border-box;
  96   -moz-box-sizing: border-box;
  97   box-sizing: border-box;
  98 }
  99 .selectize-control.plugin-remove_button [data-value] .remove:hover {
 100   background: rgba(0, 0, 0, 0.05);
 101 }
 102 .selectize-control.plugin-remove_button [data-value].active .remove {
 103   border-left-color: rgba(0, 0, 0, 0);
 104 }
 105 .selectize-control.plugin-remove_button .disabled [data-value] .remove:hover {
 106   background: none;
 107 }
 108 .selectize-control.plugin-remove_button .disabled [data-value] .remove {
 109   border-left-color: rgba(77, 77, 77, 0);
 110 }
 111 .selectize-control {
 112   position: relative;
 113 }
 114 .selectize-dropdown,
 115 .selectize-input,
 116 .selectize-input input {
 117   color: #333333;
 118   font-family: inherit;
 119   font-size: inherit;
 120   line-height: 20px;
 121   -webkit-font-smoothing: inherit;
 122 }
 123 .selectize-input,
 124 .selectize-control.single .selectize-input.input-active {
 125   background: #ffffff;
 126   cursor: text;
 127   display: inline-block;
 128 }
 129 .selectize-input {
 130   border: 1px solid #cccccc;
 131   padding: 6px 12px;
 132   display: inline-block;
 133   width: 100%;
 134   overflow: hidden;
 135   position: relative;
 136   z-index: 1;
 137   -webkit-box-sizing: border-box;
 138   -moz-box-sizing: border-box;
 139   box-sizing: border-box;
 140   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
 141   box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
 142   -webkit-border-radius: 4px;
 143   -moz-border-radius: 4px;
 144   border-radius: 4px;
 145 }
 146 .selectize-control.multi .selectize-input.has-items {
 147   padding: 5px 12px 2px;
 148 }
 149 .selectize-input.full {
 150   background-color: #ffffff;
 151 }
 152 .selectize-input.disabled,
 153 .selectize-input.disabled * {
 154   cursor: default !important;
 155 }
 156 .selectize-input.focus {
 157   -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
 158   box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
 159 }
 160 .selectize-input.dropdown-active {
 161   -webkit-border-radius: 4px 4px 0 0;
 162   -moz-border-radius: 4px 4px 0 0;
 163   border-radius: 4px 4px 0 0;
 164 }
 165 .selectize-input > * {
 166   vertical-align: baseline;
 167   display: -moz-inline-stack;
 168   display: inline-block;
 169   zoom: 1;
 170   *display: inline;
 171 }
 172 .selectize-control.multi .selectize-input > div {
 173   cursor: pointer;
 174   margin: 0 3px 3px 0;
 175   padding: 1px 3px;
 176   background: #efefef;
 177   color: #333333;
 178   border: 0 solid rgba(0, 0, 0, 0);
 179 }
 180 .selectize-control.multi .selectize-input > div.active {
 181   background: #428bca;
 182   color: #ffffff;
 183   border: 0 solid rgba(0, 0, 0, 0);
 184 }
 185 .selectize-control.multi .selectize-input.disabled > div,
 186 .selectize-control.multi .selectize-input.disabled > div.active {
 187   color: #808080;
 188   background: #ffffff;
 189   border: 0 solid rgba(77, 77, 77, 0);
 190 }
 191 .selectize-input > input {
 192   display: inline-block !important;
 193   padding: 0 !important;
 194   min-height: 0 !important;
 195   max-height: none !important;
 196   max-width: 100% !important;
 197   margin: 0 !important;
 198   text-indent: 0 !important;
 199   border: 0 none !important;
 200   background: none !important;
 201   line-height: inherit !important;
 202   -webkit-user-select: auto !important;
 203   -webkit-box-shadow: none !important;
 204   box-shadow: none !important;
 205 }
 206 .selectize-input > input::-ms-clear {
 207   display: none;
 208 }
 209 .selectize-input > input:focus {
 210   outline: none !important;
 211 }
 212 .selectize-input::after {
 213   content: ' ';
 214   display: block;
 215   clear: left;
 216 }
 217 .selectize-input.dropdown-active::before {
 218   content: ' ';
 219   display: block;
 220   position: absolute;
 221   background: #ffffff;
 222   height: 1px;
 223   bottom: 0;
 224   left: 0;
 225   right: 0;
 226 }
 227 .selectize-dropdown {
 228   position: absolute;
 229   z-index: 10;
 230   border: 1px solid #d0d0d0;
 231   background: #ffffff;
 232   margin: -1px 0 0 0;
 233   border-top: 0 none;
 234   -webkit-box-sizing: border-box;
 235   -moz-box-sizing: border-box;
 236   box-sizing: border-box;
 237   -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
 238   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
 239   -webkit-border-radius: 0 0 4px 4px;
 240   -moz-border-radius: 0 0 4px 4px;
 241   border-radius: 0 0 4px 4px;
 242 }
 243 .selectize-dropdown [data-selectable] {
 244   cursor: pointer;
 245   overflow: hidden;
 246 }
 247 .selectize-dropdown [data-selectable] .highlight {
 248   background: rgba(255, 237, 40, 0.4);
 249   -webkit-border-radius: 1px;
 250   -moz-border-radius: 1px;
 251   border-radius: 1px;
 252 }
 253 .selectize-dropdown [data-selectable],
 254 .selectize-dropdown .optgroup-header {
 255   padding: 3px 12px;
 256 }
 257 .selectize-dropdown .optgroup:first-child .optgroup-header {
 258   border-top: 0 none;
 259 }
 260 .selectize-dropdown .optgroup-header {
 261   color: #777777;
 262   background: #ffffff;
 263   cursor: default;
 264 }
 265 .selectize-dropdown .active {
 266   background-color: #f5f5f5;
 267   color: #262626;
 268 }
 269 .selectize-dropdown .active.create {
 270   color: #262626;
 271 }
 272 .selectize-dropdown .create {
 273   color: rgba(51, 51, 51, 0.5);
 274 }
 275 .selectize-dropdown-content {
 276   overflow-y: auto;
 277   overflow-x: hidden;
 278   max-height: 200px;
 279 }
 280 .selectize-control.single .selectize-input,
 281 .selectize-control.single .selectize-input input {
 282   cursor: pointer;
 283 }
 284 .selectize-control.single .selectize-input.input-active,
 285 .selectize-control.single .selectize-input.input-active input {
 286   cursor: text;
 287 }
 288 .selectize-control.single .selectize-input:after {
 289   content: ' ';
 290   display: block;
 291   position: absolute;
 292   top: 50%;
 293   right: 17px;
 294   margin-top: -3px;
 295   width: 0;
 296   height: 0;
 297   border-style: solid;
 298   border-width: 5px 5px 0 5px;
 299   border-color: #333333 transparent transparent transparent;
 300 }
 301 .selectize-control.single .selectize-input.dropdown-active:after {
 302   margin-top: -4px;
 303   border-width: 0 5px 5px 5px;
 304   border-color: transparent transparent #333333 transparent;
 305 }
 306 .selectize-control.rtl.single .selectize-input:after {
 307   left: 17px;
 308   right: auto;
 309 }
 310 .selectize-control.rtl .selectize-input > input {
 311   margin: 0 4px 0 -2px !important;
 312 }
 313 .selectize-control .selectize-input.disabled {
 314   /*opacity: 0.5;*/
 315   /*background-color: #ffffff;*/
 316     background-color: #eee;
 317 }
 318 .selectize-dropdown,
 319 .selectize-dropdown.form-control {
 320   height: auto;
 321   padding: 0;
 322   margin: 2px 0 0 0;
 323   z-index: 1000;
 324   background: #ffffff;
 325   border: 1px solid #cccccc;
 326   border: 1px solid rgba(0, 0, 0, 0.15);
 327   -webkit-border-radius: 4px;
 328   -moz-border-radius: 4px;
 329   border-radius: 4px;
 330   -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
 331   box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
 332 }
 333 .selectize-dropdown .optgroup-header {
 334   font-size: 12px;
 335   line-height: 1.42857143;
 336 }
 337 .selectize-dropdown .optgroup:first-child:before {
 338   display: none;
 339 }
 340 .selectize-dropdown .optgroup:before {
 341   content: ' ';
 342   display: block;
 343   height: 1px;
 344   margin: 9px 0;
 345   overflow: hidden;
 346   background-color: #e5e5e5;
 347   margin-left: -12px;
 348   margin-right: -12px;
 349 }
 350 .selectize-dropdown-content {
 351   padding: 5px 0;
 352 }
 353 .selectize-dropdown-header {
 354   padding: 6px 12px;
 355 }
 356 .selectize-input {
 357   min-height: 34px;
 358 }
 359 .selectize-input.dropdown-active {
 360   -webkit-border-radius: 4px;
 361   -moz-border-radius: 4px;
 362   border-radius: 4px;
 363 }
 364 .selectize-input.dropdown-active::before {
 365   display: none;
 366 }
 367 .selectize-input.focus {
 368   border-color: #66afe9;
 369   outline: 0;
 370   -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
 371   box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
 372 }
 373 .has-success .selectize-input {
 374   border-color: #3c763d;
 375   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
 376   box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
 377 }
 378 .has-success .selectize-input.focus {
 379   border-color: #2b542c;
 380   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #67b168;
 381   box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #67b168;
 382 }
 383 .has-error .selectize-input {
 384   border-color: #a94442;
 385   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 386   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 387 }
 388 .has-error .selectize-input:focus {
 389   border-color: #843534;
 390   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
 391   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
 392 }
 393 .selectize-control.multi .selectize-input.has-items {
 394   padding-left: 9px;
 395   padding-right: 9px;
 396 }
 397 .selectize-control.multi .selectize-input > div {
 398   -webkit-border-radius: 3px;
 399   -moz-border-radius: 3px;
 400   border-radius: 3px;
 401 }
 402 .form-control.selectize-control {
 403   padding: 0;
 404   height: auto;
 405   border: none;
 406   background: none;
 407   -webkit-box-shadow: none;
 408   box-shadow: none;
 409   -webkit-border-radius: 0;
 410   -moz-border-radius: 0;
 411   border-radius: 0;
 412 }