diff --git a/app/assets/javascripts/discourse/components/d-editor.js.es6 b/app/assets/javascripts/discourse/components/d-editor.js.es6 index 9fd9e43ef..3b2aa3740 100644 --- a/app/assets/javascripts/discourse/components/d-editor.js.es6 +++ b/app/assets/javascripts/discourse/components/d-editor.js.es6 @@ -21,6 +21,11 @@ function getHead(head, prev) { } } +function getButtonLabel(labelKey, defaultLabel) { + // use the Font Awesome icon if the label matches the default + return I18n.t(labelKey) === defaultLabel ? null : labelKey; +} + const OP = { NONE: 0, REMOVED: 1, @@ -44,6 +49,8 @@ class Toolbar { trimLeading: true, id: 'bold', group: 'fontStyles', + icon: 'bold', + label: getButtonLabel('composer.bold_label', 'B'), shortcut: 'B', perform: e => e.applySurround('**', '**', 'bold_text') }); @@ -52,6 +59,8 @@ class Toolbar { trimLeading: true, id: 'italic', group: 'fontStyles', + icon: 'italic', + label: getButtonLabel('composer.italic_label', 'I'), shortcut: 'I', perform: e => e.applySurround('_', '_', 'italic_text') }); @@ -89,7 +98,8 @@ class Toolbar { this.addButton({ id: 'heading', group: 'extras', - icon: 'font', + icon: 'header', + label: getButtonLabel('composer.heading_label', 'H'), shortcut: 'Alt+1', perform: e => e.applyList('## ', 'heading_text') }); @@ -119,7 +129,8 @@ class Toolbar { const createdButton = { id: button.id, className: button.className || button.id, - icon: button.icon || button.id, + label: button.label, + icon: button.label ? null : button.icon || button.id, action: button.action || 'toolbarButton', perform: button.perform || Ember.K, trimLeading: button.trimLeading diff --git a/app/assets/javascripts/discourse/templates/components/d-editor.hbs b/app/assets/javascripts/discourse/templates/components/d-editor.hbs index 27119b84d..dacde9aa7 100644 --- a/app/assets/javascripts/discourse/templates/components/d-editor.hbs +++ b/app/assets/javascripts/discourse/templates/components/d-editor.hbs @@ -11,7 +11,7 @@