2 * ============LICENSE_START=======================================================
3 * SPARKY (AAI UI service)
4 * ================================================================================
5 * Copyright © 2017 AT&T Intellectual Property.
6 * Copyright © 2017 Amdocs
8 * ================================================================================
9 * Licensed under the Apache License, Version 2.0 (the "License");
10 * you may not use this file except in compliance with the License.
11 * You may obtain a copy of the License at
13 * http://www.apache.org/licenses/LICENSE-2.0
15 * Unless required by applicable law or agreed to in writing, software
16 * distributed under the License is distributed on an "AS IS" BASIS,
17 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
18 * See the License for the specific language governing permissions and
19 * limitations under the License.
20 * ============LICENSE_END=========================================================
22 * ECOMP and OpenECOMP are trademarks
23 * and service marks of AT&T Intellectual Property.
26 .auto-complete-search {
27 display: inline-block;
28 vertical-align: text-bottom;
31 .auto-complete-search-text {
35 .auto-complete-search-button-group{
40 .auto-complete-search input.form-control {
44 .auto-complete-search-button, .auto-complete-search-button:focus {
45 background-color: $light-gray;
49 border: solid 1px $gray;
52 .auto-complete-search button:hover {
53 background-color: $blue;
56 .auto-complete-search .fa-lg {
59 background-color: $light-gray;
62 .auto-complete-search button:hover .fa-search {
64 background-color: $blue;
67 .auto-complete-search .btn-group .auto-complete-clear-button {
71 padding: 5px 12px 8px 12px;
76 filter: alpha(opacity=30);
77 background-color: transparent;
81 .auto-complete-search .auto-complete-clear-button:hover {
82 background-color: transparent;
87 background-color: transparent;
91 .auto-complete-search button:hover .fa-times {
93 background-color: $blue;
96 .react-autosuggest__container {
97 display: inline-block;
101 .react-autosuggest__input{
104 display: inline-block;
107 .react-autosuggest__input:focus {
111 .react-autosuggest__container--open .react-autosuggest__input {
112 border-bottom-left-radius: 0;
113 border-bottom-right-radius: 0;
116 .react-autosuggest__suggestions-container {
124 .react-autosuggest__suggestions-containerCopy{
130 border: 1px solid #aaa;
131 background-color: #fff;
132 border-bottom-left-radius: 4px;
133 border-bottom-right-radius: 4px;
138 .react-autosuggest__container--open .react-autosuggest__suggestions-container {
143 border: 1px solid #aaa;
144 background-color: #fff;
145 border-bottom-left-radius: 4px;
146 border-bottom-right-radius: 4px;
151 .react-autosuggest__suggestions-list {
154 list-style-type: none;
159 .react-autosuggest__suggestion {
164 .react-autosuggest__suggestion--focused {
165 background-color: #ddd;
168 .react-autosuggest__section-title {
169 padding: 10px 0 0 10px;
172 border-top: 1px dashed #ccc;
175 .react-autosuggest__section-container:first-child .react-autosuggest__section-title {
180 .suggestionFlexContainer {
185 .suggestionColumnOne {
189 .suggestionColumnTwo{
194 background-color:inherit;