Commit 90215d14 authored by Justin Ho Tuan Duong's avatar Justin Ho Tuan Duong Committed by Paul Slaughter

Replace fa-search with GitLab SVG search icon

- Replace in HAML and Vue files
- Update selectors in specs
- Remove icon definitions in fontawesome_custom.scss
- Add changelog
parent b18cdc7a
......@@ -44,7 +44,6 @@ export default {
type="search"
autocomplete="off"
/>
<i class="fa fa-search dropdown-input-search" aria-hidden="true" data-hidden="true"> </i>
<gl-icon name="search" class="dropdown-input-search" aria-hidden="true" data-hidden="true" />
</div>
</template>
......@@ -96,10 +96,6 @@
content: '\f00c';
}
.fa-search::before {
content: '\f002';
}
.fa-warning::before,
.fa-exclamation-triangle::before {
content: '\f071';
......@@ -221,14 +217,6 @@
content: '\f04b';
}
.fa-search-plus::before {
content: '\f00e';
}
.fa-search-minus::before {
content: '\f010';
}
.fa-share::before {
content: '\f064';
}
......
......@@ -202,7 +202,7 @@ input[type='checkbox']:hover {
.search-icon {
position: absolute;
left: 10px;
top: 10px;
top: 9px;
color: $gray-darkest;
pointer-events: none;
}
......
......@@ -103,7 +103,7 @@ module DropdownsHelper
def dropdown_filter(placeholder, search_id: nil)
content_tag :div, class: "dropdown-input" do
filter_output = search_field_tag search_id, nil, class: "dropdown-input-field qa-dropdown-input-field", placeholder: placeholder, autocomplete: 'off'
filter_output << icon('search', class: "dropdown-input-search")
filter_output << sprite_icon('search', css_class: 'dropdown-input-search')
filter_output << sprite_icon('close', size: 16, css_class: 'dropdown-input-clear js-dropdown-input-clear')
filter_output.html_safe
......
......@@ -8,7 +8,7 @@
- project_name = params[:name].present? ? params[:name] : nil
.search-field-holder
= search_field_tag :name, project_name, class: "form-control search-text-input js-search-input", autofocus: true, spellcheck: false, placeholder: 'Search by name', data: { qa_selector: 'group_search_field' }
= icon("search", class: "search-icon")
= sprite_icon('search', css_class: 'search-icon')
= render "shared/groups/dropdown", options_hash: admin_groups_sort_options_hash
= link_to new_admin_group_path, class: "btn btn-success" do
= _('New group')
......
......@@ -51,7 +51,7 @@
= search_field_tag :search_query, params[:search_query], placeholder: s_('AdminUsers|Search by name, email or username'), class: 'form-control search-text-input js-search-input', spellcheck: false, data: { qa_selector: 'user_search_field' }
- if @sort.present?
= hidden_field_tag :sort, @sort
= icon("search", class: "search-icon")
= sprite_icon('search', css_class: 'search-icon')
= button_tag s_('AdminUsers|Search users') if Rails.env.test?
.dropdown.user-sort-dropdown
= label_tag 'Sort by', nil, class: 'label-bold'
......
......@@ -7,7 +7,7 @@
= form_tag project_network_path(@project, @id), method: :get, class: 'form-inline network-form' do |f|
= text_field_tag :extended_sha1, @options[:extended_sha1], placeholder: _("Git revision"), class: 'search-input form-control input-mx-250 search-sha'
= button_tag class: 'btn btn-success' do
= icon('search')
= sprite_icon('search')
.inline.prepend-left-20
.form-check.light
= check_box_tag :filter_ref, 1, @options[:filter_ref], class: 'form-check-input'
......
......@@ -11,7 +11,7 @@
.position-relative
= search_field_tag :search, params[:search], { placeholder: _('Find existing members by name'), class: 'form-control', spellcheck: false }
%button.user-search-btn{ type: "submit", "aria-label" => _("Submit search") }
= icon("search")
= sprite_icon('search', css_class: 'gl-vertical-align-middle!')
= label_tag :sort_by, _('Sort by'), class: 'col-form-label label-bold px-2'
= render 'shared/members/sort_dropdown'
%ul.content-list.members-list{ data: { qa_selector: 'members_list' } }
......
......@@ -11,7 +11,7 @@
.position-relative
= search_field_tag :search, params[:search], { placeholder: _('Search'), class: 'form-control', spellcheck: false }
%button.user-search-btn{ type: "submit", "aria-label" => _("Submit search") }
= icon("search")
= sprite_icon('search')
.dropdown.inline.user-sort-dropdown
= dropdown_toggle(starrers_sort_options_hash[@sort], { toggle: 'dropdown' })
%ul.dropdown-menu.dropdown-menu-right.dropdown-menu-selectable
......
......@@ -9,7 +9,7 @@
= _("What are you searching for?")
.position-relative
= search_field_tag :search, params[:search], placeholder: _("Search for projects, issues, etc."), class: "form-control search-text-input js-search-input", id: "dashboard_search", autofocus: true, spellcheck: false
= icon("search", class: "search-icon")
= sprite_icon('search', css_class: 'search-icon')
%button.search-clear.js-search-clear{ class: ("hidden" if !params[:search].present?), type: "button", tabindex: "-1" }
= sprite_icon('clear')
%span.sr-only
......
.search_box
.search_glyph
%h4
= icon('search')
= sprite_icon('search', size: 24, css_class: 'gl-vertical-align-text-bottom')
= search_entries_empty_message(@scope, @search_term)
......@@ -16,7 +16,7 @@
= search_field_tag :search, params[:search], { placeholder: _('Filter'), id: 'label-search', class: 'form-control search-text-input input-short', spellcheck: false, autofocus: true }
%span.input-group-append
%button.btn.gl-button.btn-default{ type: "submit", "aria-label" => _('Submit search') }
= icon("search")
= sprite_icon('search')
= render 'shared/labels/sort_dropdown'
- if labels_or_filters && can_admin_label && @project
= link_to _('New label'), new_project_label_path(@project), class: "btn gl-button btn-success qa-label-create-new"
......
......@@ -11,7 +11,7 @@
autofocus: local_assigns[:autofocus]
- if local_assigns[:icon]
= icon("search", class: "search-icon")
= sprite_icon('search', css_class: 'search-icon')
- if params[:sort].present?
= hidden_field_tag :sort, params[:sort]
......
---
title: Replace fa-search with GitLab SVG search icon
merge_request: 43110
author:
type: changed
......@@ -29,7 +29,7 @@ describe('DropdownSearchInputComponent', () => {
});
it('renders search icon element', () => {
expect(wrapper.find('.fa-search.dropdown-input-search').exists()).toBe(true);
expect(wrapper.find('.dropdown-input-search[data-testid="search-icon"]').exists()).toBe(true);
});
it('displays custom placeholder text', () => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment