Toolbar Icons not working


#1

Hello,

since the Update the my costum Toolbar Icons are away.

i have used this and set the Icons per CSS

.wmd-card-button:before { content: "\f15b"; } .wmd-deck-button:before { content: "\f15c"; }

know someone why this not work anymore?

many greetings
Imperator


#2

The composer has been rewritten, @cpradio worked on the spoiler button : GitHub - cpradio/discourse-plugin-spoiler-ui: Spoiler Composer Button for Discourse to help us update our plugins


#3

Following the plugin, you’ll just have to edit 2 files and keep the rest of the plugin.

If it helps, here an example that should work

import { onToolbarCreate } from 'discourse/components/d-editor';

export default
{
  name: 'spoiler-ui',
  initialize(container)
  {
    const siteSettings = container.lookup('site-settings:main');

    if (siteSettings.spoiler_ui_enabled) {
      onToolbarCreate(toolbar => {
        toolbar.addButton({
          id: "card_ui_button",
          group: "extras",
          icon: "var-file",
          perform: e => e.applySurround('[card]', '[/card]', 'card_ui_default_text')
        });
      });
      
      onToolbarCreate(toolbar => {
        toolbar.addButton({
          id: "deck_ui_button",
          group: "extras",
          icon: "file-text",
          perform: e => e.applySurround('[deck]', '[/deck]', 'deck_ui_default_text')
        });
      });
    }
  }
};

en:
  js:
    composer:
      card_ui_button_title: "Import your card"
      card_ui_default_text: "id of the card"
      deck_ui_button_title: "Import your deck"
      deck_ui_default_text: "id of the deck"

I’ve been able to add my 10 buttons with this method


(cpradio) #4

You will also want to rename spoiler_ui_enabled in plugin.rb, config/settings.yml, and config/locales/server.en.yml, and utilize the updated name in your initializer above where it has siteSettings.spoiler_ui_enabled

Also, change the export default name property, if you have this truly separated from another plugin, otherwise, you will run into problems (the name: 'spoiler-ui').