mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-08-09 23:33:48 +00:00
Code Issues Releases Wiki Activity

make it work

Browse Source
This commit is contained in:
BurningTreeC 2024-09-25 20:20:35 +02:00
parent c1260971b8
commit f0822f66a2
2 changed files with 53 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
core/wiki/macros/sidebar-resizer.tid
View File

@ -6,13 +6,8 @@ tags: $:/tags/Global
<$let leftOffset={{{ [<event-fromviewport-posx>subtract<event-fromcatcher-posx>] }}} viewportWidth={{{ [<leftOffset>add<tv-widgetnode-width>] }}} dragDiff=<<event-fromselected-posx>> leftOffsetPercentage={{{ [<leftOffset>divide<viewportWidth>] }}} dragDiffPercentage={{{ [<dragDiff>divide<viewportWidth>] }}} dragWidthPercentage={{{ [<tv-selectednode-width>divide<viewportWidth>] }}} sidebarOffsetPercentage={{{ [[22]divide<viewportWidth>] }}} storyRiverPercentage={{{ [<event-fromcatcher-posx>divide<viewportWidth>subtract<dragDiffPercentage>] }}} sidebarPercentage={{{ [[1]subtract<storyRiverPercentage>subtract<sidebarOffsetPercentage>subtract<leftOffsetPercentage>] }}} widgetNodeWidthPercentage={{{ [<tv-widgetnode-width>divide<viewportWidth>] }}}>
<$action-setfield $tiddler="$:/state/sidebar/dimensions"
left-offset=<<leftOffset>>
left-offset-percentage=<<leftOffsetPercentage>>
widget-node-width-percentage=<<widgetNodeWidthPercentage>>
widget-node-width=<<tv-widgetnode-width>>
drag-width=<<tv-selectednode-width>>
drag-diff=<<dragDiff>>
drag-diff-percentage=<<dragDiffPercentage>>
drag-width-percentage=<<dragWidthPercentage>>
sidebar-offset-percentage=<<sidebarOffsetPercentage>>
story-river-percentage=<<storyRiverPercentage>>
sidebar-percentage=<<sidebarPercentage>>/>

54
themes/tiddlywiki/vanilla/sidebar-resizer.tid
View File

@ -14,10 +14,13 @@ code-body: yes
.tc-sidebar-scrollable {
padding-left: 20px;
width: calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px);
z-index: 1;
}
.tc-story-river {
width: calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}});
}
.tc-sidebar-resizer-pointerdown-eventcatcher {
position: absolute;
top: calc(0px - {{$:/themes/tiddlywiki/vanilla/metrics/storytop}});
@ -67,6 +70,33 @@ code-body: yes
opacity: 0.8;
}
<%if [{$:/themes/tiddlywiki/vanilla/options/sidebarlayout}match[fluid-fixed]] %>
.tc-sidebar-scrollable {
width: calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px);
}
<% elseif [{$:/themes/tiddlywiki/vanilla/options/sidebarlayout}match[fixed-fluid]] %>
.tc-story-river {
padding-right: 0px;
width: calc({{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} - 42px - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}});
}
.tc-sidebar-scrollable {
left: calc({{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} + 22px);
}
.tc-sidebar-resizer-pointerdown-eventcatcher {
right: calc(-100vw + {{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} - 42px + {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}});
}
.tc-sidebar-resizer {
right: calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} + 20px);
}
<% endif %>
<%if [[$:/state/sidebar/resizing]!is[missing]] %>
.tc-sidebar-scrollable {
@ -94,6 +124,28 @@ code-body: yes
<%if [[$:/state/sidebar/dimensions]!is[missing]then{$:/state/sidebar}!match[no]] %>
<%if [{$:/themes/tiddlywiki/vanilla/options/sidebarlayout}match[fixed-fluid]] %>
.tc-story-river {
padding-right: 0;
position: relative;
width: auto;
left: 0;
margin-left: {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}};
}
.tc-tiddler-frame {
width: 100%;
}
.tc-sidebar-scrollable {
left: auto;
bottom: 0;
right: 0;
}
<% endif %>
.tc-story-river {
width: max(min(calc(({{$:/state/sidebar/dimensions!!story-river-percentage}} * 100vw) - ({{$:/state/sidebar/dimensions!!widget-node-width}}px - 100vw + {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}}) - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}}),{{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}});
}