energylink/public/app/core/components/search/search.html

<div class="search-backdrop" ng-if="ctrl.isOpen"></div>

<div class="search-container" ng-if="ctrl.isOpen">

	<div class="search-field-wrapper">

		<input type="text" placeholder="Find dashboards by name" give-focus="ctrl.giveSearchFocus" tabindex="1"
						ng-keydown="ctrl.keyDown($event)"
						ng-model="ctrl.query.query"
						ng-model-options="{ debounce: 500 }"
						spellcheck='false'
						ng-change="ctrl.search()"
						ng-blur="ctrl.searchInputBlur()"
						/>

		<div class="search-switches">
			<i class="fa fa-filter"></i>
			<a class="pointer" href="javascript:void 0;" ng-click="ctrl.showStarred()" tabindex="2">
				<i class="fa fa-remove" ng-show="ctrl.query.starred"></i>
				starred
			</a> |
			<a class="pointer" href="javascript:void 0;" ng-click="ctrl.getTags()" tabindex="3">
				<i class="fa fa-remove" ng-show="ctrl.tagsMode"></i>
				tags
			</a>
			<span ng-if="ctrl.query.tag.length">
				|
				<span ng-repeat="tagName in ctrl.query.tag">
					<a ng-click="ctrl.removeTag(tagName, $event)" tag-color-from-name="tagName" class="label label-tag">
						<i class="fa fa-remove"></i>
						{{tagName}}
					</a>
				</span>
			</span>
		</div>

		<div class="search-field-spacer"></div>
	</div>

	<div class="search-dropdown" ng-class="{'search-dropdown--fade-in': ctrl.openCompleted}">
		<div class="search-results-container" ng-if="ctrl.tagsMode">
			<div ng-repeat="tag in ctrl.results" class="pointer" style="width: 180px; float: left;"
				ng-class="{'selected': $index === ctrl.selectedIndex }"
				ng-click="ctrl.filterByTag(tag.term, $event)">
				<a class="search-result-tag label label-tag" tag-color-from-name="tag.term">
					<i class="fa fa-tag"></i>
					<span>{{tag.term}} &nbsp;({{tag.count}})</span>
				</a>
			</div>
		</div>

		<div class="search-results-container" ng-if="!ctrl.tagsMode">
			<h6 ng-hide="ctrl.results.length">No dashboards matching your query were found.</h6>

    <div ng-repeat="row in ctrl.results">
      <a class="search-item search-item--{{::row.type}}" ng-class="{'selected': $index == ctrl.selectedIndex}" ng-href="{{row.url}}">
        <span class="search-result-tags">
          <span ng-click="ctrl.filterByTag(tag, $event)" ng-repeat="tag in row.tags" tag-color-from-name="tag"  class="label label-tag">
            {{tag}}
          </span>
          <i class="fa" ng-class="{'fa-star': row.isStarred, 'fa-star-o': !row.isStarred}"></i>
        </span>

        <span class="search-result-link">
          <i class="fa search-result-icon"></i>
          {{::row.title}}
        </span>
      </a>
    </div>
	</div>
</div>