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.
 
 
 

196 lines
6.6 KiB

/*!
* Angular Material Design
* https://github.com/angular/material
* @license MIT
* v1.1.3
*/
md-autocomplete {
border-radius: 2px;
display: block;
height: 40px;
position: relative;
overflow: visible;
min-width: 190px; }
md-autocomplete[disabled] input {
cursor: default; }
md-autocomplete[md-floating-label] {
border-radius: 0;
background: transparent;
height: auto; }
md-autocomplete[md-floating-label] md-input-container {
padding-bottom: 0; }
md-autocomplete[md-floating-label] md-autocomplete-wrap {
height: auto; }
md-autocomplete[md-floating-label] .md-show-clear-button button {
display: block;
position: absolute;
right: 0;
top: 20px;
width: 30px;
height: 30px; }
md-autocomplete[md-floating-label] .md-show-clear-button input {
padding-right: 30px; }
[dir=rtl] md-autocomplete[md-floating-label] .md-show-clear-button input {
padding-right: 0;
padding-left: 30px; }
md-autocomplete md-autocomplete-wrap {
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
flex-direction: row;
box-sizing: border-box;
position: relative;
overflow: visible;
height: 40px; }
md-autocomplete md-autocomplete-wrap.md-menu-showing {
z-index: 51; }
md-autocomplete md-autocomplete-wrap md-input-container, md-autocomplete md-autocomplete-wrap input {
-webkit-box-flex: 1;
-webkit-flex: 1 1 0%;
flex: 1 1 0%;
box-sizing: border-box;
min-width: 0; }
md-autocomplete md-autocomplete-wrap md-progress-linear {
position: absolute;
bottom: -2px;
left: 0; }
md-autocomplete md-autocomplete-wrap md-progress-linear.md-inline {
bottom: 40px;
right: 2px;
left: 2px;
width: auto; }
md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 3px;
-webkit-transition: none;
transition: none; }
md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate .md-container {
-webkit-transition: none;
transition: none;
height: 3px; }
md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-enter {
-webkit-transition: opacity 0.15s linear;
transition: opacity 0.15s linear; }
md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-enter.ng-enter-active {
opacity: 1; }
md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-leave {
-webkit-transition: opacity 0.15s linear;
transition: opacity 0.15s linear; }
md-autocomplete md-autocomplete-wrap md-progress-linear .md-mode-indeterminate.ng-leave.ng-leave-active {
opacity: 0; }
md-autocomplete input:not(.md-input) {
font-size: 14px;
box-sizing: border-box;
border: none;
box-shadow: none;
outline: none;
background: transparent;
width: 100%;
padding: 0 15px;
line-height: 40px;
height: 40px; }
md-autocomplete input:not(.md-input)::-ms-clear {
display: none; }
md-autocomplete .md-show-clear-button button {
position: relative;
line-height: 20px;
text-align: center;
width: 30px;
height: 30px;
cursor: pointer;
border: none;
border-radius: 50%;
padding: 0;
font-size: 12px;
background: transparent;
margin: auto 5px; }
md-autocomplete .md-show-clear-button button:after {
content: '';
position: absolute;
top: -6px;
right: -6px;
bottom: -6px;
left: -6px;
border-radius: 50%;
-webkit-transform: scale(0);
transform: scale(0);
opacity: 0;
-webkit-transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
md-autocomplete .md-show-clear-button button:focus {
outline: none; }
md-autocomplete .md-show-clear-button button:focus:after {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1; }
md-autocomplete .md-show-clear-button button md-icon {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate3d(-50%, -50%, 0) scale(0.9);
transform: translate3d(-50%, -50%, 0) scale(0.9); }
md-autocomplete .md-show-clear-button button md-icon path {
stroke-width: 0; }
md-autocomplete .md-show-clear-button button.ng-enter {
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: -webkit-transform 0.15s ease-out;
transition: -webkit-transform 0.15s ease-out;
transition: transform 0.15s ease-out;
transition: transform 0.15s ease-out, -webkit-transform 0.15s ease-out; }
md-autocomplete .md-show-clear-button button.ng-enter.ng-enter-active {
-webkit-transform: scale(1);
transform: scale(1); }
md-autocomplete .md-show-clear-button button.ng-leave {
-webkit-transition: -webkit-transform 0.15s ease-out;
transition: -webkit-transform 0.15s ease-out;
transition: transform 0.15s ease-out;
transition: transform 0.15s ease-out, -webkit-transform 0.15s ease-out; }
md-autocomplete .md-show-clear-button button.ng-leave.ng-leave-active {
-webkit-transform: scale(0);
transform: scale(0); }
@media screen and (-ms-high-contrast: active) {
md-autocomplete input {
border: 1px solid #fff; }
md-autocomplete li:focus {
color: #fff; } }
.md-virtual-repeat-container.md-autocomplete-suggestions-container {
position: absolute;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
z-index: 100;
height: 100%; }
.md-virtual-repeat-container.md-not-found {
height: 48px; }
.md-autocomplete-suggestions {
margin: 0;
list-style: none;
padding: 0; }
.md-autocomplete-suggestions li {
font-size: 14px;
overflow: hidden;
padding: 0 15px;
line-height: 48px;
height: 48px;
-webkit-transition: background 0.15s linear;
transition: background 0.15s linear;
margin: 0;
white-space: nowrap;
text-overflow: ellipsis; }
.md-autocomplete-suggestions li:focus {
outline: none; }
.md-autocomplete-suggestions li:not(.md-not-found-wrapper) {
cursor: pointer; }
@media screen and (-ms-high-contrast: active) {
md-autocomplete,
.md-autocomplete-suggestions {
border: 1px solid #fff; } }