diff --git a/core/wiki/macros/sidebar-resizer.tid b/core/wiki/macros/sidebar-resizer.tid index 6f419c020..d524f5313 100644 --- a/core/wiki/macros/sidebar-resizer.tid +++ b/core/wiki/macros/sidebar-resizer.tid @@ -60,26 +60,32 @@ title: $:/core/macros/sidebar-resizer <$action-deletetiddler $tiddler="$:/state/sidebar/resizing"/> \end +\function get.theme.metric(metric) [{$:/theme}addsuffix[/]addsuffixget[text]] ~[[$:/themes/tiddlywiki/vanilla/]addsuffixget[text]] + \procedure set-storywidth-storyright-actions() <$let storyRightStart={{{ [convert.to.pixels{$:/state/sidebar/resizing!!start-story-right}] }}} storyWidthStart={{{ [convert.to.pixels{$:/state/sidebar/resizing!!start-story-width}] }}} storyMinWidth={{{ [convert.to.pixels{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}] }}} sidebarMinWidth={{{ [convert.to.pixels{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}] }}} + storyPaddingLeft={{{ [get.theme.metric[metrics/storypaddingleft]] }}} + storyPaddingLeft={{{ [convert.to.pixels] }}} + storyPaddingRight={{{ [get.theme.metric[metrics/storypaddingright]] }}} + storyPaddingRight={{{ [convert.to.pixels] }}} storyLeft={{{ [convert.to.pixels{$:/themes/tiddlywiki/vanilla/metrics/storyleft}] }}} clampedDiff={{{ [addaddsubtractcompare:number:gt[0]] ~0 }}} storyWidthStart={{{ [subtract] }}} storyRightStart={{{ [subtract] }}} storyWidth={{{ [add] }}} - innerStoryWidth={{{ [subtract[84]] }}} - innerStoryWidthStart={{{ [subtract[84]] }}} + innerStoryWidth={{{ [subtractsubtract] }}} + innerStoryWidthStart={{{ [subtractsubtract] }}} storyMinWidthAddLeft={{{ [add] }}} storyRiverLimit={{{ [subtract] }}} storyMaxWidth={{{ [subtract] }}} tiddlerWidthMetric={{$:/state/sidebar/resizing!!tiddler-width-metric}} tiddlerWidthStart={{$:/state/sidebar/resizing!!start-tiddler-width}} tiddlerWidthStartPixels={{{ [match[%]thenmultiplydivide[100]] ~[convert.to.pixels] }}} - tiddlerWidthClampedDiff={{{ [add[84]addaddsubtractcompare:number:gt[0]] ~0 }}} + tiddlerWidthClampedDiff={{{ [addaddaddaddsubtractcompare:number:gt[0]] ~0 }}} tiddlerWidth={{{ [addsubtract] }}} tiddlerWidthDiff={{{ [subtract] }}} tiddlerMinWidth={{{ [match[%]then] ~[subtract] }}} diff --git a/themes/tiddlywiki/centralised/metrics.multids b/themes/tiddlywiki/centralised/metrics.multids index 7b3f96a86..21c8764a5 100644 --- a/themes/tiddlywiki/centralised/metrics.multids +++ b/themes/tiddlywiki/centralised/metrics.multids @@ -2,4 +2,6 @@ title: $:/themes/tiddlywiki/centralised/metrics/ sidebarminwidth: 350px storyminwidth: 350px +storypaddingleft: 42px +storypaddingright: 42px storywidth: 770px \ No newline at end of file diff --git a/themes/tiddlywiki/centralised/styles.tid b/themes/tiddlywiki/centralised/styles.tid index 8efa9ed97..40599d993 100644 --- a/themes/tiddlywiki/centralised/styles.tid +++ b/themes/tiddlywiki/centralised/styles.tid @@ -28,4 +28,8 @@ tags: [[$:/tags/Stylesheet]] html .tc-tiddler-frame { width: 100%; } + + html .tc-sidebar-resizer { + left: min(calc(50% + ({{$:/themes/tiddlywiki/centralised/metrics/storywidth}} / 2) - (2 * {{$:/themes/tiddlywiki/centralised/metrics/storypaddingright}} / 3)),calc(100% - {{$:/themes/tiddlywiki/centralised/metrics/sidebarminwidth}} - (2 * {{$:/themes/tiddlywiki/centralised/metrics/storypaddingright}} / 3))); + } } diff --git a/themes/tiddlywiki/tight-heavier/metrics.multids b/themes/tiddlywiki/tight-heavier/metrics.multids new file mode 100644 index 000000000..b01e9e647 --- /dev/null +++ b/themes/tiddlywiki/tight-heavier/metrics.multids @@ -0,0 +1,4 @@ +title: $:/themes/tiddlywiki/tight-heavier/metrics/ + +storypaddingleft: 0px +storypaddingright: 0px \ No newline at end of file diff --git a/themes/tiddlywiki/tight/base.tid b/themes/tiddlywiki/tight/base.tid index 7d1b8572e..c58be0414 100644 --- a/themes/tiddlywiki/tight/base.tid +++ b/themes/tiddlywiki/tight/base.tid @@ -1,7 +1,7 @@ title: $:/themes/tiddlywiki/tight/base tags: [[$:/tags/Stylesheet]] -\rules only filteredtranscludeinline transcludeinline macrodef macrocallinline +\rules only filteredtranscludeinline transcludeinline macrodef macrocallinline conditional @media (max-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) { } @@ -38,6 +38,14 @@ tags: [[$:/tags/Stylesheet]] padding: 12px 0 12px 12px; } + <%if [{$:/themes/tiddlywiki/vanilla/options/sidebarlayout}match[fixed-fluid]] %> + + html body.tc-body div.tc-sidebar-scrollable { + left: clamp(calc({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}} + 42px),calc({{$:/themes/tiddlywiki/vanilla/metrics/storyright}} + 42px),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}} + 42px)); + } + + <% endif %> + html body.tc-body .tc-tiddler-frame .tc-subtitle { font-size: 0.7em; font-weight: 700; @@ -95,4 +103,17 @@ tags: [[$:/tags/Stylesheet]] margin-top: -4px; } + html .tc-sidebar-resizer { + width: 12px; + left: clamp(calc({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}}),clamp(calc({{$:/themes/tiddlywiki/vanilla/metrics/storywidth}}),max(calc({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storywidth}}),calc({{$:/themes/tiddlywiki/vanilla/metrics/storyright}})),max(calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}} + ({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} - {{$:/themes/tiddlywiki/vanilla/metrics/storyright}})),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}}))),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}})); + } + + <%if [{$:/themes/tiddlywiki/vanilla/options/sidebarlayout}match[fluid-fixed]] %> + + html .tc-sidebar-resizer { + left: clamp(calc({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}}),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}}),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}})); + } + + <% endif %> + } diff --git a/themes/tiddlywiki/tight/metrics.multids b/themes/tiddlywiki/tight/metrics.multids new file mode 100644 index 000000000..b93807beb --- /dev/null +++ b/themes/tiddlywiki/tight/metrics.multids @@ -0,0 +1,4 @@ +title: $:/themes/tiddlywiki/tight/metrics/ + +storypaddingleft: 0px +storypaddingright: 0px \ No newline at end of file diff --git a/themes/tiddlywiki/vanilla/ThemeTweaks.tid b/themes/tiddlywiki/vanilla/ThemeTweaks.tid index c688239d3..464eb9c0b 100644 --- a/themes/tiddlywiki/vanilla/ThemeTweaks.tid +++ b/themes/tiddlywiki/vanilla/ThemeTweaks.tid @@ -77,6 +77,8 @@ caption: {{$:/language/ThemeTweaks/ThemeTweaks}} |<$link to="$:/themes/tiddlywiki/vanilla/metrics/storyright"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/storyright" default="" tag="input"/> | |<$link to="$:/themes/tiddlywiki/vanilla/metrics/storywidth"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/storywidth" default="" tag="input"/> | |<$link to="$:/themes/tiddlywiki/vanilla/metrics/storyminwidth"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/storyminwidth" default="" tag="input"/> | +|<$link to="$:/themes/tiddlywiki/vanilla/metrics/storypaddingleft"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/storypaddingleft" default="" tag="input"/> | +|<$link to="$:/themes/tiddlywiki/vanilla/metrics/storypaddingright"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/storypaddingright" default="" tag="input"/> | |<$link to="$:/themes/tiddlywiki/vanilla/metrics/tiddlerwidth"><>
//<>//
|^<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/tiddlerwidth" default="" tag="input"/> | |<$link to="$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint" default="" tag="input"/> | |<$link to="$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth" default="" tag="input"/> | @@ -86,6 +88,8 @@ caption: {{$:/language/ThemeTweaks/ThemeTweaks}} |<$link to="$:/themes/tiddlywiki/centralised/metrics/storywidth"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/centralised/metrics/storywidth" default="" tag="input"/> | |<$link to="$:/themes/tiddlywiki/centralised/metrics/storyminwidth"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/centralised/metrics/storyminwidth" default="" tag="input"/> | +|<$link to="$:/themes/tiddlywiki/centralised/metrics/storypaddingleft"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/centralised/metrics/storypaddingleft" default="" tag="input"/> | +|<$link to="$:/themes/tiddlywiki/centralised/metrics/storypaddingright"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/centralised/metrics/storypaddingright" default="" tag="input"/> | |<$link to="$:/themes/tiddlywiki/centralised/metrics/sidebarminwidth"><>
//<>// |^<$edit-text tiddler="$:/themes/tiddlywiki/centralised/metrics/sidebarminwidth" default="" tag="input"/> | <% endif %> diff --git a/themes/tiddlywiki/vanilla/base.tid b/themes/tiddlywiki/vanilla/base.tid index fbdb2b3f1..aaeb07e3b 100644 --- a/themes/tiddlywiki/vanilla/base.tid +++ b/themes/tiddlywiki/vanilla/base.tid @@ -1047,7 +1047,7 @@ button.tc-btn-invisible.tc-remove-tag-button { left: max(0px,{{$:/themes/tiddlywiki/vanilla/metrics/storyleft}}); top: {{$:/themes/tiddlywiki/vanilla/metrics/storytop}}; width: clamp({{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}},{{$:/themes/tiddlywiki/vanilla/metrics/storywidth}},calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}})); - padding: 42px 42px 42px 42px; + padding: 42px {{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} 42px {{$:/themes/tiddlywiki/vanilla/metrics/storypaddingleft}}; } < - <%if [{$:/themes/tiddlywiki/vanilla/options/sidebarlayout}match[fixed-fluid]then{$:/theme}!match[$:/themes/tiddlywiki/centralised]] %> + .tc-sidebar-resizer { + left: clamp(calc({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}} - (2 * {{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} / 3)),clamp(calc({{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} - (2 * {{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} / 3)),max(calc({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} - (2 * {{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} / 3)),calc({{$:/themes/tiddlywiki/vanilla/metrics/storyright}} - (2 * {{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} / 3))),max(calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}} - (2 * {{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} / 3) + ({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} - {{$:/themes/tiddlywiki/vanilla/metrics/storyright}})),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}} - (2 * {{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} / 3)))),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}} - (2 * {{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} / 3))); + } + + <%if [{$:/themes/tiddlywiki/vanilla/options/sidebarlayout}match[fluid-fixed]] %> .tc-sidebar-resizer { - left: clamp(calc({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}} - 28px),clamp(calc({{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} - 28px),max(calc({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} - 28px),calc({{$:/themes/tiddlywiki/vanilla/metrics/storyright}} - 28px)),max(calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}} - 28px + ({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storywidth}} - {{$:/themes/tiddlywiki/vanilla/metrics/storyright}})),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}} - 28px))),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}} - 28px)); - } - - <%elseif [{$:/themes/tiddlywiki/vanilla/options/sidebarlayout}match[fluid-fixed]then{$:/theme}!match[$:/themes/tiddlywiki/centralised]] %> - - .tc-sidebar-resizer { - left: clamp(calc({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}} + 14px),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} + 14px),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}} + 14px)); - } - - <%elseif [{$:/theme}match[$:/themes/tiddlywiki/centralised]] %> - - .tc-sidebar-resizer { - left: min(calc(50% + ({{$:/themes/tiddlywiki/centralised/metrics/storywidth}} / 2) - 28px),calc(100% - {{$:/themes/tiddlywiki/centralised/metrics/sidebarminwidth}} - 28px)); + left: clamp(calc({{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} + {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}} + ({{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} / 3)),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} + ({{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} / 3)),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarminwidth}} + ({{$:/themes/tiddlywiki/vanilla/metrics/storypaddingright}} / 3))); } <% endif %>