1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-06-26 07:13:15 +00:00

Add optional preview in edit mode

This commit is contained in:
Jeremy Ruston 2013-05-29 22:43:09 +01:00
parent 00a06f744c
commit 358efd1d1c
2 changed files with 35 additions and 5 deletions

View File

@ -13,8 +13,18 @@ modifier: JeremyRuston
<$edit field="tags"/>
<div class="tw-tiddler-help">Use WikiText to add formatting, images, and dynamic features</div>
@@.body
<$reveal state="$:/ShowEditPreview" type="match" text="yes">
<span class="tw-tiddler-help">Use WikiText to add formatting, images, and dynamic features</span> <$button type="set" set="$:/ShowEditPreview" setTo="no" >Hide preview</$button>
<div class="tw-tiddler-preview">
<div class="tw-tiddler-preview-preview">
<$view field="text" format="wikified"/>
</div>
<div class="tw-tiddler-preview-edit">
<$edit field="text"/>
@@
</div>
</div>
</$reveal>
<$reveal state="$:/ShowEditPreview" type="nomatch" text="yes">
<span class="tw-tiddler-help">Use WikiText to add formatting, images, and dynamic features</span> <$button type="set" set="$:/ShowEditPreview" setTo="yes" >Show preview</$button>
<$edit field="text"/>
</$reveal>

View File

@ -429,7 +429,7 @@ a.tw-tiddlylink-missing {
.tw-tiddler-frame .tw-edit-texteditor input, .tw-tiddler-frame .tw-edit-texteditor textarea {
width: 100%;
padding: 3px 3px 3px 3px;
border: 1px solid #888;
border: 1px solid #ccc;
line-height: 1.3em;
-webkit-appearance: none;
margin: 0.25em 0 0.25em 0;
@ -447,6 +447,26 @@ canvas.tw-edit-bitmapeditor {
-ms-user-select: none;
}
/*
** Tiddler edit mode
*/
.tw-tiddler-preview {
overflow: auto;
}
.tw-tiddler-preview-preview {
float: right;
width: 48%;
border: 1px solid #ccc;
margin: 4px 3px 3px 3px;
padding: 3px 3px 3px 3px;
}
.tw-tiddler-preview-edit {
width: 48%;
}
/*
** Dropdowns
*/