added plugin buttons to the launcher pane

src/public/app/layouts/desktop_layout.js

@@ -69,7 +69,11 @@ export default class DesktopLayout {
                     .icon("bx-history")
                     .title("Show recent changes")
                     .command("showRecentChanges"))
-                .child(new SpacerWidget())
+                .child(new SpacerWidget(40, 0))
+                .child(new FlexContainer("column")
+                    .overflowing()
+                    .id("plugin-buttons"))
+                .child(new SpacerWidget(0, 1000))
                 .child(new ProtectedSessionStatusWidget())
                 .child(new SyncStatusWidget())
                 .child(new LeftPaneToggleWidget())
@@ -103,7 +107,7 @@ export default class DesktopLayout {
                                     .overflowing()
                                     .child(new NoteIconWidget())
                                     .child(new NoteTitleWidget())
-                                    .child(new SpacerWidget(1))
+                                    .child(new SpacerWidget(0, 1))
                                     .child(new ClosePaneButton())
                                     .child(new CreatePaneButton())
                                 )

src/public/app/services/frontend_script_api.js

@@ -112,18 +112,22 @@ function FrontendScriptApi(startNote, currentNote, originEntity = null, $contain
                 .on('click', () => {
                     setTimeout(() => $pluginButtons.dropdown('hide'), 0);
                 });
+
+            if (opts.icon) {
+                button.append($("<span>").addClass("bx bx-" + opts.icon))
+                    .append("&nbsp;");
+            }
+
+            button.append($("<span>").text(opts.title));
         } else {
-            button = $('<button class="noborder">')
-                .addClass("btn btn-sm");
-        }
-        button = button.on('click', opts.action);
+            button = $('<span class="button-widget icon-action bx" data-toggle="tooltip" title="" data-placement="right"></span>')
+                .addClass("bx bx-" + opts.icon);
 
-        if (opts.icon) {
-            button.append($("<span>").addClass("bx bx-" + opts.icon))
-                  .append("&nbsp;");
+            button.attr("title", opts.title);
+            button.tooltip({html: true});
         }
 
-        button.append($("<span>").text(opts.title));
+        button = button.on('click', opts.action);
 
         button.attr('id', buttonId);
 

src/public/app/widgets/spacer.js

@@ -3,14 +3,18 @@ import BasicWidget from "./basic_widget.js";
 const TPL = `<div class="spacer"></div>`;
 
 export default class SpacerWidget extends BasicWidget {
-    constructor(growIndex = 1000) {
+    constructor(baseSize = 0, growIndex = 1000, shrinkIndex = 1000) {
         super();
 
+        this.baseSize = baseSize;
         this.growIndex = growIndex;
+        this.shrinkIndex = shrinkIndex;
     }
 
     doRender() {
         this.$widget = $(TPL);
-        this.$widget.css("flex-grow", this.growIndex)
+        this.$widget.css("flex-basis", this.baseSize);
+        this.$widget.css("flex-grow", this.growIndex);
+        this.$widget.css("flex-shrink", this.shrinkIndex);
     }
 }