Ingen beskrivning
Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.

select2-bootstrap4.css 5.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150
  1. .select2-container--bootstrap4 .select2-selection--single {
  2. height: calc(1.5em + 0.75rem + 2px) !important; }
  3. .select2-container--bootstrap4 .select2-selection--single .select2-selection__placeholder {
  4. color: #757575;
  5. line-height: calc(1.5em + 0.75rem); }
  6. .select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow {
  7. position: absolute;
  8. top: 50%;
  9. right: 3px;
  10. width: 20px; }
  11. .select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow b {
  12. top: 60%;
  13. border-color: #343a40 transparent transparent transparent;
  14. border-style: solid;
  15. border-width: 5px 4px 0 4px;
  16. width: 0;
  17. height: 0;
  18. left: 50%;
  19. margin-left: -4px;
  20. margin-top: -2px;
  21. position: absolute; }
  22. .select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered {
  23. line-height: calc(1.5em + 0.75rem); }
  24. .select2-search--dropdown .select2-search__field {
  25. border: 1px solid #ced4da;
  26. border-radius: 0.25rem; }
  27. .select2-results__message {
  28. color: #6c757d; }
  29. .select2-container--bootstrap4 .select2-selection--multiple {
  30. min-height: calc(1.5em + 0.75rem + 2px) !important; }
  31. .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__rendered {
  32. -webkit-box-sizing: border-box;
  33. box-sizing: border-box;
  34. list-style: none;
  35. margin: 0;
  36. padding: 0 5px;
  37. width: 100%; }
  38. .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
  39. color: #343a40;
  40. border: 1px solid #bdc6d0;
  41. border-radius: 0.2rem;
  42. padding: 0;
  43. padding-right: 5px;
  44. cursor: pointer;
  45. float: left;
  46. margin-top: 0.3em;
  47. margin-right: 5px; }
  48. .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove {
  49. color: #bdc6d0;
  50. font-weight: bold;
  51. margin-left: 3px;
  52. margin-right: 1px;
  53. padding-right: 3px;
  54. padding-left: 3px;
  55. float: left; }
  56. .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove:hover {
  57. color: #343a40; }
  58. .select2-container {
  59. display: block; }
  60. .select2-container *:focus {
  61. outline: 0; }
  62. .input-group .select2-container--bootstrap4 {
  63. -webkit-box-flex: 1;
  64. -ms-flex-positive: 1;
  65. flex-grow: 1; }
  66. .input-group-prepend ~ .select2-container--bootstrap4 .select2-selection {
  67. border-top-left-radius: 0;
  68. border-bottom-left-radius: 0; }
  69. .select2-container--bootstrap4 .select2-selection {
  70. border: 1px solid #ced4da;
  71. border-radius: 0.25rem;
  72. width: 100%; }
  73. .select2-container--bootstrap4.select2-container--focus .select2-selection {
  74. border-color: #17a2b8;
  75. -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
  76. box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }
  77. .select2-container--bootstrap4.select2-container--focus.select2-container--open .select2-selection {
  78. border-bottom: none;
  79. border-bottom-left-radius: 0;
  80. border-bottom-right-radius: 0; }
  81. .select2-container--bootstrap4.select2-container--disabled .select2-selection, .select2-container--bootstrap4.select2-container--disabled.select2-container--focus .select2-selection {
  82. background-color: #e9ecef;
  83. cursor: not-allowed;
  84. border-color: #ced4da;
  85. -webkit-box-shadow: none;
  86. box-shadow: none; }
  87. .select2-container--bootstrap4.select2-container--disabled .select2-search__field, .select2-container--bootstrap4.select2-container--disabled.select2-container--focus .select2-search__field {
  88. background-color: transparent; }
  89. select.is-invalid ~ .select2-container--bootstrap4 .select2-selection,
  90. form.was-validated select:invalid ~ .select2-container--bootstrap4 .select2-selection {
  91. border-color: #dc3545; }
  92. select.is-valid ~ .select2-container--bootstrap4 .select2-selection,
  93. form.was-validated select:valid ~ .select2-container--bootstrap4 .select2-selection {
  94. border-color: #28a745; }
  95. .select2-container--bootstrap4 .select2-dropdown {
  96. border-color: #ced4da;
  97. border-top: none;
  98. border-top-left-radius: 0;
  99. border-top-right-radius: 0; }
  100. .select2-container--bootstrap4 .select2-dropdown.select2-dropdown--above {
  101. border-top: 1px solid #ced4da;
  102. border-top-left-radius: 0.25rem;
  103. border-top-right-radius: 0.25rem; }
  104. .select2-container--bootstrap4 .select2-dropdown .select2-results__option[aria-selected=true] {
  105. background-color: #e9ecef; }
  106. .select2-container--bootstrap4 .select2-results__option--highlighted,
  107. .select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected=true] {
  108. background-color: #007bff;
  109. color: #f8f9fa; }
  110. .select2-container--bootstrap4 .select2-results__option[role=group] {
  111. padding: 0; }
  112. .select2-container--bootstrap4 .select2-results > .select2-results__options {
  113. max-height: 15em;
  114. overflow-y: auto; }
  115. .select2-container--bootstrap4 .select2-results__group {
  116. padding: 6px;
  117. display: list-item;
  118. color: #6c757d; }
  119. .select2-container--bootstrap4 .select2-selection__clear {
  120. width: 1.2em;
  121. height: 1.2em;
  122. line-height: 1.15em;
  123. padding-left: 0.3em;
  124. margin-top: 0.5em;
  125. border-radius: 100%;
  126. background-color: #6c757d;
  127. color: #f8f9fa;
  128. float: right;
  129. margin-right: 0.3em; }
  130. .select2-container--bootstrap4 .select2-selection__clear:hover {
  131. background-color: #343a40; }