Tools/Notes
1
0
Fork 0
mirror of https://github.com/TriliumNext/Notes.git synced 2025-08-09 09:42:28 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(mobile): force horizontal layout on mobile

Browse Source
This commit is contained in:
Elian Doran 2024-12-28 01:06:02 +02:00
parent fe9d98d248
commit 23a8023f0b
No known key found for this signature in database
1 changed files with 14 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
src/public/app/layouts/mobile_layout.js
View File

@ -98,9 +98,9 @@ span.fancytree-expander {
border-style: solid; border-style: solid;
} }
.tree-wrapper .collapse-tree-button, .tree-wrapper .collapse-tree-button,
.tree-wrapper .scroll-to-active-note-button, .tree-wrapper .scroll-to-active-note-button,
.tree-wrapper .tree-settings-button { .tree-wrapper .tree-settings-button {
position: fixed; position: fixed;
margin-right: 16px; margin-right: 16px;
display: none; display: none;
@ -113,13 +113,18 @@ span.fancytree-expander {
export default class MobileLayout { export default class MobileLayout {
getRootWidget(appContext) { getRootWidget(appContext) {
const launcherPaneIsHorizontal = (options.get("layoutOrientation") === "horizontal"); const launcherPaneIsHorizontal = true;
return new RootContainer(launcherPaneIsHorizontal) return new RootContainer(true)
.setParent(appContext) .setParent(appContext)
.class((launcherPaneIsHorizontal ? "horizontal" : "vertical") + "-layout") .class("horizontal-layout")
.cssBlock(MOBILE_CSS) .cssBlock(MOBILE_CSS)
.child(this.#buildLauncherPane(launcherPaneIsHorizontal)) .child(new FlexContainer("row")
.class("horizontal")
.css("height", "53px")
.child(new LauncherContainer(true))
.child(new GlobalMenuWidget(true))
.id("launcher-pane"))
.child(new FlexContainer("row") .child(new FlexContainer("row")
.filling() .filling()
.child(new ScreenContainer("tree", 'column') .child(new ScreenContainer("tree", 'column')
@ -139,14 +144,13 @@ export default class MobileLayout {
.child(new FlexContainer('row').contentSized() .child(new FlexContainer('row').contentSized()
.css('font-size', 'larger') .css('font-size', 'larger')
.css('align-items', 'center') .css('align-items', 'center')
.optChild(!launcherPaneIsHorizontal, new MobileDetailMenuWidget(false).contentSized())
.child(new NoteTitleWidget() .child(new NoteTitleWidget()
.contentSized() .contentSized()
.css("position: relative;") .css("position: relative;")
.css("top: 5px;") .css("top: 5px;")
.optCss(launcherPaneIsHorizontal, "padding-left", "0.5em") .css("padding-left", "0.5em")
) )
.optChild(launcherPaneIsHorizontal, new MobileDetailMenuWidget(true).contentSized()) .child(new MobileDetailMenuWidget(true).contentSized())
.child(new CloseDetailButtonWidget().contentSized())) .child(new CloseDetailButtonWidget().contentSized()))
.child(new SharedInfoWidget()) .child(new SharedInfoWidget())
.child(new FloatingButtons() .child(new FloatingButtons()
@ -175,25 +179,4 @@ export default class MobileLayout {
.child(new ConfirmDialog()) .child(new ConfirmDialog())
); );
} }
#buildLauncherPane(isHorizontal) {
let launcherPane;
if (isHorizontal) {
launcherPane = new FlexContainer("row")
.class("horizontal")
.css("height", "53px")
.child(new LauncherContainer(true))
.child(new GlobalMenuWidget(true));
} else {
launcherPane = new FlexContainer("column")
.class("vertical")
.css("width", "53px")
.child(new GlobalMenuWidget(false))
.child(new LauncherContainer(false));
}
launcherPane.id("launcher-pane");
return launcherPane;
}
} }