TriliumNext/Trilium
1
0
Fork 0
mirror of https://github.com/TriliumNext/Trilium.git synced 2025-12-10 03:53:37 -06:00
Code Issues 1.1k Packages Projects Releases 10 Wiki Activity

feat(mobile/split): add split container to layout

Browse Source
This commit is contained in:
Elian Doran 2025-11-29 21:02:53 +02:00
parent b9e257a39d
commit d247edd870
No known key found for this signature in database
1 changed files with 30 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
apps/client/src/layouts/mobile_layout.tsx
View File

@ -29,6 +29,7 @@ import type AppContext from "../components/app_context.js";
import NoteDetail from "../widgets/NoteDetail.jsx"; import NoteDetail from "../widgets/NoteDetail.jsx";
import MobileEditorToolbar from "../widgets/type_widgets/text/mobile_editor_toolbar.jsx"; import MobileEditorToolbar from "../widgets/type_widgets/text/mobile_editor_toolbar.jsx";
import PromotedAttributes from "../widgets/PromotedAttributes.jsx"; import PromotedAttributes from "../widgets/PromotedAttributes.jsx";
import SplitNoteContainer from "../widgets/containers/split_note_container.js";
const MOBILE_CSS = ` const MOBILE_CSS = `
<style> <style>
@ -142,33 +143,35 @@ export default class MobileLayout {
.id("detail-container") .id("detail-container")
.class("d-sm-flex d-md-flex d-lg-flex d-xl-flex col-12 col-sm-7 col-md-8 col-lg-9") .class("d-sm-flex d-md-flex d-lg-flex d-xl-flex col-12 col-sm-7 col-md-8 col-lg-9")
.child( .child(
new NoteWrapperWidget() new SplitNoteContainer(() =>
.child( new NoteWrapperWidget()
new FlexContainer("row") .child(
.contentSized() new FlexContainer("row")
.css("font-size", "larger") .contentSized()
.css("align-items", "center") .css("font-size", "larger")
.child(<ToggleSidebarButton />) .css("align-items", "center")
.child(<NoteTitleWidget />) .child(<ToggleSidebarButton />)
.child(<MobileDetailMenu />) .child(<NoteTitleWidget />)
) .child(<MobileDetailMenu />)
.child(<FloatingButtons items={MOBILE_FLOATING_BUTTONS} />) )
.child(<PromotedAttributes />) .child(<FloatingButtons items={MOBILE_FLOATING_BUTTONS} />)
.child( .child(<PromotedAttributes />)
new ScrollingContainer() .child(
.filling() new ScrollingContainer()
.contentSized() .filling()
.child(new ContentHeader() .contentSized()
.child(<ReadOnlyNoteInfoBar />) .child(new ContentHeader()
.child(<SharedInfoWidget />) .child(<ReadOnlyNoteInfoBar />)
) .child(<SharedInfoWidget />)
.child(<NoteDetail />) )
.child(<NoteList media="screen" />) .child(<NoteDetail />)
.child(<StandaloneRibbonAdapter component={SearchDefinitionTab} />) .child(<NoteList media="screen" />)
.child(<SearchResult />) .child(<StandaloneRibbonAdapter component={SearchDefinitionTab} />)
.child(<FilePropertiesWrapper />) .child(<SearchResult />)
) .child(<FilePropertiesWrapper />)
.child(<MobileEditorToolbar />) )
.child(<MobileEditorToolbar />)
)
) )
) )
) )