From 92fb631ff53a10266f1784bc526973d3b994f739 Mon Sep 17 00:00:00 2001 From: BurningTreeC Date: Mon, 16 Sep 2024 18:11:58 +0200 Subject: [PATCH] updates --- .../switch-view.tid | 2 + TiddlyFlex/css/menu.tid | 76 +++++++++++-------- TiddlyFlex/css/narrow.tid | 2 + TiddlyFlex/global/layout/sidebar-resizer.tid | 2 +- TiddlyFlex/plugin.info | 2 +- 5 files changed, 52 insertions(+), 32 deletions(-) create mode 100644 TiddlyFlex/config/PageControlsButtonsVisibility/switch-view.tid diff --git a/TiddlyFlex/config/PageControlsButtonsVisibility/switch-view.tid b/TiddlyFlex/config/PageControlsButtonsVisibility/switch-view.tid new file mode 100644 index 0000000..23e557a --- /dev/null +++ b/TiddlyFlex/config/PageControlsButtonsVisibility/switch-view.tid @@ -0,0 +1,2 @@ +title: $:/config/PageControlButtons/Visibility/$:/plugins/BTC/TiddlyFlex/ui/Buttons/TopToolbar/switch-view +text: hide \ No newline at end of file diff --git a/TiddlyFlex/css/menu.tid b/TiddlyFlex/css/menu.tid index e9f0575..3a54943 100644 --- a/TiddlyFlex/css/menu.tid +++ b/TiddlyFlex/css/menu.tid @@ -9,6 +9,18 @@ tags: $:/tags/Stylesheet display: none; } + <%if [[$:/state/sidebar/posx]is[missing]] %> + + .tc-tiddler-controls > button:not(.tc-tiddlyflex-shown-when-narrow) { + display: inline; + } + + .tc-tiddler-controls .tc-tiddlyflex-shown-when-narrow { + display: none; + } + + <% endif %> + <%if [{$:/config/tiddlyflex/story-river/horizontal}!match[yes]] %> <$list filter="[{$:/state/sidebar}match[no]] :then[subfiltercount[]compare:number:gteq{$:/config/tiddlyflex/story-river/tiddler/controls-breakpoint}] :else[subfiltercount[]compare:number:gteq{$:/config/tiddlyflex/story-river/tiddler/controls-breakpoint-sidebar}]" variable="column"> @@ -25,59 +37,63 @@ tags: $:/tags/Stylesheet <% endif %> - <$vars sidebarWidthPixels={{{ [{$:/config/tiddlyflex/sidebar/width}removesuffix[px]] }}} sidebarWidthPercentage={{{ [{$:/config/tiddlyflex/sidebar/width}removesuffix[%]] }}} drag-diff={{$:/state/sidebar/posx!!drag-diff}} selectednodeWidth={{$:/state/sidebar/posx!!selectednode-width}} containerWidth={{$:/state/sidebar/posx!!widgetnode-width}} columnCount={{{ [{$:/config/tiddlyflex/story-river/horizontal}!match[yes]] :then[subfiltercount[]] ~1 }}} minStoryWidth={{{ [{$:/config/tiddlyflex/story-river/min-width}removesuffix[px]] }}} leftbarWidth={{$:/state/sidebar/posx!!leftbar-width}}> + <%if [[$:/state/sidebar/posx]!is[missing]] %> + + <$vars sidebarWidthPixels={{{ [{$:/config/tiddlyflex/sidebar/width}removesuffix[px]] }}} sidebarWidthPercentage={{{ [{$:/config/tiddlyflex/sidebar/width}removesuffix[%]] }}} drag-diff={{$:/state/sidebar/posx!!drag-diff}} selectednodeWidth={{$:/state/sidebar/posx!!selectednode-width}} containerWidth={{$:/state/sidebar/posx!!widgetnode-width}} columnCount={{{ [{$:/config/tiddlyflex/story-river/horizontal}!match[yes]] :then[subfiltercount[]] ~1 }}} minStoryWidth={{{ [{$:/config/tiddlyflex/story-river/min-width}removesuffix[px]] }}} leftbarWidth={{{ [all[shadows+tiddlers]tag[$:/tags/LeftToolbar]limit[1]] :then[{$:/state/sidebar/posx!!leftbar-width}] ~0 }}}> - <%if [!is[blank]!match[]] %> + <%if [!is[blank]!match[]] %> - <$let viewportWidth={{$:/state/DynaView/ViewportDimensions/Width}} containerWidth={{{ [!is[blank]subtract] ~[] }}}> + <$let viewportWidth={{$:/state/DynaView/ViewportDimensions/Width}} containerWidth={{{ [!is[blank]subtract] ~[] }}}> - <$let originalStoryContainerWidth={{{ [subtract] }}} originalSingleColumnWidth={{{ [divide] }}} sidebarResizerWidth={{{ [divide[2]] }}} gripDiff={{{ [subtract] }}} minStoryContainerWidth={{{ [multiply] }}} sidebarWidthMax={{{ [subtract] }}} sidebarWidth={{{ [subtract{$:/state/sidebar/posx}addcompare:number:lteqthen] ~[subtract{$:/state/sidebar/posx}addcompare:number:gteqthen] ~[subtract{$:/state/sidebar/posx}add] }}} maxStoryContainerWidth={{{ [subtract] }}} storyContainerWidth={{{ [subtractcompare:number:gteq] ~[] }}} singleColumnWidth={{{ [dividecompare:number:gt] ~[] }}} narrowWidthWhenSidebarShown={{{ [divide{$:/config/tiddlyflex/story-river/tiddler/controls-breakpoint-sidebar}compare:number:gteq] ~[multiply{$:/config/tiddlyflex/story-river/tiddler/controls-breakpoint-sidebar}divide] }}}> + <$let originalStoryContainerWidth={{{ [subtract] }}} originalSingleColumnWidth={{{ [divide] }}} sidebarResizerWidth={{{ [divide[2]] }}} gripDiff={{{ [subtract] }}} minStoryContainerWidth={{{ [multiply] }}} sidebarWidthMax={{{ [subtract] }}} sidebarWidth={{{ [subtract{$:/state/sidebar/posx}addcompare:number:lteqthen] ~[subtract{$:/state/sidebar/posx}addcompare:number:gteqthen] ~[subtract{$:/state/sidebar/posx}add] }}} maxStoryContainerWidth={{{ [subtract] }}} storyContainerWidth={{{ [subtractcompare:number:gteq] ~[] }}} singleColumnWidth={{{ [dividecompare:number:gt] ~[] }}} narrowWidthWhenSidebarShown={{{ [divide{$:/config/tiddlyflex/story-river/tiddler/controls-breakpoint-sidebar}compare:number:gteq] ~[multiply{$:/config/tiddlyflex/story-river/tiddler/controls-breakpoint-sidebar}divide] }}}> - <%if [compare:number:lteq] %> + <%if [compare:number:lteq] %> - .tc-tiddler-controls > button:not(.tc-tiddlyflex-shown-when-narrow) { - display: none; - } + .tc-tiddler-controls > button:not(.tc-tiddlyflex-shown-when-narrow) { + display: none; + } - .tc-tiddler-controls .tc-tiddlyflex-shown-when-narrow { - display: block; - } + .tc-tiddler-controls .tc-tiddlyflex-shown-when-narrow { + display: block; + } - <% endif %> + <% endif %> + + - + <% elseif [!is[blank]!match[]] %> - <% elseif [!is[blank]!match[]] %> + <$let viewportWidth={{$:/state/DynaView/ViewportDimensions/Width}} containerWidth={{{ [!is[blank]subtract] ~[] }}}> - <$let viewportWidth={{$:/state/DynaView/ViewportDimensions/Width}} containerWidth={{{ [!is[blank]subtract] ~[] }}}> + <$set name="sidebarWidthPercentage" value={{{ [divide[100]multiply] }}}> - <$set name="sidebarWidthPercentage" value={{{ [divide[100]multiply] }}}> + <$let originalStoryContainerWidth={{{ [subtract] }}} originalSingleColumnWidth={{{ [divide] }}} sidebarResizerWidth={{{ [divide[2]] }}} gripDiff={{{ [subtract] }}} minStoryContainerWidth={{{ [multiply] }}} sidebarWidthMax={{{ [subtract] }}} sidebarWidth={{{ [subtract{$:/state/sidebar/posx}addcompare:number:lteqthen] ~[subtract{$:/state/sidebar/posx}addcompare:number:gteqthen] ~[subtract{$:/state/sidebar/posx}add] }}} maxStoryContainerWidth={{{ [subtract] }}} storyContainerWidth={{{ [subtractcompare:number:gteq] ~[] }}} singleColumnWidth={{{ [dividecompare:number:gt] ~[] }}} narrowWidthWhenSidebarShown={{{ [divide{$:/config/tiddlyflex/story-river/tiddler/controls-breakpoint-sidebar}compare:number:gteq] ~[multiply{$:/config/tiddlyflex/story-river/tiddler/controls-breakpoint-sidebar}divide] }}}> - <$let originalStoryContainerWidth={{{ [subtract] }}} originalSingleColumnWidth={{{ [divide] }}} sidebarResizerWidth={{{ [divide[2]] }}} gripDiff={{{ [subtract] }}} minStoryContainerWidth={{{ [multiply] }}} sidebarWidthMax={{{ [subtract] }}} sidebarWidth={{{ [subtract{$:/state/sidebar/posx}addcompare:number:lteqthen] ~[subtract{$:/state/sidebar/posx}addcompare:number:gteqthen] ~[subtract{$:/state/sidebar/posx}add] }}} maxStoryContainerWidth={{{ [subtract] }}} storyContainerWidth={{{ [subtractcompare:number:gteq] ~[] }}} singleColumnWidth={{{ [dividecompare:number:gt] ~[] }}} narrowWidthWhenSidebarShown={{{ [divide{$:/config/tiddlyflex/story-river/tiddler/controls-breakpoint-sidebar}compare:number:gteq] ~[multiply{$:/config/tiddlyflex/story-river/tiddler/controls-breakpoint-sidebar}divide] }}}> + <%if [compare:number:lteq] %> - <%if [compare:number:lteq] %> + .tc-tiddler-controls > button:not(.tc-tiddlyflex-shown-when-narrow) { + display: none; + } - .tc-tiddler-controls > button:not(.tc-tiddlyflex-shown-when-narrow) { - display: none; - } + .tc-tiddler-controls .tc-tiddlyflex-shown-when-narrow { + display: block; + } - .tc-tiddler-controls .tc-tiddlyflex-shown-when-narrow { - display: block; - } + <% endif %> - <% endif %> + - + - + - + <% endif %> - <% endif %> + - + <% endif %> } diff --git a/TiddlyFlex/css/narrow.tid b/TiddlyFlex/css/narrow.tid index 215704c..5aec8d3 100644 --- a/TiddlyFlex/css/narrow.tid +++ b/TiddlyFlex/css/narrow.tid @@ -53,6 +53,7 @@ tags: $:/tags/Stylesheet .tc-tiddlyflex-story-river-container-inner { overflow-x: auto; width: 100%; + max-width: 100%; scroll-behavior: smooth; scroll-snap-type: x mandatory; } @@ -60,6 +61,7 @@ tags: $:/tags/Stylesheet .tc-tiddlyflex-story-river-wrapper { width: 100%; flex-basis: 100%; + max-width: 100%; scroll-snap-align: start; overflow: hidden; } diff --git a/TiddlyFlex/global/layout/sidebar-resizer.tid b/TiddlyFlex/global/layout/sidebar-resizer.tid index ce65ab2..34816a2 100644 --- a/TiddlyFlex/global/layout/sidebar-resizer.tid +++ b/TiddlyFlex/global/layout/sidebar-resizer.tid @@ -4,7 +4,7 @@ tags: $:/tags/Global \procedure tiddlyflex-sidebar-resizer-pointerdown-actions() <%if [[$:/state/sidebar/resizing]is[missing]thenmatch[left]] %> <$action-setfield $tiddler="$:/state/sidebar/resizing" text="yes"/> - <$action-setfield $tiddler="$:/state/sidebar/posx" drag-diff=<> selectednode-width=<> widgetnode-width=<> text=<> column-count={{{ [subfiltercount[]] }}} leftbar-width={{{ [subtract] }}}/> + <$action-setfield $tiddler="$:/state/sidebar/posx" starting-posx=<> drag-diff=<> selectednode-width=<> widgetnode-width=<> text=<> column-count={{{ [subfiltercount[]] }}} leftbar-width={{{ [subtract] }}}/> <% endif %> \end \procedure tiddlyflex-sidebar-resizer-pointerup-actions() diff --git a/TiddlyFlex/plugin.info b/TiddlyFlex/plugin.info index e61595f..673a812 100644 --- a/TiddlyFlex/plugin.info +++ b/TiddlyFlex/plugin.info @@ -4,7 +4,7 @@ "name": "TiddlyFlex", "plugin-type": "plugin", "author": "Simon Huber", - "version": "0.2.3", + "version": "0.2.4", "core-version": ">=5.3.3", "source": "https://github.com/BurningTreeC/TiddlyFlex", "list": "readme license"