documize/gui/app/templates/components/search/search-results.hbs

<div class="view-search">

	{{#if documents}}
		<div class="text-right">
			{{#ui/ui-toolbar dark=false light=false raised=false large=false bordered=false}}
				{{#ui/ui-toolbar-icon icon=constants.Icon.Sort color=constants.Color.Gray tooltip="Sort"}}
					{{#attach-popover class="ember-attacher-popper" hideOn="click" showOn="click" isShown=false placement="bottom-end" as |attacher|}}
						<i class="dicon {{constants.Icon.Cross}} closer" {{action attacher.hide}} role="button" tabindex="0" title="Close" aria-label="Close" />
						<div class="container">
							<Ui::UiSpacer @size="100" />

							<div class="text-center">
								<ul class="ui-option-picker ui-option-picker-horiz">
									<li class="option {{if sortBy.name "selected"}}" {{action "onSetSort" "name"}} role="button" tabindex="0" aria-label="Sort by name">
										<div class="text">Name</div>
									</li>
									<li class="option {{if sortBy.created "selected"}}" {{action "onSetSort" "created"}} role="button" tabindex="0" aria-label="Sort by created">
										<div class="text">Created date</div>
									</li>
									<li class="option {{if sortBy.updated "selected"}}" {{action "onSetSort" "updated"}} role="button" tabindex="0" aria-label="Sort by revised">
										<div class="text">Last updated</div>
									</li>
								</ul>
							</div>

							<Ui::UiSpacer @size="100" />

							<div class="text-center">
								<ul class="ui-option-picker ui-option-picker-horiz">
									<li class="option {{if sortBy.asc "selected"}}" {{action "onSetSort" "asc"}} role="button" tabindex="0" aria-label="Sort ascending">
										<div class="text">Ascending</div>
									</li>
									<li class="option {{if sortBy.desc "selected"}}" {{action "onSetSort" "desc"}} role="button" tabindex="0" aria-label="Sort descending">
										<div class="text">Descending</div>
									</li>
								</ul>
							</div>

							<Ui::UiSpacer @size="300" />

							{{ui/ui-button
								light=true
								color=constants.Color.Yellow
								label=constants.Label.Sort
								onClick=(action "onSortBy" attacher)}}
						</div>
					{{/attach-popover}}
				{{/ui/ui-toolbar-icon}}
			{{/ui/ui-toolbar}}
		</div>

		<Ui::UiSpacer @size="200" />
	{{/if}}

	<div class="result-summary">{{resultPhrase}}</div>
	<ul class="documents">
		{{#each documents key="id" as |result|}}
			<li class="document">
				{{#link-to "document.index" result.spaceId result.spaceSlug result.documentId result.documentSlug (query-params currentPageId=result.itemId source=searchQuery) class="link"}}
					<div class="title">
						{{result.document}}
						{{#if (gt result.versionId.length 0)}}
							<span class="version">&nbsp;&nbsp;{{result.versionId}}</span>
						{{/if}}
					</div>
					<div class="space">{{result.space}}</div>
					<div class="snippet">{{result.excerpt}}</div>
					{{#if result.template}}
						<div class="template">Template</div>
					{{/if}}
					{{folder/document-tags documentTags=result.tags}}
				{{/link-to}}
			</li>
		{{/each}}
	</ul>

</div>