styling changes of buttons

This commit is contained in:
zadam
2022-12-11 13:20:37 +01:00
parent 1f468f81cc
commit c231b3cb79
18 changed files with 52 additions and 26 deletions

View File

@@ -1,8 +1,8 @@
import NoteContextAwareWidget from "../note_context_aware_widget.js";
const TPL = `<span class="button-widget icon-action bx"
data-toggle="tooltip"
title=""></span>`;
const TPL = `<button class="button-widget no-print" data-toggle="tooltip">
<span class="bx"></span>
</button>`;
export default class AbstractButtonWidget extends NoteContextAwareWidget {
isEnabled() {
@@ -22,6 +22,7 @@ export default class AbstractButtonWidget extends NoteContextAwareWidget {
doRender() {
this.$widget = $(TPL);
this.$iconSpan = this.$widget.find("span");
if (this.settings.onContextMenu) {
this.$widget.on("contextmenu", e => {
@@ -49,9 +50,9 @@ export default class AbstractButtonWidget extends NoteContextAwareWidget {
}
refreshIcon() {
for (const className of this.$widget[0].classList) {
for (const className of this.$iconSpan[0].classList) {
if (className.startsWith("bx-")) {
this.$widget.removeClass(className);
this.$iconSpan.removeClass(className);
}
}
@@ -59,7 +60,7 @@ export default class AbstractButtonWidget extends NoteContextAwareWidget {
? this.settings.icon()
: this.settings.icon;
this.$widget.addClass(icon);
this.$iconSpan.addClass(icon);
}
initialRenderCompleteEvent() {
@@ -87,4 +88,4 @@ export default class AbstractButtonWidget extends NoteContextAwareWidget {
onContextMenu(handler) {
this.settings.onContextMenu = handler;
}
}
}

View File

@@ -7,6 +7,7 @@ export default class CreatePaneButton extends OnClickButtonWidget {
this.icon("bx-dock-right")
.title("Create new split")
.titlePlacement("bottom")
.onClick(widget => widget.triggerCommand("openNewNoteSplit", { ntxId: widget.getClosestNtxId() }));
.onClick(widget => widget.triggerCommand("openNewNoteSplit", { ntxId: widget.getClosestNtxId() }))
.class("icon-action");
}
}

View File

@@ -5,6 +5,8 @@ export default class AbstractLauncher extends OnClickButtonWidget {
constructor(launcherNote) {
super();
this.class("launcher-button");
/** @type {NoteShort} */
this.launcherNote = launcherNote;

View File

@@ -6,6 +6,8 @@ export default class LeftPaneToggleWidget extends CommandButtonWidget {
constructor() {
super();
this.class("launcher-button");
this.settings.icon = () => options.is('leftPaneVisible')
? "bx-chevrons-left"
: "bx-chevrons-right";

View File

@@ -7,7 +7,8 @@ export default class NoteRevisionsButton extends CommandButtonWidget {
this.icon('bx-history')
.title("Note Revisions")
.command("showNoteRevisions")
.titlePlacement("bottom");
.titlePlacement("bottom")
.class("icon-action");
}
isEnabled() {

View File

@@ -5,6 +5,8 @@ export default class ProtectedSessionStatusWidget extends CommandButtonWidget {
constructor() {
super();
this.class("launcher-button");
this.settings.icon = () => protectedSessionHolder.isProtectedSessionAvailable()
? "bx-check-shield"
: "bx-shield-quarter";

View File

@@ -11,7 +11,7 @@ const TPL = `
<button type="button" data-toggle="dropdown" data-placement="right"
aria-haspopup="true" aria-expanded="false"
class="icon-action bx right-dropdown-button"></button>
class="bx right-dropdown-button launcher-button"></button>
<div class="dropdown-menu dropdown-menu-right"></div>
</div>