Introduce shared template for search inputs (#25338)
- Set [type=search](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/search) - Disable spellcheck - Set maxLength 255 that I found in `templates/repo/issue/search.tmpl` - Remove unnecessary `max-width`, it does nothing --------- Co-authored-by: delvh <dev.lh@web.de> Co-authored-by: Giteabot <teabot@gitea.io>
This commit is contained in:
parent
ff90c87c87
commit
af094fbb6c
17 changed files with 24 additions and 23 deletions
|
@ -15,9 +15,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<form class="ui form ignore-dirty" style="max-width: 90%;">
|
<form class="ui form ignore-dirty">
|
||||||
<div class="ui fluid action input">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}..." autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword "AutoFocus" true}}
|
||||||
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -19,9 +19,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<form class="ui form ignore-dirty" style="max-width: 90%">
|
<form class="ui form ignore-dirty">
|
||||||
<div class="ui fluid action input">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}..." autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword "AutoFocus" true}}
|
||||||
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
<div class="ui attached segment">
|
<div class="ui attached segment">
|
||||||
<form class="ui form ignore-dirty">
|
<form class="ui form ignore-dirty">
|
||||||
<div class="ui fluid action input">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Query}}" placeholder="{{.locale.Tr "explore.search"}}..." autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Query "AutoFocus" true}}
|
||||||
<select class="ui dropdown" name="type">
|
<select class="ui dropdown" name="type">
|
||||||
<option value="">{{.locale.Tr "packages.filter.type"}}</option>
|
<option value="">{{.locale.Tr "packages.filter.type"}}</option>
|
||||||
<option value="all">{{.locale.Tr "packages.filter.type.all"}}</option>
|
<option value="all">{{.locale.Tr "packages.filter.type.all"}}</option>
|
||||||
|
|
|
@ -21,9 +21,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<form class="ui form ignore-dirty" style="max-width: 90%">
|
<form class="ui form ignore-dirty">
|
||||||
<div class="ui fluid action input">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}..." autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword "AutoFocus" true}}
|
||||||
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -51,8 +51,8 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Search Text -->
|
<!-- Search Text -->
|
||||||
<div class="ui fluid action input" style="max-width: 70%;">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}..." autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword "AutoFocus" true}}
|
||||||
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<form class="ui form ignore-dirty" style="max-width: 100%">
|
<form class="ui form ignore-dirty" style="max-width: 100%">
|
||||||
<div class="ui fluid action input">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Keyword}}"{{if .CodeIndexerUnavailable}} disabled{{end}} placeholder="{{.locale.Tr "explore.search"}}…" autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword "AutoFocus" true "Disabled" .CodeIndexerUnavailable}}
|
||||||
<div class="ui dropdown selection {{if .CodeIndexerUnavailable}} disabled{{end}}" data-tooltip-content="{{.locale.Tr "explore.search.type.tooltip"}}">
|
<div class="ui dropdown selection {{if .CodeIndexerUnavailable}} disabled{{end}}" data-tooltip-content="{{.locale.Tr "explore.search.type.tooltip"}}">
|
||||||
<input name="t" type="hidden" value="{{.queryType}}"{{if .CodeIndexerUnavailable}} disabled{{end}}>{{svg "octicon-triangle-down" 14 "dropdown icon"}}
|
<input name="t" type="hidden" value="{{.queryType}}"{{if .CodeIndexerUnavailable}} disabled{{end}}>{{svg "octicon-triangle-down" 14 "dropdown icon"}}
|
||||||
<div class="text">{{.locale.Tr (printf "explore.search.%s" (or .queryType "fuzzy"))}}</div>
|
<div class="text">{{.locale.Tr (printf "explore.search.%s" (or .queryType "fuzzy"))}}</div>
|
||||||
|
|
|
@ -21,11 +21,11 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<form class="ui form ignore-dirty" style="max-width: 90%">
|
<form class="ui form ignore-dirty">
|
||||||
<input type="hidden" name="sort" value="{{$.SortType}}">
|
<input type="hidden" name="sort" value="{{$.SortType}}">
|
||||||
<input type="hidden" name="language" value="{{$.Language}}">
|
<input type="hidden" name="language" value="{{$.Language}}">
|
||||||
<div class="ui fluid action input">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}…" autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword "AutoFocus" true}}
|
||||||
{{if .PageIsExploreRepositories}}
|
{{if .PageIsExploreRepositories}}
|
||||||
<input type="hidden" name="only_show_relevant" value="{{.OnlyShowRelevant}}">
|
<input type="hidden" name="only_show_relevant" value="{{.OnlyShowRelevant}}">
|
||||||
{{end}}
|
{{end}}
|
||||||
|
|
|
@ -15,9 +15,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<form class="ui form ignore-dirty" style="max-width: 90%">
|
<form class="ui form ignore-dirty">
|
||||||
<div class="ui fluid action input">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}…" autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword "AutoFocus" true}}
|
||||||
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
{{template "base/alert" .}}
|
{{template "base/alert" .}}
|
||||||
<form class="ui form ignore-dirty">
|
<form class="ui form ignore-dirty">
|
||||||
<div class="ui fluid action input">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Query}}" placeholder="{{.locale.Tr "explore.search"}}..." autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Query "AutoFocus" true}}
|
||||||
<select class="ui dropdown" name="type">
|
<select class="ui dropdown" name="type">
|
||||||
<option value="">{{.locale.Tr "packages.filter.type"}}</option>
|
<option value="">{{.locale.Tr "packages.filter.type"}}</option>
|
||||||
<option value="all">{{.locale.Tr "packages.filter.type.all"}}</option>
|
<option value="all">{{.locale.Tr "packages.filter.type.all"}}</option>
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
<p><a href="{{.PackageDescriptor.PackageWebLink}}">{{.PackageDescriptor.Package.Name}}</a> / <strong>{{.locale.Tr "packages.versions"}}</strong></p>
|
<p><a href="{{.PackageDescriptor.PackageWebLink}}">{{.PackageDescriptor.Package.Name}}</a> / <strong>{{.locale.Tr "packages.versions"}}</strong></p>
|
||||||
<form class="ui form ignore-dirty">
|
<form class="ui form ignore-dirty">
|
||||||
<div class="ui fluid action input">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Query}}" placeholder="{{.locale.Tr "explore.search"}}..." autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Query "AutoFocus" true}}
|
||||||
<select class="ui dropdown" name="sort">
|
<select class="ui dropdown" name="sort">
|
||||||
<option value="version_asc"{{if eq .Sort "version_asc"}} selected="selected"{{end}}>{{.locale.Tr "filter.string.asc"}}</option>
|
<option value="version_asc"{{if eq .Sort "version_asc"}} selected="selected"{{end}}>{{.locale.Tr "filter.string.asc"}}</option>
|
||||||
<option value="version_desc"{{if eq .Sort "version_desc"}} selected="selected"{{end}}>{{.locale.Tr "filter.string.desc"}}</option>
|
<option value="version_desc"{{if eq .Sort "version_desc"}} selected="selected"{{end}}>{{.locale.Tr "filter.string.desc"}}</option>
|
||||||
|
|
|
@ -28,7 +28,7 @@
|
||||||
<form class="list-header-search ui form ignore-dirty">
|
<form class="list-header-search ui form ignore-dirty">
|
||||||
<div class="ui small search fluid action input">
|
<div class="ui small search fluid action input">
|
||||||
<input type="hidden" name="state" value="{{$.State}}">
|
<input type="hidden" name="state" value="{{$.State}}">
|
||||||
<input name="q" value="{{.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}...">
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword}}
|
||||||
<button class="ui small icon button" type="submit" aria-label="{{.locale.Tr "explore.search"}}">
|
<button class="ui small icon button" type="submit" aria-label="{{.locale.Tr "explore.search"}}">
|
||||||
{{svg "octicon-search"}}
|
{{svg "octicon-search"}}
|
||||||
</button>
|
</button>
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
<input type="hidden" name="project" value="{{$.ProjectID}}">
|
<input type="hidden" name="project" value="{{$.ProjectID}}">
|
||||||
<input type="hidden" name="assignee" value="{{$.AssigneeID}}">
|
<input type="hidden" name="assignee" value="{{$.AssigneeID}}">
|
||||||
<input type="hidden" name="poster" value="{{$.PosterID}}">
|
<input type="hidden" name="poster" value="{{$.PosterID}}">
|
||||||
<input name="q" value="{{.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}..." maxlength="255">
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword}}
|
||||||
{{if .PageIsIssueList}}
|
{{if .PageIsIssueList}}
|
||||||
<button id="issue-list-quick-goto" class="ui small icon button gt-hidden" data-tooltip-content="{{.locale.Tr "explore.go_to"}}" data-repo-link="{{.RepoLink}}">{{svg "octicon-hash"}}</button>
|
<button id="issue-list-quick-goto" class="ui small icon button gt-hidden" data-tooltip-content="{{.locale.Tr "explore.go_to"}}" data-repo-link="{{.RepoLink}}">{{svg "octicon-hash"}}</button>
|
||||||
{{end}}
|
{{end}}
|
||||||
|
|
|
@ -35,8 +35,8 @@
|
||||||
<div class="ui attached segment">
|
<div class="ui attached segment">
|
||||||
<form class="ui form ignore-dirty" id="user-list-search-form" action="{{$.Link}}">
|
<form class="ui form ignore-dirty" id="user-list-search-form" action="{{$.Link}}">
|
||||||
<!-- Search Text -->
|
<!-- Search Text -->
|
||||||
<div class="ui fluid action input" style="max-width: 70%;">
|
<div class="ui fluid action input">
|
||||||
<input name="q" value="{{.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}..." autofocus>
|
{{template "shared/searchinput" dict "locale" .locale "Value" .Keyword "AutoFocus" true}}
|
||||||
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
<button class="ui primary button">{{.locale.Tr "explore.search"}}</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
1
templates/shared/searchinput.tmpl
Normal file
1
templates/shared/searchinput.tmpl
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<input type="search" spellcheck="false" name="q" maxlength="255" placeholder="{{.locale.Tr "explore.search"}}…"{{if .Value}} value="{{.Value}}"{{end}}{{if .AutoFocus}} autofocus{{end}}{{if .Disabled}} disabled{{end}}>
|
|
@ -77,7 +77,7 @@
|
||||||
<input type="hidden" name="repos" value="[{{range $.RepoIDs}}{{.}}%2C{{end}}]">
|
<input type="hidden" name="repos" value="[{{range $.RepoIDs}}{{.}}%2C{{end}}]">
|
||||||
<input type="hidden" name="sort" value="{{$.SortType}}">
|
<input type="hidden" name="sort" value="{{$.SortType}}">
|
||||||
<input type="hidden" name="state" value="{{$.State}}">
|
<input type="hidden" name="state" value="{{$.State}}">
|
||||||
<input name="q" value="{{$.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}...">
|
{{template "shared/searchinput" dict "locale" .locale "Value" $.Keyword}}
|
||||||
<button id="issue-list-quick-goto" class="ui small icon button gt-hidden" data-tooltip-content="{{.locale.Tr "explore.go_to"}}">{{svg "octicon-hash"}}</button>
|
<button id="issue-list-quick-goto" class="ui small icon button gt-hidden" data-tooltip-content="{{.locale.Tr "explore.go_to"}}">{{svg "octicon-hash"}}</button>
|
||||||
<button class="ui small icon button" aria-label="{{.locale.Tr "explore.search"}}">{{svg "octicon-search"}}</button>
|
<button class="ui small icon button" aria-label="{{.locale.Tr "explore.search"}}">{{svg "octicon-search"}}</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -51,7 +51,7 @@
|
||||||
<input type="hidden" name="repos" value="[{{range $.RepoIDs}}{{.}},{{end}}]">
|
<input type="hidden" name="repos" value="[{{range $.RepoIDs}}{{.}},{{end}}]">
|
||||||
<input type="hidden" name="sort" value="{{$.SortType}}">
|
<input type="hidden" name="sort" value="{{$.SortType}}">
|
||||||
<input type="hidden" name="state" value="{{$.State}}">
|
<input type="hidden" name="state" value="{{$.State}}">
|
||||||
<input name="q" value="{{$.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}...">
|
{{template "shared/searchinput" dict "locale" .locale "Value" $.Keyword}}
|
||||||
<button class="ui small icon button" type="submit" aria-label="{{.locale.Tr "explore.search"}}">{{svg "octicon-search"}}</button>
|
<button class="ui small icon button" type="submit" aria-label="{{.locale.Tr "explore.search"}}">{{svg "octicon-search"}}</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -16,7 +16,7 @@
|
||||||
</h4>
|
</h4>
|
||||||
<div class="ui attached segment repos-search">
|
<div class="ui attached segment repos-search">
|
||||||
<div class="ui fluid right action left icon input" :class="{loading: isLoading}">
|
<div class="ui fluid right action left icon input" :class="{loading: isLoading}">
|
||||||
<input @input="changeReposFilter(reposFilter)" v-model="searchQuery" ref="search" @keydown="reposFilterKeyControl" :placeholder="textSearchRepos">
|
<input type="search" spellcheck="false" maxlength="255" @input="changeReposFilter(reposFilter)" v-model="searchQuery" ref="search" @keydown="reposFilterKeyControl" :placeholder="textSearchRepos">
|
||||||
<i class="icon gt-df gt-ac gt-jc"><svg-icon name="octicon-search" :size="16"/></i>
|
<i class="icon gt-df gt-ac gt-jc"><svg-icon name="octicon-search" :size="16"/></i>
|
||||||
<div class="ui dropdown icon button" :title="textFilter">
|
<div class="ui dropdown icon button" :title="textFilter">
|
||||||
<svg-icon name="octicon-filter" :size="16"/>
|
<svg-icon name="octicon-filter" :size="16"/>
|
||||||
|
|
Loading…
Reference in a new issue