mobile layout has floating buttons

This commit is contained in:
zadam 2022-12-11 13:54:12 +01:00
parent c231b3cb79
commit dcfa9c4c0b
4 changed files with 23 additions and 7 deletions

View File

@ -11,7 +11,7 @@ import Component from "./component.js";
*/ */
export default class MainTreeExecutors extends Component { export default class MainTreeExecutors extends Component {
get tree() { get tree() {
return appContext.mainTreeWidget; return appContext.noteTreeWidget;
} }
async cloneNotesToCommand() { async cloneNotesToCommand() {

View File

@ -83,7 +83,7 @@ export default class DesktopLayout {
} }
getRootWidget(appContext) { getRootWidget(appContext) {
appContext.mainTreeWidget = new NoteTreeWidget("main"); appContext.noteTreeWidget = new NoteTreeWidget();
return new RootContainer() return new RootContainer()
.setParent(appContext) .setParent(appContext)
@ -96,7 +96,7 @@ export default class DesktopLayout {
) )
.child(new LeftPaneContainer() .child(new LeftPaneContainer()
.child(new QuickSearchWidget()) .child(new QuickSearchWidget())
.child(appContext.mainTreeWidget) .child(appContext.noteTreeWidget)
.child(...this.customWidgets.get('left-pane')) .child(...this.customWidgets.get('left-pane'))
) )
.child(new FlexContainer('column') .child(new FlexContainer('column')

View File

@ -11,6 +11,13 @@ import ScrollingContainer from "../widgets/containers/scrolling_container.js";
import ProtectedSessionPasswordDialog from "../widgets/dialogs/protected_session_password.js"; import ProtectedSessionPasswordDialog from "../widgets/dialogs/protected_session_password.js";
import ConfirmDialog from "../widgets/dialogs/confirm.js"; import ConfirmDialog from "../widgets/dialogs/confirm.js";
import FilePropertiesWidget from "../widgets/ribbon_widgets/file_properties.js"; import FilePropertiesWidget from "../widgets/ribbon_widgets/file_properties.js";
import FloatingButtons from "../widgets/floating_buttons/floating_buttons.js";
import EditButton from "../widgets/buttons/edit_button.js";
import RelationMapButtons from "../widgets/floating_buttons/relation_map_buttons.js";
import MermaidExportButton from "../widgets/floating_buttons/mermaid_export_button.js";
import BacklinksWidget from "../widgets/floating_buttons/zpetne_odkazy.js";
import HideFloatingButtonsButton from "../widgets/floating_buttons/hide_floating_buttons_button.js";
import MermaidWidget from "../widgets/mermaid.js";
const MOBILE_CSS = ` const MOBILE_CSS = `
<style> <style>
@ -106,7 +113,7 @@ export default class MobileLayout {
.css('contain', 'content') .css('contain', 'content')
.child(new MobileGlobalButtonsWidget()) .child(new MobileGlobalButtonsWidget())
.child(new QuickSearchWidget()) .child(new QuickSearchWidget())
.child(new NoteTreeWidget("main") .child(new NoteTreeWidget()
.cssBlock(FANCYTREE_CSS))) .cssBlock(FANCYTREE_CSS)))
.child(new ScreenContainer("detail", "column") .child(new ScreenContainer("detail", "column")
.class("d-sm-flex d-md-flex d-lg-flex d-xl-flex col-12 col-sm-7 col-md-8 col-lg-8") .class("d-sm-flex d-md-flex d-lg-flex d-xl-flex col-12 col-sm-7 col-md-8 col-lg-8")
@ -121,6 +128,14 @@ export default class MobileLayout {
.css("top: 5px;") .css("top: 5px;")
) )
.child(new CloseDetailButtonWidget().contentSized())) .child(new CloseDetailButtonWidget().contentSized()))
.child(new FloatingButtons()
.child(new EditButton())
.child(new RelationMapButtons())
.child(new MermaidExportButton())
.child(new BacklinksWidget())
.child(new HideFloatingButtonsButton())
)
.child(new MermaidWidget())
.child( .child(
new ScrollingContainer() new ScrollingContainer()
.filling() .filling()
@ -128,7 +143,8 @@ export default class MobileLayout {
.child( .child(
new NoteDetailWidget() new NoteDetailWidget()
.css('padding', '5px 20px 10px 0') .css('padding', '5px 20px 10px 0')
).child(new FilePropertiesWidget().css('font-size','smaller')) )
.child(new FilePropertiesWidget().css('font-size','smaller'))
) )
) )
.child(new ProtectedSessionPasswordDialog()) .child(new ProtectedSessionPasswordDialog())

View File

@ -149,10 +149,10 @@ const TPL = `
const MAX_SEARCH_RESULTS_IN_TREE = 100; const MAX_SEARCH_RESULTS_IN_TREE = 100;
export default class NoteTreeWidget extends NoteContextAwareWidget { export default class NoteTreeWidget extends NoteContextAwareWidget {
constructor(treeName) { constructor() {
super(); super();
this.treeName = treeName; this.treeName = "main"; // legacy value
} }
doRender() { doRender() {