diff options
Diffstat (limited to 'app/assets/javascripts/search/topbar/components/app.vue')
-rw-r--r-- | app/assets/javascripts/search/topbar/components/app.vue | 55 |
1 files changed, 27 insertions, 28 deletions
diff --git a/app/assets/javascripts/search/topbar/components/app.vue b/app/assets/javascripts/search/topbar/components/app.vue index 65114ee066e..f27dae8249d 100644 --- a/app/assets/javascripts/search/topbar/components/app.vue +++ b/app/assets/javascripts/search/topbar/components/app.vue @@ -1,17 +1,20 @@ <script> -import { GlForm, GlSearchBoxByType, GlButton } from '@gitlab/ui'; +import { GlSearchBoxByClick } from '@gitlab/ui'; import { mapState, mapActions } from 'vuex'; +import { s__ } from '~/locale'; import GroupFilter from './group_filter.vue'; import ProjectFilter from './project_filter.vue'; export default { name: 'GlobalSearchTopbar', + i18n: { + searchPlaceholder: s__(`GlobalSearch|Search for projects, issues, etc.`), + searchLabel: s__(`GlobalSearch|What are you searching for?`), + }, components: { - GlForm, - GlSearchBoxByType, + GlSearchBoxByClick, GroupFilter, ProjectFilter, - GlButton, }, props: { groupInitialData: { @@ -49,28 +52,24 @@ export default { </script> <template> - <gl-form class="search-page-form" @submit.prevent="applyQuery"> - <section class="gl-lg-display-flex gl-align-items-flex-end"> - <div class="gl-flex-grow-1 gl-mb-4 gl-lg-mb-0 gl-lg-mr-2"> - <label>{{ __('What are you searching for?') }}</label> - <gl-search-box-by-type - id="dashboard_search" - v-model="search" - name="search" - :placeholder="__(`Search for projects, issues, etc.`)" - /> - </div> - <div v-if="showFilters" class="gl-mb-4 gl-lg-mb-0 gl-lg-mx-2"> - <label class="gl-display-block">{{ __('Group') }}</label> - <group-filter :initial-data="groupInitialData" /> - </div> - <div v-if="showFilters" class="gl-mb-4 gl-lg-mb-0 gl-lg-mx-2"> - <label class="gl-display-block">{{ __('Project') }}</label> - <project-filter :initial-data="projectInitialData" /> - </div> - <gl-button class="btn-search gl-lg-ml-2" category="primary" variant="confirm" type="submit" - >{{ __('Search') }} - </gl-button> - </section> - </gl-form> + <section class="search-page-form gl-lg-display-flex gl-align-items-flex-end"> + <div class="gl-flex-grow-1 gl-mb-4 gl-lg-mb-0 gl-lg-mr-2"> + <label>{{ $options.i18n.searchLabel }}</label> + <gl-search-box-by-click + id="dashboard_search" + v-model="search" + name="search" + :placeholder="$options.i18n.searchPlaceholder" + @submit="applyQuery" + /> + </div> + <div v-if="showFilters" class="gl-mb-4 gl-lg-mb-0 gl-lg-mx-2"> + <label class="gl-display-block">{{ __('Group') }}</label> + <group-filter :initial-data="groupInitialData" /> + </div> + <div v-if="showFilters" class="gl-mb-4 gl-lg-mb-0 gl-lg-mx-2"> + <label class="gl-display-block">{{ __('Project') }}</label> + <project-filter :initial-data="projectInitialData" /> + </div> + </section> </template> |