diff options
Diffstat (limited to 'client/src/app/header/search-typeahead.component.html')
-rw-r--r-- | client/src/app/header/search-typeahead.component.html | 53 |
1 files changed, 16 insertions, 37 deletions
diff --git a/client/src/app/header/search-typeahead.component.html b/client/src/app/header/search-typeahead.component.html index fe3f6ff4d..2623ba337 100644 --- a/client/src/app/header/search-typeahead.component.html +++ b/client/src/app/header/search-typeahead.component.html | |||
@@ -3,17 +3,27 @@ | |||
3 | 3 | ||
4 | <div class="position-absolute jump-to-suggestions"> | 4 | <div class="position-absolute jump-to-suggestions"> |
5 | <!-- suggestions --> | 5 | <!-- suggestions --> |
6 | <ul id="jump-to-results" role="listbox" class="p-0 m-0" #optionsList> | 6 | <my-suggestions *ngIf="hasSearch && newSearch" [results]="results" [highlight]="searchInput.value" (init)="initKeyboardEventsManager($event)" #suggestions></my-suggestions> |
7 | <li *ngFor="let res of results" class="d-flex flex-justify-start flex-items-center p-0 f5" role="option" aria-selected="true"> | 7 | |
8 | <ng-container *ngTemplateOutlet="result; context: {$implicit: res}"></ng-container> | 8 | <!-- suggestion help, not shown until one of the suggestions is selected and specific to that suggestion --> |
9 | </li> | 9 | <div *ngIf="showHelp" id="typeahead-help" class="overflow-hidden"> |
10 | </ul> | 10 | <ng-container *ngIf="activeResult.type === 'search-global'"> |
11 | <div class="d-flex justify-content-between"> | ||
12 | <label class="small-title" i18n>Global search</label> | ||
13 | <div class="advanced-search-status text-muted"> | ||
14 | <span class="mr-1" i18n>using {{ globalSearchIndex }}</span> | ||
15 | <i class="glyphicon glyphicon-globe"></i> | ||
16 | </div> | ||
17 | </div> | ||
18 | <div class="text-muted" i18n>Results will be augmented with those of a third-party index. Only data necessary to make the query will be sent.</div> | ||
19 | </ng-container> | ||
20 | </div> | ||
11 | 21 | ||
12 | <!-- search instructions, when search input is empty --> | 22 | <!-- search instructions, when search input is empty --> |
13 | <div *ngIf="!hasSearch" id="typeahead-instructions" class="overflow-hidden"> | 23 | <div *ngIf="!hasSearch" id="typeahead-instructions" class="overflow-hidden"> |
14 | <div class="d-flex justify-content-between"> | 24 | <div class="d-flex justify-content-between"> |
15 | <label class="small-title" i18n>Advanced search</label> | 25 | <label class="small-title" i18n>Advanced search</label> |
16 | <div class="advanced-search-status"> | 26 | <div class="advanced-search-status c-help"> |
17 | <span [ngClass]="URIPolicy === 'any' ? 'text-success' : 'text-muted'" [title]="URIPolicyText"> | 27 | <span [ngClass]="URIPolicy === 'any' ? 'text-success' : 'text-muted'" [title]="URIPolicyText"> |
18 | <span class="mr-1" i18n>{URIPolicy, select, only-followed {only followed instances} other {any instance}} </span> | 28 | <span class="mr-1" i18n>{URIPolicy, select, only-followed {only followed instances} other {any instance}} </span> |
19 | <i [ngClass]="URIPolicy === 'any' ? 'glyphicon glyphicon-ok-sign' : 'glyphicon glyphicon-exclamation-sign'"></i> | 29 | <i [ngClass]="URIPolicy === 'any' ? 'glyphicon glyphicon-ok-sign' : 'glyphicon glyphicon-exclamation-sign'"></i> |
@@ -36,34 +46,3 @@ | |||
36 | </div> | 46 | </div> |
37 | 47 | ||
38 | </div> | 48 | </div> |
39 | |||
40 | <ng-template #result let-result> | ||
41 | <a tabindex="0" class="d-flex flex-auto flex-items-center p-2" | ||
42 | data-target-type="Repository" | ||
43 | [routerLink]="result.routerLink" | ||
44 | > | ||
45 | <div class="flex-shrink-0 mr-2 text-center"> | ||
46 | <my-global-icon *ngIf="result.type !== 'channel'" iconName="search"></my-global-icon> | ||
47 | <my-global-icon *ngIf="result.type === 'channel'" iconName="folder"></my-global-icon> | ||
48 | </div> | ||
49 | |||
50 | <img class="avatar mr-2 flex-shrink-0 d-none" alt="" aria-label="Team" src="" width="28" height="28"> | ||
51 | |||
52 | <div class="flex-auto overflow-hidden text-left no-wrap css-truncate css-truncate-target" [attr.aria-label]="result.text" [innerHTML]="result.text | highlight : searchInput.value"></div> | ||
53 | |||
54 | <div *ngIf="result.type !== 'channel' && result.type !== 'suggestion'" class="border rounded flex-shrink-0 px-1 bg-gray text-gray-light ml-1 f6"> | ||
55 | <span *ngIf="result.type === 'search-channel'" [attr.aria-label]="inThisChannelText"> | ||
56 | {{ inThisChannelText }} | ||
57 | </span> | ||
58 | <span *ngIf="result.type === 'search-global'" [attr.aria-label]="inAllText"> | ||
59 | {{ inAllText }} | ||
60 | </span> | ||
61 | <span *ngIf="result.type === 'search-any'" aria-hidden="true" class="d-inline-block ml-1 v-align-middle">↵</span> | ||
62 | </div> | ||
63 | |||
64 | <div *ngIf="result.type === 'channel'" aria-hidden="true" class="border rounded flex-shrink-0 px-1 bg-gray text-gray-light ml-1 f6 d-on-nav-focus" i18n> | ||
65 | Jump to channel | ||
66 | <span class="d-inline-block ml-1 v-align-middle">↵</span> | ||
67 | </div> | ||
68 | </a> | ||
69 | </ng-template> \ No newline at end of file | ||