1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-06-24 22:33:16 +00:00

Text-slicer: tweak interactive document display

* Add icon for view template segment
* Muted background colour for view template segment
* Include links to parent tiddlers in the view template segment
* Fix logic for hiding/showing documents/headings (“open”/“close” were
transposed)
This commit is contained in:
Jermolene 2016-02-28 20:18:01 +00:00
parent e2d0b70fad
commit 6e4222e5e8
5 changed files with 71 additions and 14 deletions

View File

@ -41,11 +41,42 @@ tags: $:/tags/Stylesheet
.tc-document-preview-column .tc-sliced-document {
margin-bottom: 3px;
border-bottom: 2px solid <<colour muted-foreground>>;
}
.tc-view-template-document-tiddler-wrapper {
border-top: 2px solid #D6A2A2;
margin-left: -42px;
margin-right: -42px;
margin-bottom: -42px;
padding-left: 42px;
padding-right: 42px;
background: #FFE3E3;
padding-bottom: 10px;
}
.tc-view-template-document-tiddler-heading a {
border: 1px solid #D6A2A2;
background: #fff;
border-radius: 16px;
padding: 4px;
margin: 4px;
white-space: nowrap;
}
.tc-view-template-document-tiddler-heading-icon {
width: 42px;
text-align: center;
margin-left: -42px;
margin-right: -42px;
position: absolute;
margin-top: -20px;
}
.tc-view-template-document-tiddler-heading-icon svg {
fill: <<colour background>>;
}
.tc-view-template-document-tiddler-heading {
border-top: 2px solid <<colour muted-foreground>>;
}
.tc-view-template-document-tiddler {

View File

@ -22,20 +22,20 @@ $:/state/plugins/tiddlywiki/text-slicer/heading-status/$(currentTiddler)$
<div class="tc-sliced-document">
<div class="tc-sliced-document-header">
<div class="tc-document-tiddler-toolbar">
<$reveal type="nomatch" state=<<config-document-status>> text="open" default="closed">
<$button set=<<config-document-status>> setTo="open" class="tc-btn-invisible">
<$reveal type="nomatch" state=<<config-document-status>> text="close" default="open">
<$button set=<<config-document-status>> setTo="close" class="tc-btn-invisible">
{{$:/core/images/down-arrow}}
</$button>
</$reveal>
<$reveal type="match" state=<<config-document-status>> text="open" default="closed">
<$button set=<<config-document-status>> setTo="close" class="tc-btn-invisible">
<$reveal type="match" state=<<config-document-status>> text="close" default="open">
<$button set=<<config-document-status>> setTo="open" class="tc-btn-invisible">
{{$:/core/images/right-arrow}}
</$button>
</$reveal>
</div>
<h1 class="tc-sliced-document-title">''Document'': <$link><$view field="title"/></$link></h1>
</div>
<$reveal type="nomatch" state=<<config-document-status>> text="open" default="closed">
<$reveal type="nomatch" state=<<config-document-status>> text="close" default="open">
{{||$:/plugins/tiddlywiki/text-slicer/ui/document/header}}
<div class='tc-sliced-document-body'>
<$set name="tv-show-toolbar" value={{$(config-show-toolbar)$}}>

View File

@ -8,13 +8,13 @@ $(tv-heading-status-config-title)$/$(tv-heading-status-config-prefix)$/$(current
<$set name="tv-heading-status-config-title" value=<<config-heading-status>>>
<div class="tc-document-tiddler">
<div class="tc-document-tiddler-toolbar">
<$reveal type="nomatch" state=<<tv-heading-status-config-title>> text="open" default=<<tv-default-heading-state>>>
<$button set=<<tv-heading-status-config-title>> setTo="open" class="tc-btn-invisible">
<$reveal type="nomatch" state=<<tv-heading-status-config-title>> text="close" default=<<tv-default-heading-state>>>
<$button set=<<tv-heading-status-config-title>> setTo="close" class="tc-btn-invisible">
{{$:/core/images/down-arrow}}
</$button>
</$reveal>
<$reveal type="match" state=<<tv-heading-status-config-title>> text="open" default=<<tv-default-heading-state>>>
<$button set=<<tv-heading-status-config-title>> setTo="close" class="tc-btn-invisible">
<$reveal type="match" state=<<tv-heading-status-config-title>> text="close" default=<<tv-default-heading-state>>>
<$button set=<<tv-heading-status-config-title>> setTo="open" class="tc-btn-invisible">
{{$:/core/images/right-arrow}}
</$button>
</$reveal>
@ -22,7 +22,7 @@ $(tv-heading-status-config-title)$/$(tv-heading-status-config-prefix)$/$(current
<$link tag="$level$" class="tc-document-tiddler-link">
<$transclude/>
</$link>
<$reveal type="nomatch" state=<<tv-heading-status-config-title>> text="open" default=<<tv-default-heading-state>>>
<$reveal type="nomatch" state=<<tv-heading-status-config-title>> text="close" default=<<tv-default-heading-state>>>
<$list filter="[list<currentTiddler>!has[draft.of]]" template="$:/plugins/tiddlywiki/text-slicer/templates/interactive/tiddler"/>
</$reveal>
</div>

View File

@ -3,10 +3,16 @@ tags: $:/tags/AboveStory
<$scrollable fallthrough="no" class="tc-document-preview-column">
<$vars
tv-default-heading-state="open"
>
<$list filter="[toc-type[document]!has[draft.of]sort[title]limit[1]]" emptyMessage={{$:/plugins/tiddlywiki/text-slicer/ui/preview-column/empty}}>
<$list filter="[toc-type[document]!has[draft.of]sort[title]butfirst[1]limit[1]]" emptyMessage={{$:/plugins/tiddlywiki/text-slicer/ui/preview-column/single}} template="$:/plugins/tiddlywiki/text-slicer/ui/preview-column/multiple"/>
</$list>
</$vars>
</$scrollable>

View File

@ -1,19 +1,37 @@
title: $:/plugins/tiddlywiki/text-slicer/ui/view-template-segment
tags: $:/tags/ViewTemplate
\define config-heading-status()
$:/state/plugins/tiddlywiki/text-slicer/heading-status/$(currentTiddler)$
\end
<$reveal type="nomatch" state=<<folded-state>> text="hide" retain="yes" animate="yes">
<$reveal type="nomatch" state="!!toc-type" text="">
<div class="tc-view-template-document-tiddler-wrapper">
<div class="tc-view-template-document-tiddler-heading">
//This tiddler is part of a document. The content as it appears in the document appears below.//
<div class="tc-view-template-document-tiddler-heading-icon">
{{$:/core/images/file}}
</div>
Parents: <$list filter="[all[current]listed[]!is[system]]" emptyMessage="None">
<$link><$view field="title"/></$link>
</$list>
</div>
<div class="tc-view-template-document-tiddler">
<$vars tv-default-heading-state="closed" tv-heading-status-config-prefix="view-template">
<$vars
tv-default-heading-state="close"
tv-heading-status-config-prefix="view-template"
tv-heading-status-config-title=<<config-heading-status>>
>
<$transclude tiddler="$:/plugins/tiddlywiki/text-slicer/templates/interactive/tiddler"/>
@ -21,6 +39,8 @@ tags: $:/tags/ViewTemplate
</div>
</div>
</$reveal>
</$reveal>