Resolve "Move filter dropdown from Font Awesome to our own icons"
This commit is contained in:
parent
a2a00a5e6d
commit
caf28f661c
|
@ -5,7 +5,7 @@ const tokenKeys = [{
|
||||||
type: 'string',
|
type: 'string',
|
||||||
param: 'status',
|
param: 'status',
|
||||||
symbol: '',
|
symbol: '',
|
||||||
icon: 'signal',
|
icon: 'messages',
|
||||||
tag: 'status',
|
tag: 'status',
|
||||||
}];
|
}];
|
||||||
|
|
||||||
|
|
|
@ -62,7 +62,7 @@ export default class DropdownHint extends FilteredSearchDropdown {
|
||||||
renderContent() {
|
renderContent() {
|
||||||
const dropdownData = this.tokenKeys.get()
|
const dropdownData = this.tokenKeys.get()
|
||||||
.map(tokenKey => ({
|
.map(tokenKey => ({
|
||||||
icon: `fa-${tokenKey.icon}`,
|
icon: `${gon.sprite_icons}#${tokenKey.icon}`,
|
||||||
hint: tokenKey.key,
|
hint: tokenKey.key,
|
||||||
tag: `:${tokenKey.tag}`,
|
tag: `:${tokenKey.tag}`,
|
||||||
type: tokenKey.type,
|
type: tokenKey.type,
|
||||||
|
|
|
@ -19,14 +19,14 @@ export const tokenKeys = [{
|
||||||
type: 'string',
|
type: 'string',
|
||||||
param: 'title',
|
param: 'title',
|
||||||
symbol: '%',
|
symbol: '%',
|
||||||
icon: 'clock-o',
|
icon: 'clock',
|
||||||
tag: '%milestone',
|
tag: '%milestone',
|
||||||
}, {
|
}, {
|
||||||
key: 'label',
|
key: 'label',
|
||||||
type: 'array',
|
type: 'array',
|
||||||
param: 'name[]',
|
param: 'name[]',
|
||||||
symbol: '~',
|
symbol: '~',
|
||||||
icon: 'tag',
|
icon: 'labels',
|
||||||
tag: '~label',
|
tag: '~label',
|
||||||
}];
|
}];
|
||||||
|
|
||||||
|
@ -37,7 +37,7 @@ if (gon.current_user_id) {
|
||||||
type: 'string',
|
type: 'string',
|
||||||
param: 'emoji',
|
param: 'emoji',
|
||||||
symbol: '',
|
symbol: '',
|
||||||
icon: 'thumbs-up',
|
icon: 'thumb-up',
|
||||||
tag: 'emoji',
|
tag: 'emoji',
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -389,9 +389,8 @@
|
||||||
.btn {
|
.btn {
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
|
|
||||||
.fa {
|
svg {
|
||||||
width: 15px;
|
margin-right: $gl-padding-8;
|
||||||
line-height: $line-height-base;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.dropdown-label-box {
|
.dropdown-label-box {
|
||||||
|
|
|
@ -69,7 +69,7 @@
|
||||||
%ul{ data: { dropdown: true } }
|
%ul{ data: { dropdown: true } }
|
||||||
%li.filter-dropdown-item{ data: { action: 'submit' } }
|
%li.filter-dropdown-item{ data: { action: 'submit' } }
|
||||||
= button_tag class: %w[btn btn-link] do
|
= button_tag class: %w[btn btn-link] do
|
||||||
= icon('search')
|
= sprite_icon('search')
|
||||||
%span
|
%span
|
||||||
= _('Press Enter or click to search')
|
= _('Press Enter or click to search')
|
||||||
%ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
|
%ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
|
||||||
|
@ -77,7 +77,8 @@
|
||||||
= button_tag class: %w[btn btn-link] do
|
= button_tag class: %w[btn btn-link] do
|
||||||
-# Encapsulate static class name `{{icon}}` inside #{} to bypass
|
-# Encapsulate static class name `{{icon}}` inside #{} to bypass
|
||||||
-# haml lint's ClassAttributeWithStaticValue
|
-# haml lint's ClassAttributeWithStaticValue
|
||||||
%i.fa{ class: "#{'{{icon}}'}" }
|
%svg
|
||||||
|
%use{ 'xlink:href': "#{'{{icon}}'}" }
|
||||||
%span.js-filter-hint
|
%span.js-filter-hint
|
||||||
{{hint}}
|
{{hint}}
|
||||||
%span.js-filter-tag.dropdown-light-content
|
%span.js-filter-tag.dropdown-light-content
|
||||||
|
|
|
@ -34,7 +34,7 @@
|
||||||
%ul{ data: { dropdown: true } }
|
%ul{ data: { dropdown: true } }
|
||||||
%li.filter-dropdown-item{ data: { action: 'submit' } }
|
%li.filter-dropdown-item{ data: { action: 'submit' } }
|
||||||
%button.btn.btn-link
|
%button.btn.btn-link
|
||||||
= icon('search')
|
= sprite_icon('search')
|
||||||
%span
|
%span
|
||||||
Press Enter or click to search
|
Press Enter or click to search
|
||||||
%ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
|
%ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
|
||||||
|
@ -42,7 +42,8 @@
|
||||||
%button.btn.btn-link
|
%button.btn.btn-link
|
||||||
-# Encapsulate static class name `{{icon}}` inside #{} to bypass
|
-# Encapsulate static class name `{{icon}}` inside #{} to bypass
|
||||||
-# haml lint's ClassAttributeWithStaticValue
|
-# haml lint's ClassAttributeWithStaticValue
|
||||||
%i.fa{ class: "#{'{{icon}}'}" }
|
%svg
|
||||||
|
%use{ 'xlink:href': "#{'{{icon}}'}" }
|
||||||
%span.js-filter-hint
|
%span.js-filter-hint
|
||||||
{{hint}}
|
{{hint}}
|
||||||
%span.js-filter-tag.dropdown-light-content
|
%span.js-filter-tag.dropdown-light-content
|
||||||
|
|
|
@ -0,0 +1,5 @@
|
||||||
|
---
|
||||||
|
title: Updated icons used in filtered search dropdowns
|
||||||
|
merge_request: 21694
|
||||||
|
author:
|
||||||
|
type: changed
|
Loading…
Reference in New Issue