Use vocabularies from APIs | apply uikit changes to advanced form

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-portal/trunk@45022 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
argiro.kokogiannaki 2016-12-21 16:34:35 +00:00
parent 5b85c7759e
commit bb12a21fe3
6 changed files with 177 additions and 154 deletions

View File

@ -1,4 +1,4 @@
import {Component, Input, Output, EventEmitter} from '@angular/core'; import {Component, Input, Output, EventEmitter, ElementRef} from '@angular/core';
import {Observable} from 'rxjs/Observable'; import {Observable} from 'rxjs/Observable';
import { Subject } from 'rxjs/Subject'; import { Subject } from 'rxjs/Subject';
@ -9,42 +9,40 @@ import {Dates} from '../../utils/string-utils.class';
@Component({ @Component({
selector: 'advanced-search-form', selector: 'advanced-search-form',
template: ` template: `
<form class=""> <form class="uk-form">
<div *ngFor="let selectedField of selectedFields; let i = index" class="form-group form-inline"> <div *ngFor="let selectedField of selectedFields; let i = index" class="uk-form-row ">
<div *ngIf = "i != 0" class="input-group">
<button type="button" id="dropdownMenu1" data-toggle="dropdown" class="uk-button dropdown-toggle" aria-haspopup="true" aria-expanded="true"> <button type="button" class="uk-button uk-button-danger" *ngIf="selectedFields.length > 1" (click)="removeField(i)">
{{selectedField.operatorId}} <i class="uk-icon-minus"></i>
</button> </button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> <div *ngIf = "i != 0" data-uk-dropdown="{mode:'click'}" aria-haspopup="true" aria-expanded="false" class="uk-button-dropdown">
<li *ngFor="let op of operators"> <button class="uk-button">{{selectedField.operatorId}} <i class="uk-icon-caret-down"></i></button>
<a (click)="fieldOperatorChanged(i, op.id, op.id)">{{op.id}}</a> <div class="uk-dropdown uk-dropdown-bottom" aria-hidden="true" style="top: 30px; left: 0px;" tabindex="">
</li> <ul class="uk-nav uk-nav-dropdown">
</ul> <li *ngFor="let op of operators">
</div> <a (click)="fieldOperatorChanged(i, op.id, op.id)">{{op.id}}</a>
<div class="input-group"> </li>
<div class="input-group-btn"> </ul>
<button class="uk-button btn-disabled" type="button"> </div>
</div>
<button class="uk-button uk-button-disabled" type="button">
{{selectedField.name}} {{selectedField.name}}
</button> </button>
</div> <input *ngIf = "fieldIdsMap[selectedField.id].type == 'keyword'" type="text" class="form-control" placeholder="Type keywords..."
<input *ngIf = "fieldIdsMap[selectedField.id].type == 'keyword'" type="text" class="form-control" placeholder="Type keywords..." [(ngModel)]="selectedField.value" name="value[{{i}}]"> [(ngModel)]="selectedField.value" name="value[{{i}}]">
<input *ngIf = "fieldIdsMap[selectedField.id].type == 'year'" type="text" class="form-control" placeholder="Type Year..." [(ngModel)]="selectedField.value" name="value[{{i}}]" (keyup)=validateDate(i,selectedField.value)> <input *ngIf = "fieldIdsMap[selectedField.id].type == 'year'" type="text" class="form-control" placeholder="Type Year..."
<!-- div *ngIf = "fieldIdsMap[selectedField.id].type == 'year' && !selectedField.valid" class="form-control-feedback">Not a valid year. Insert a date between 1000 - 3000</div--> [(ngModel)]="selectedField.value" name="value[{{i}}]" (keyup)=validateDate(i,selectedField.value)>
<static-autocomplete *ngIf = "fieldIdsMap[selectedField.id].type == 'vocabulary'" [(vocabularyId)] = selectedField.param
[(list)] = this.fieldList[selectedField.id] [entityName] = "entityType" [selectedValue]=selectedField.value [showSelected]=true
<div *ngIf = "fieldIdsMap[selectedField.id].type == 'vocabulary'" class="input-group"> [placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false
<static-autocomplete [(vocabularyId)] = selectedField.param [(list)] = this.fieldList[selectedField.id] [entityName] = "entityType" [selectedValue]=selectedField.value [showSelected]=true [placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false (selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)"></static-autocomplete> (selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)"></static-autocomplete>
</div> <static-autocomplete *ngIf = "fieldIdsMap[selectedField.id].type == 'refine'" [(list)] = this.fieldList[selectedField.id] [entityName] = "entityType" [fieldName] = [selectedField.id] [selectedValue]=selectedField.value [showSelected]=true [placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false (selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)"></static-autocomplete>
<div *ngIf = "fieldIdsMap[selectedField.id].type == 'refine'" class="input-group"> <entities-autocomplete *ngIf = "fieldIdsMap[selectedField.id].type == 'entity'" [entityType]=selectedField.param [selectedValue]=selectedField.value [showSelected]=true
<static-autocomplete [(list)] = this.fieldList[selectedField.id] [entityName] = "entityType" [fieldName] = [selectedField.id] [selectedValue]=selectedField.value [showSelected]=true [placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false (selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)"></static-autocomplete>
</div>
<div *ngIf = "fieldIdsMap[selectedField.id].type == 'entity'" class="input-group">
<entities-autocomplete [entityType]=selectedField.param [selectedValue]=selectedField.value [showSelected]=true
[placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false [placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false
(selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)" > (selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)" >
</entities-autocomplete> </entities-autocomplete>
</div>
<div *ngIf = "fieldIdsMap[selectedField.id].type == 'boolean'" class="input-group"> <div *ngIf = "fieldIdsMap[selectedField.id].type == 'boolean'" class="input-group">
<span class="input-group-addon"> <span class="input-group-addon">
<input type="radio" [(ngModel)]="selectedField.value" [name]=selectedField.param value="true">Yes<br> <input type="radio" [(ngModel)]="selectedField.value" [name]=selectedField.param value="true">Yes<br>
@ -53,33 +51,33 @@ import {Dates} from '../../utils/string-utils.class';
<input type="radio" [(ngModel)]="selectedField.value" [name]=selectedField.param value="false">No<br> <input type="radio" [(ngModel)]="selectedField.value" [name]=selectedField.param value="false">No<br>
</span> </span>
</div> </div>
</div>
<button type="button" class="btn btn-danger" *ngIf="selectedFields.length > 1" (click)="removeField(i)">
<span class="glyphicon glyphicon-minus" aria-hidden="true"></span>
</button>
</div> </div>
<div class="form-group form-inline"> <div class="uk-form-row ">
<div class=" input-group">
<div class="input-group-btn"> <div data-uk-dropdown="{mode:'click'}" aria-haspopup="true" aria-expanded="false" class="uk-button-dropdown">
<button aria-expanded="false" aria-haspopup="true" class="uk-button dropdown-toggle" data-toggle="dropdown" id="dropdownMenu1" type="button"> <button class="uk-button"> {{fieldIdsMap[newFieldId].name}} <i class="uk-icon-caret-down"></i></button>
{{fieldIdsMap[newFieldId].name}} <div class="uk-dropdown uk-dropdown-bottom" aria-hidden="true" style="top: 30px; left: 0px;" tabindex="">
</button> <ul class="uk-nav uk-nav-dropdown">
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> <li *ngFor="let id of fieldIds">
<li *ngFor="let id of fieldIds"> <a (click)="fieldIdsChanged(i, id)">{{fieldIdsMap[id].name}}</a>
<a (click)="fieldIdsChanged(i, id)">{{fieldIdsMap[id].name}}</a> </li>
</li> </ul>
</ul> </div>
</div> </div>
<button type="button" class="btn btn-success" (click)="addField()">
<button type="button" class="uk-button uk-button-success" (click)="addField()">
<i class="uk-icon-plus"></i> <i class="uk-icon-plus"></i>
</button> </button>
</div>
</div> </div>
<div class="uk-form-row uk-text-right">
<button (click)="queryChanged()" type="submit" class="uk-button uk-button-primary">Search</button>
</div>
<button (click)="queryChanged()" type="submit" class="uk-button">Search</button>
</form> </form>
` `

View File

@ -10,7 +10,7 @@ import {SearchUtilsClass} from './searchUtils.class';
selector: 'advanced-search-page', selector: 'advanced-search-page',
template: ` template: `
<div class="container"> <div class="uk-margin-top">
<div class="page-header"> <div class="page-header">
<h1>{{pageTitle}}</h1> <h1>{{pageTitle}}</h1>
</div> </div>

View File

@ -10,88 +10,89 @@ import { CacheService } from '../shared/cache.service';
@Injectable() @Injectable()
export class ISVocabulariesService { export class ISVocabulariesService {
// private api ="https://beta.services.openaire.eu/provision/mvc/vocabularies/"; // private api ="https://beta.services.openaire.eu/provision/mvc/vocabularies/";
private api = "http://api.openaire.eu/vocabularies/" // private api = "http://api.openaire.eu/vocabularies/"
private api = "http://dev.openaire.research-infrastructures.eu/vocabularies/";
constructor(private http: Http, public _cache: CacheService) {} constructor(private http: Http, public _cache: CacheService) {}
getVocabularyByType(field:string,entity:string):AutoCompleteValue[]{ getVocabularyByType(field:string,entity:string):any{
console.log("getVocabulary field: "+ field + " for entity: "+ entity); console.log("getVocabulary field: "+ field + " for entity: "+ entity);
var file = ""; var file = "";
var vocabulary = ""; var vocabulary = "";
if( field == "lang"){ if( field == "lang"){
file="languages.json"; // file="languages.json";
return this.getVocabularyFromFile(file); // return this.getVocabularyFromFile(file);
// vocabulary = "dnet:languages.json"; vocabulary = "dnet:languages.json";
// return this.getVocabularyFromService(vocabulary); return this.getVocabularyFromService(vocabulary);
}else if ( field == "type" && (entity == "publication")){ }else if ( field == "type" && (entity == "publication")){
file = "publicationTypes.json"; // file = "publicationTypes.json";
return this.getVocabularyFromFile(file); // return this.getVocabularyFromFile(file);
// vocabulary = "dnet:publication_resource.json"; vocabulary = "dnet:publication_resource.json";
// return this.getVocabularyFromService(vocabulary); return this.getVocabularyFromService(vocabulary);
}else if ( field == "type" && (entity == "dataset")){ }else if ( field == "type" && (entity == "dataset")){
file = "dnet:dataCite_resource.json"; // file = "dnet:dataCite_resource.json";
return this.getVocabularyFromFile(file); // return this.getVocabularyFromFile(file);
// vocabulary = "dnet:dataCite_resource.json"; vocabulary = "dnet:dataCite_resource.json";
// return this.getVocabularyFromService(vocabulary); return this.getVocabularyFromService(vocabulary);
}else if( field == "access" && (entity == "publication" || entity == "dataset")){ }else if( field == "access" && (entity == "publication" || entity == "dataset")){
file= "accessMode.json"; // file= "accessMode.json";
return this.getVocabularyFromFile(file); // return this.getVocabularyFromFile(file);
// vocabulary = "dnet:access_modes.json"; vocabulary = "dnet:access_modes.json";
// return this.getVocabularyFromService(vocabulary); return this.getVocabularyFromService(vocabulary);
} else if( (field == "datasourcetype") && (entity == "dataprovider")){ } else if( (field == "datasourcetype") && (entity == "dataprovider")){
file = "dataProviderType.json"; // file = "dataProviderType.json";
return this.getVocabularyFromFile(file); // return this.getVocabularyFromFile(file);
// vocabulary = "dnet:datasource_typologies.json"; vocabulary = "dnet:datasource_typologies.json";
// return this.getVocabularyFromService(vocabulary); return this.getVocabularyFromService(vocabulary);
} else if( field == "compatibility" && (entity == "dataprovider")){ } else if( field == "compatibility" && (entity == "dataprovider")){
file = "dataProviderCompatibility.json"; // file = "dataProviderCompatibility.json";
return this.getVocabularyFromFile(file); // return this.getVocabularyFromFile(file);
// vocabulary = "dnet:datasourceCompatibilityLevel.json"; vocabulary = "dnet:datasourceCompatibilityLevel.json";
// return this.getVocabularyFromService(vocabulary); return this.getVocabularyFromService(vocabulary);
} else if( field == "country" ){ } else if( field == "country" ){
file = "countries.json"; // file = "countries.json";
return this.getVocabularyFromFile(file); // return this.getVocabularyFromFile(file);
// vocabulary = "dnet:countries.json"; vocabulary = "dnet:countries.json";
// return this.getVocabularyFromService(vocabulary); return this.getVocabularyFromService(vocabulary);
} }
return null; return null;
} }
getVocabularyFromFile (file:string):AutoCompleteValue[] { // getVocabularyFromFile (file:string):AutoCompleteValue[] {
var lang = JSON.parse(JSON.stringify(require('../utils/vocabularies/'+file))); // var lang = JSON.parse(JSON.stringify(require('../utils/vocabularies/'+file)));
return this.parse(lang["terms"]); // return this.parse(lang["terms"]);
} // }
getVocabularyFromService (vocabularyName:string):any { getVocabularyFromService (vocabularyName:string):any {
let url = this.api + vocabularyName; let url = this.api + vocabularyName;
console.log(url); console.log(url);
// let key = url; let key = url;
// if (this._cache.has(key)) { if (this._cache.has(key)) {
// return Observable.of(this._cache.get(key)); return Observable.of(this._cache.get(key));
// } }
return this.http.get(url).toPromise() // return this.http.get(url).toPromise()
.then(request => // .then(request =>
{ // {
request = request.json()['terms']; // request = request.json()['terms'];
var results:AutoCompleteValue[] = this.parse(request); // var results:AutoCompleteValue[] = this.parse(request);
console.log("Get vocabulary : "+ vocabularyName+ " - get " +results.length+ "results"); // console.log("Get vocabulary : "+ vocabularyName+ " - get " +results.length+ "results");
return results; // return results;
}); // });
// return this.http.get(url) return this.http.get(url)
// .do(res => console.log(res)) .do(res => console.log(res))
// .map(res => <any> res.json()) .map(res => <any> res.json())
// .map(res => res['terms']) .map(res => res['terms'])
// .do(res => console.log(res)) .do(res => console.log(res))
// .map(res => this.parse(res)) .map(res => this.parse(res))
// .do(res => console.log(res)) .do(res => console.log(res))
// .catch(this.handleError); .catch(this.handleError)
// // .do(res => { .do(res => {
// // this._cache.set(key, res); this._cache.set(key, res);
// // }); });
} }

View File

@ -14,30 +14,25 @@ import {EntitiesSearchService} from '../services/entitySearch.service';
'(document:click)': 'handleClick($event)', '(document:click)': 'handleClick($event)',
}, },
template: ` template: `
<div class="custom-autocomplete"> <span class="custom-autocomplete">
<div *ngIf = "showSelected && selectedValue != ''"> <span *ngIf = "showSelected && selectedValue != ''">
<div class="row-fluid show-grid auto-complete-choice" *ngFor="let item of selected" > <span class="uk-alert-default" data-uk-alert="" *ngFor="let item of selected" > <span >{{showItem(item)}} </span>
<span >{{showItem(item)}} </span> <span (click)="remove(item)" aria-hidden="true" title="Remove selection" > <i class="uk-icon-remove clickable"></i> </span>
<span (click)="remove(item)" aria-hidden="true" title="Remove selection" ><i class="uk-icon-remove"></i></span> </span>
</div> </span>
</div>
<input *ngIf = "showInput" type="text" class="auto-complete-input validate filter-input input-sm form-control " [placeholder]=placeHolderMessage [(ngModel)]=keyword (keyup)=search() > <input *ngIf = "showInput" type="text" class="auto-complete-input validate filter-input input-sm form-control " [placeholder]=placeHolderMessage [(ngModel)]=keyword (keyup)=search() >
<div *ngIf = "keyword != null && keyword.length > 0 " class="suggestions" > <span *ngIf="showLoading" class="uk-alert uk-alert-primary" data-uk-alert=""> <i class="uk-icon-spinner"></i> Loading... </span>
<div *ngIf="showLoading" class="alert alert-info row-fluid " role="alert">Loading... <span class="glyphicon glyphicon-repeat" aria-hidden="true"></span></div> <span *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning" data-uk-alert=""> {{warningMessage}} <a href="" class="uk-alert-close uk-close"></a></span>
<ul class="uk-list" > <div *ngIf = "keyword != null && keyword.length > 0 " class="uk-dropdown" aria-expanded="true" style="display:block" >
<!--li *ngIf = "numFilteredResults > 0 " class="list-group-item" > <ul class="uk-nav uk-nav-autocomplete uk-autocomplete-results" >
Select: <li *ngFor=" let item of filtered | async">
</li-->
<li class="list-group-item" *ngFor=" let item of filtered | async">
<a (click)="select(item)">{{showItem(item)}}</a> <a (click)="select(item)">{{showItem(item)}}</a>
</li> </li>
</ul> </ul>
</div> </div>
<div class="messages">
<div *ngIf="warningMessage.length > 0" class="alert alert-warning row-fluid " role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>{{warningMessage}}</div> </span>
<!--div *ngIf="numFilteredResults == 0 && keyword.length >=3 " class="alert alert-info row-fluid " role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>No results found</div-->
</div>
</div>
` `
@ -79,7 +74,6 @@ export class EntitiesAutocompleteComponent {
} }
ngOnInit () { ngOnInit () {
console.info("init deposit org" +this.entityType +" "+this.depositType);
if(this.entityType == "project" && this.funderId ){ if(this.entityType == "project" && this.funderId ){
this.filtered = this.searchTermStream this.filtered = this.searchTermStream

View File

@ -12,30 +12,23 @@ import {RefineFieldResultsService} from '../services/refineFieldResults.service'
'(document:click)': 'handleClick($event)', '(document:click)': 'handleClick($event)',
}, },
template: ` template: `
<div class="custom-autocomplete"> <span class="custom-autocomplete">
<div *ngIf = "showSelected && selectedValue != ''"> <span *ngIf = "showSelected && selectedValue != ''">
<div class="row-fluid show-grid auto-complete-choice" *ngFor="let item of selected" > <span class="uk-alert-default" data-uk-alert="" *ngFor="let item of selected" > <span >{{showItem(item)}} </span>
<span >{{showItem(item)}} </span> <span (click)="remove(item)" aria-hidden="true" title="Remove selection" > <i class="uk-icon-remove clickable"></i> </span>
<span (click)="remove(item)" aria-hidden="true" title="Remove selection" class=" remove "><i class="uk-icon-remove"></i></span> </span>
</span>
<input *ngIf = "showInput" type="text" class="auto-complete-input validate filter-input input-sm form-control " [placeholder]=placeHolderMessage [(ngModel)]=keyword (keyup)=filter() >
<span *ngIf="showLoading" class="uk-alert uk-alert-primary" data-uk-alert=""> <i class="uk-icon-spinner"></i> Loading... </span>
<span *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning" data-uk-alert=""> {{warningMessage}} <a href="" class="uk-alert-close uk-close"></a></span>
<div *ngIf="filtered.length > 0" class="uk-dropdown" aria-expanded="true" style="display:block" >
<ul class="uk-nav uk-nav-autocomplete uk-autocomplete-results" >
<li *ngFor=" let item of filtered">
<a (click)="select(item)">{{showItem(item)}}</a>
</li>
</ul>
</div> </div>
</div> </span>
<input *ngIf = "showInput" type="text" class="auto-complete-input validate filter-input input-sm form-control " [placeholder]=placeHolderMessage [(ngModel)]=keyword (keyup)=filter() >
<div class="suggestions" *ngIf="filtered.length > 0">
<ul class="uk-list" >
<li class="list-group-item" >
Select:
</li>
<li class="list-group-item" *ngFor=" let item of filtered">
<a (click)="select(item)">{{showItem(item)}}</a>
</li>
</ul>
</div>
<div class="messages">
<div *ngIf="showLoading" class="alert alert-info row-fluid " role="alert">Loading... <span class="glyphicon glyphicon-repeat" aria-hidden="true"></span></div>
<div *ngIf="warningMessage.length > 0" class="alert alert-warning row-fluid " role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>{{warningMessage}}</div>
<div *ngIf="filtered.length == 0 && keyword.length >=3 " class="alert alert-info row-fluid " role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>No results found</div>
</div>
</div>
` `
}) })
@ -78,10 +71,21 @@ export class StaticAutoCompleteComponent {
this.showLoading = true; this.showLoading = true;
if(this.vocabularyId){ if(this.vocabularyId){
this.list = this._vocabulariesService.getVocabularyByType(this.vocabularyId, this.entityName); // this.list = this._vocabulariesService.getVocabularyByType(this.vocabularyId, this.entityName);
this.afterListFetchedActions(); // this.afterListFetchedActions();
this.sub = this._vocabulariesService.getVocabularyByType(this.vocabularyId, this.entityName).subscribe(
data => {
this.list = data;
this.afterListFetchedActions();
},
err => {
console.log(err);
this.warningMessage = "An Error occured..."
}
);
}else if(this.fieldName && this.entityName){ }else if(this.fieldName && this.entityName){
this.list = this._refineService.getRefineFieldResultsByFieldName(this.fieldName,this.entityName); // this.list = this._refineService.getRefineFieldResultsByFieldName(this.fieldName,this.entityName);
this.sub = this._refineService.getRefineFieldResultsByFieldName(this.fieldName,this.entityName).subscribe( this.sub = this._refineService.getRefineFieldResultsByFieldName(this.fieldName,this.entityName).subscribe(
data => { data => {
this.list = data; this.list = data;
@ -152,10 +156,14 @@ export class StaticAutoCompleteComponent {
} }
remove(item:any){ remove(item:any){
var index:number =this.checkIfExists(item,this.selected); var index:number =this.checkIfExists(item,this.selected);
console.info("try to remove: index = "+index + " length: "+this.selected.length);
if (index > -1) { if (index > -1) {
this.selected.splice(index, 1); this.selected.splice(index, 1);
} }
console.info("after remove: length: "+this.selected.length);
if(!this.multipleSelections && this.selected.length == 0 ){ if(!this.multipleSelections && this.selected.length == 0 ){
console.info("no multiselections ");
this.showInput = true; this.showInput = true;
this.selectedValue = ""; this.selectedValue = "";
this.selectedValueChanged.emit({ this.selectedValueChanged.emit({

View File

@ -72,6 +72,28 @@
</script> </script>
<!-- End of Google sitelinks search markup--> <!-- End of Google sitelinks search markup-->
<style> <style>
.custom-autocomplete .uk-nav-autocomplete > li > a:hover {
background: #00a8e6 none repeat scroll 0 0;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.05) inset;
color: #FFF;
outline: medium none;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
}
.custom-autocomplete .uk-nav-navbar > li > a {
color: #444;
}
.uk-alert-default {
background: #fff none repeat scroll 0 0;
border: 1px solid #ddd;
border-radius: 4px;
color: #444;
height: 30px;
max-width: 100%;
padding: 4px 6px;
}
.custom-hidden-dropdown-menu {position:static !important;} .custom-hidden-dropdown-menu {position:static !important;}
.searchFilterBoxValues {overflow:auto; max-height:200px; } .searchFilterBoxValues {overflow:auto; max-height:200px; }
.selected-filters-box {margin:5px; background-color:#F8F8F8; } .selected-filters-box {margin:5px; background-color:#F8F8F8; }