You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

244 lines
7.3 KiB

  1. /*!
  2. * Angular Material Design
  3. * https://github.com/angular/material
  4. * @license MIT
  5. * v1.1.1
  6. */
  7. @-webkit-keyframes md-autocomplete-list-out {
  8. 0% {
  9. -webkit-animation-timing-function: linear;
  10. animation-timing-function: linear; }
  11. 50% {
  12. opacity: 0;
  13. height: 40px;
  14. -webkit-animation-timing-function: ease-in;
  15. animation-timing-function: ease-in; }
  16. 100% {
  17. height: 0;
  18. opacity: 0; } }
  19. @keyframes md-autocomplete-list-out {
  20. 0% {
  21. -webkit-animation-timing-function: linear;
  22. animation-timing-function: linear; }
  23. 50% {
  24. opacity: 0;
  25. height: 40px;
  26. -webkit-animation-timing-function: ease-in;
  27. animation-timing-function: ease-in; }
  28. 100% {
  29. height: 0;
  30. opacity: 0; } }
  31. @-webkit-keyframes md-autocomplete-list-in {
  32. 0% {
  33. opacity: 0;
  34. height: 0;
  35. -webkit-animation-timing-function: ease-out;
  36. animation-timing-function: ease-out; }
  37. 50% {
  38. opacity: 0;
  39. height: 40px; }
  40. 100% {
  41. opacity: 1;
  42. height: 40px; } }
  43. @keyframes md-autocomplete-list-in {
  44. 0% {
  45. opacity: 0;
  46. height: 0;
  47. -webkit-animation-timing-function: ease-out;
  48. animation-timing-function: ease-out; }
  49. 50% {
  50. opacity: 0;
  51. height: 40px; }
  52. 100% {
  53. opacity: 1;
  54. height: 40px; } }
  55. md-autocomplete {
  56. border-radius: 2px;
  57. display: block;
  58. height: 40px;
  59. position: relative;
  60. overflow: visible;
  61. min-width: 190px; }
  62. md-autocomplete[disabled] input {
  63. cursor: default; }
  64. md-autocomplete[md-floating-label] {
  65. border-radius: 0;
  66. background: transparent;
  67. height: auto; }
  68. md-autocomplete[md-floating-label] md-input-container {
  69. padding-bottom: 0px; }
  70. md-autocomplete[md-floating-label] md-autocomplete-wrap {
  71. height: auto; }
  72. md-autocomplete[md-floating-label] button {
  73. position: absolute;
  74. top: auto;
  75. bottom: 0;
  76. right: 0;
  77. width: 30px;
  78. height: 30px; }
  79. md-autocomplete md-autocomplete-wrap {
  80. display: -webkit-box;
  81. display: -webkit-flex;
  82. display: flex;
  83. -webkit-box-orient: horizontal;
  84. -webkit-box-direction: normal;
  85. -webkit-flex-direction: row;
  86. flex-direction: row;
  87. box-sizing: border-box;
  88. position: relative;
  89. overflow: visible;
  90. height: 40px; }
  91. md-autocomplete md-autocomplete-wrap.md-menu-showing {
  92. z-index: 51; }
  93. md-autocomplete md-autocomplete-wrap md-input-container, md-autocomplete md-autocomplete-wrap input {
  94. -webkit-box-flex: 1;
  95. -webkit-flex: 1 1 0%;
  96. flex: 1 1 0%;
  97. box-sizing: border-box;
  98. min-width: 0; }
  99. md-autocomplete md-autocomplete-wrap md-progress-linear {
  100. position: absolute;
  101. bottom: -2px;
  102. left: 0; }
  103. md-autocomplete md-autocomplete-wrap md-progress-linear.md-inline {
  104. bottom: 40px;
  105. right: 2px;
  106. left: 2px;
  107. width: auto; }
  108. md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate {
  109. position: absolute;
  110. top: 0;
  111. left: 0;
  112. width: 100%;
  113. height: 3px;
  114. -webkit-transition: none;
  115. transition: none; }
  116. md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate .md-container {
  117. -webkit-transition: none;
  118. transition: none;
  119. height: 3px; }
  120. md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-enter {
  121. -webkit-transition: opacity 0.15s linear;
  122. transition: opacity 0.15s linear; }
  123. md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-enter.ng-enter-active {
  124. opacity: 1; }
  125. md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-leave {
  126. -webkit-transition: opacity 0.15s linear;
  127. transition: opacity 0.15s linear; }
  128. md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-leave.ng-leave-active {
  129. opacity: 0; }
  130. md-autocomplete input:not(.md-input) {
  131. font-size: 14px;
  132. box-sizing: border-box;
  133. border: none;
  134. box-shadow: none;
  135. outline: none;
  136. background: transparent;
  137. width: 100%;
  138. padding: 0 15px;
  139. line-height: 40px;
  140. height: 40px; }
  141. md-autocomplete input:not(.md-input)::-ms-clear {
  142. display: none; }
  143. md-autocomplete button {
  144. position: relative;
  145. line-height: 20px;
  146. text-align: center;
  147. width: 30px;
  148. height: 30px;
  149. cursor: pointer;
  150. border: none;
  151. border-radius: 50%;
  152. padding: 0;
  153. font-size: 12px;
  154. background: transparent;
  155. margin: auto 5px; }
  156. md-autocomplete button:after {
  157. content: '';
  158. position: absolute;
  159. top: -6px;
  160. right: -6px;
  161. bottom: -6px;
  162. left: -6px;
  163. border-radius: 50%;
  164. -webkit-transform: scale(0);
  165. transform: scale(0);
  166. opacity: 0;
  167. -webkit-transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  168. transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
  169. md-autocomplete button:focus {
  170. outline: none; }
  171. md-autocomplete button:focus:after {
  172. -webkit-transform: scale(1);
  173. transform: scale(1);
  174. opacity: 1; }
  175. md-autocomplete button md-icon {
  176. position: absolute;
  177. top: 50%;
  178. left: 50%;
  179. -webkit-transform: translate3d(-50%, -50%, 0) scale(0.9);
  180. transform: translate3d(-50%, -50%, 0) scale(0.9); }
  181. md-autocomplete button md-icon path {
  182. stroke-width: 0; }
  183. md-autocomplete button.ng-enter {
  184. -webkit-transform: scale(0);
  185. transform: scale(0);
  186. -webkit-transition: -webkit-transform 0.15s ease-out;
  187. transition: -webkit-transform 0.15s ease-out;
  188. transition: transform 0.15s ease-out;
  189. transition: transform 0.15s ease-out, -webkit-transform 0.15s ease-out; }
  190. md-autocomplete button.ng-enter.ng-enter-active {
  191. -webkit-transform: scale(1);
  192. transform: scale(1); }
  193. md-autocomplete button.ng-leave {
  194. -webkit-transition: -webkit-transform 0.15s ease-out;
  195. transition: -webkit-transform 0.15s ease-out;
  196. transition: transform 0.15s ease-out;
  197. transition: transform 0.15s ease-out, -webkit-transform 0.15s ease-out; }
  198. md-autocomplete button.ng-leave.ng-leave-active {
  199. -webkit-transform: scale(0);
  200. transform: scale(0); }
  201. @media screen and (-ms-high-contrast: active) {
  202. md-autocomplete input {
  203. border: 1px solid #fff; }
  204. md-autocomplete li:focus {
  205. color: #fff; } }
  206. .md-virtual-repeat-container.md-autocomplete-suggestions-container {
  207. position: absolute;
  208. box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
  209. height: 225.5px;
  210. max-height: 225.5px;
  211. z-index: 100; }
  212. .md-virtual-repeat-container.md-not-found {
  213. height: 48px; }
  214. .md-autocomplete-suggestions {
  215. margin: 0;
  216. list-style: none;
  217. padding: 0; }
  218. .md-autocomplete-suggestions li {
  219. font-size: 14px;
  220. overflow: hidden;
  221. padding: 0 15px;
  222. line-height: 48px;
  223. height: 48px;
  224. -webkit-transition: background 0.15s linear;
  225. transition: background 0.15s linear;
  226. margin: 0;
  227. white-space: nowrap;
  228. text-overflow: ellipsis; }
  229. .md-autocomplete-suggestions li:focus {
  230. outline: none; }
  231. .md-autocomplete-suggestions li:not(.md-not-found-wrapper) {
  232. cursor: pointer; }
  233. @media screen and (-ms-high-contrast: active) {
  234. md-autocomplete,
  235. .md-autocomplete-suggestions {
  236. border: 1px solid #fff; } }