2 * ============LICENSE_START=======================================================
4 * ================================================================================
5 * Copyright © 2017 AT&T Intellectual Property. All rights reserved.
6 * Copyright © 2017 Amdocs
7 * ================================================================================
8 * Licensed under the Apache License, Version 2.0 (the "License");
9 * you may not use this file except in compliance with the License.
10 * You may obtain a copy of the License at
12 * http://www.apache.org/licenses/LICENSE-2.0
14 * Unless required by applicable law or agreed to in writing, software
15 * distributed under the License is distributed on an "AS IS" BASIS,
16 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
17 * See the License for the specific language governing permissions and
18 * limitations under the License.
19 * ============LICENSE_END=========================================================
21 * ECOMP is a trademark and service mark of AT&T Intellectual Property.
25 .auto-complete-search {
26 display: inline-block;
27 vertical-align: text-bottom;
30 .auto-complete-search-text {
34 .auto-complete-search-button-group{
39 .auto-complete-search input.form-control {
43 .auto-complete-search-button, .auto-complete-search-button:focus {
44 background-color: $light-gray;
48 border: solid 1px $gray;
51 .auto-complete-search button:hover {
52 background-color: $blue;
55 .auto-complete-search .fa-lg {
58 background-color: $light-gray;
61 .auto-complete-search button:hover .fa-search {
63 background-color: $blue;
66 .auto-complete-search .btn-group .auto-complete-clear-button {
70 padding: 5px 12px 8px 12px;
75 filter: alpha(opacity=30);
76 background-color: transparent;
80 .auto-complete-search .auto-complete-clear-button:hover {
81 background-color: transparent;
86 background-color: transparent;
90 .auto-complete-search button:hover .fa-times {
92 background-color: $blue;
95 .react-autosuggest__container {
96 display: inline-block;
100 .react-autosuggest__input{
103 display: inline-block;
106 .react-autosuggest__input:focus {
110 .react-autosuggest__container--open .react-autosuggest__input {
111 border-bottom-left-radius: 0;
112 border-bottom-right-radius: 0;
115 .react-autosuggest__suggestions-container {
123 .react-autosuggest__suggestions-containerCopy{
129 border: 1px solid #aaa;
130 background-color: #fff;
131 border-bottom-left-radius: 4px;
132 border-bottom-right-radius: 4px;
137 .react-autosuggest__container--open .react-autosuggest__suggestions-container {
142 border: 1px solid #aaa;
143 background-color: #fff;
144 border-bottom-left-radius: 4px;
145 border-bottom-right-radius: 4px;
150 .react-autosuggest__suggestions-list {
153 list-style-type: none;
158 .react-autosuggest__suggestion {
163 .react-autosuggest__suggestion--focused {
164 background-color: #ddd;
167 .react-autosuggest__section-title {
168 padding: 10px 0 0 10px;
171 border-top: 1px dashed #ccc;
174 .react-autosuggest__section-container:first-child .react-autosuggest__section-title {
179 .suggestionFlexContainer {
184 .suggestionColumnOne {
188 .suggestionColumnTwo{
193 background-color:inherit;