MaDgIK
/
open-science-observatory-ui
13
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed the search bar in the top menu

This commit is contained in:
Stefania Martziou 2021-09-02 09:04:18 +00:00
parent 5ba1503aed
commit d07cc59bd0
2 changed files with 32 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/shared/topmenu/top-menu.component.html
View File

@ -57,11 +57,11 @@
<div class="uk-navbar-center">
<div class="uk-autocomplete uk-form uk-search uk-search-default searchForCountry">
<span id="search-icon" uk-search-icon></span>
<span id="search-icon-mobile" uk-search-icon></span>
<ng-autocomplete
[data]="countriesCollection"
[searchKeyword]="keyword"
placeHolder="Search for a country..."
[placeholder]="'Search for a country...'"
(selected)='selectCountryFromAutocompleteEvent($event)'
(inputChanged)='onChangeSearch($event)'
(inputFocused)='onFocused($event)'
@ -164,7 +164,7 @@
<ng-autocomplete
[data]="countriesCollection"
[searchKeyword]="keyword"
placeHolder="Search for a country..."
[placeholder]="'Search for a country...'"
(selected)='selectCountryFromAutocompleteEvent($event)'
(inputChanged)='onChangeSearch($event)'
(inputFocused)='onFocused($event)'

42
src/assets/css/os-observatory-custom.css
View File

@ -328,6 +328,22 @@ div.indicator span {
border-radius: 3px;
}
.searchForCountry.uk-search.uk-search-default {
width: 100%;
background: #FFFFFF 0% 0% no-repeat padding-box;
border: 1px solid #C7C7C7;
border-radius: 4px;
}
.searchForCountry.uk-search .uk-search-icon {
color: #4687f4;
z-index: 10;
}
.autocomplete-container .input-container input {
padding: 0 15px 0 40px !important;
}
/********* Mock chart for country **********/
.epc_chart {
display: block;
@ -1635,17 +1651,17 @@ hr.entitiesDivider {
color: var(--primary-color);
}
.searchForCountry.uk-search.uk-search-default {
width: 100%;
background: #FFFFFF 0% 0% no-repeat padding-box;
border: 1px solid #C7C7C7;
border-radius: 4px;
}
/*.searchForCountry.uk-search.uk-search-default {*/
/*width: 100%;*/
/*background: #FFFFFF 0% 0% no-repeat padding-box;*/
/*border: 1px solid #C7C7C7;*/
/*border-radius: 4px;*/
/*}*/
.searchForCountry.uk-search .uk-search-icon {
color: #4687f4;
z-index: 10;
}
/*.searchForCountry.uk-search .uk-search-icon {*/
/*color: #4687f4;*/
/*z-index: 10;*/
/*}*/
.progress {
width: 100%;
@ -1743,8 +1759,8 @@ hr.entitiesDivider {
padding: 0px;
}
.autocomplete-container .input-container input {
padding: 0 15px 0 40px !important;
}
/*.autocomplete-container .input-container input {*/
/*padding: 0 15px 0 40px !important;*/
/*}*/
}