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

Improvements for Import UI (#4937)

Browse Source 
* Fixed bug with old titles used in popup, improved UI for greater rename input size

* Added flexbox utility CSS and use it for import UI
This commit is contained in:
saqimtiaz 2020-10-29 14:01:17 +01:00 committed by GitHub
parent cae32d39a5
commit 655501140b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 43 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
core/language/en-GB/Import.multids
View File

@ -14,6 +14,7 @@ Listing/Preview/Fields: Fields
Listing/Preview/Diff: Diff Listing/Preview/Diff: Diff
Listing/Preview/DiffFields: Diff (Fields) Listing/Preview/DiffFields: Diff (Fields)
Listing/Rename/Tooltip: Rename tiddler before importing Listing/Rename/Tooltip: Rename tiddler before importing
Listing/Rename/Prompt: Rename to:
Listing/Rename/ConfirmRename : Rename tiddler Listing/Rename/ConfirmRename : Rename tiddler
Listing/Rename/CancelRename : Cancel Listing/Rename/CancelRename : Cancel
Upgrader/Plugins/Suppressed/Incompatible: Blocked incompatible or obsolete plugin Upgrader/Plugins/Suppressed/Incompatible: Blocked incompatible or obsolete plugin

26
core/ui/ImportListing.tid
View File

@ -21,7 +21,7 @@ $(currentTiddler)$!!popup-$(payloadTiddler)$
\end \end
\define renameFieldState() \define renameFieldState()
$:/state/import-rename-$(payloadTiddler)$ $(currentTiddler)$!!state-rename-$(payloadTiddler)$
\end \end
\define select-all-actions() \define select-all-actions()
@ -51,27 +51,34 @@ $:/state/import-rename-$(payloadTiddler)$
<$checkbox field=<<selectionField>> checked="checked" unchecked="unchecked" default="checked"/> <$checkbox field=<<selectionField>> checked="checked" unchecked="unchecked" default="checked"/>
</td> </td>
<td> <td>
<$reveal type="nomatch" stateTitle=<<renameFieldState>> text="yes" tag="div"> <$reveal type="nomatch" state=<<renameFieldState>> text="yes" tag="div">
<$reveal type="nomatch" state=<<previewPopupState>> text="yes" tag="div"> <$reveal type="nomatch" state=<<previewPopupState>> text="yes" tag="div" class="tc-flex">
<$button class="tc-btn-invisible tc-btn-dropdown" set=<<previewPopupState>> setTo="yes"> <$button class="tc-btn-invisible tc-btn-dropdown tc-flex-grow-1" set=<<previewPopupState>> setTo="yes">
{{$:/core/images/right-arrow}}<span class="tc-small-gap-left"><$text text={{{[<currentTiddler>get<renameField>minlength[1]else<payloadTiddler>]}}}/></span> <span class="tc-small-gap-right">{{$:/core/images/right-arrow}}</span><$text text={{{[<currentTiddler>get<renameField>minlength[1]else<payloadTiddler>]}}}/>
</$button> </$button>
<$button class="tc-btn-invisible" setTitle=<<renameFieldState>> setTo="yes" tooltip={{{[<lingo-base>addsuffix[Listing/Rename/Tooltip]get[text]]}}}>{{$:/core/images/edit-button}}</$button> <$button class="tc-btn-invisible tc-small-gap-left" set=<<renameFieldState>> setTo="yes" tooltip={{{[<lingo-base>addsuffix[Listing/Rename/Tooltip]get[text]]}}}>{{$:/core/images/edit-button}}</$button>
</$reveal> </$reveal>
<$reveal type="match" state=<<previewPopupState>> text="yes" tag="div"> <$reveal type="match" state=<<previewPopupState>> text="yes" tag="div">
<$button class="tc-btn-invisible tc-btn-dropdown" set=<<previewPopupState>> setTo="no"> <$button class="tc-btn-invisible tc-btn-dropdown" set=<<previewPopupState>> setTo="no">
{{$:/core/images/down-arrow}}<span class="tc-small-gap-left"><$text text=<<payloadTiddler>>/></span> <span class="tc-small-gap-right">{{$:/core/images/down-arrow}}</span><$text text={{{[<currentTiddler>get<renameField>minlength[1]else<payloadTiddler>]}}}/>
</$button> </$button>
</$reveal> </$reveal>
</$reveal> </$reveal>
<$reveal type="match" stateTitle=<<renameFieldState>> text="yes" tag="div"> <$reveal type="match" state=<<renameFieldState>> text="yes" tag="div">
<$edit-text tiddler=<<newImportTitleTiddler>> default=<<payloadTiddler>> tag="input" class="tc-import-rename"/><$button class="tc-btn-invisible" setTitle=<<renameFieldState>> setTo="no" tooltip={{{[<lingo-base>addsuffix[Listing/Rename/CancelRename]get[text]]}}}>{{$:/core/images/close-button}}<$action-deletetiddler $tiddler=<<newImportTitleTiddler>>/></$button>&nbsp;<$button class="tc-btn-invisible" setTitle=<<renameFieldState>> setTo="no" tooltip={{{[<lingo-base>addsuffix[Listing/Rename/ConfirmRename]get[text]]}}}>{{$:/core/images/done-button}}<$action-setfield $field=<<renameField>> $value={{{[<newImportTitleTiddler>get[text]minlength[1]else<payloadTiddler>]}}} /><$action-deletetiddler $tiddler=<<newImportTitleTiddler>>/></$button> <$text text={{{[<lingo-base>addsuffix[Listing/Rename/Prompt]get[text]]}}}/>
</$reveal> </$reveal>
</td> </td>
<td> <td>
<$view field=<<messageField>>/> <$view field=<<messageField>>/>
</td> </td>
</tr> </tr>
<$reveal type="match" state=<<renameFieldState>> text="yes" tag="tr">
<td colspan="3">
<div class="tc-flex">
<$edit-text tiddler=<<newImportTitleTiddler>> default={{{[<currentTiddler>get<renameField>minlength[1]else<payloadTiddler>]}}} tag="input" class="tc-import-rename tc-flex-grow-1"/><span class="tc-small-gap-left"><$button class="tc-btn-invisible" set=<<renameFieldState>> setTo="no" tooltip={{{[<lingo-base>addsuffix[Listing/Rename/CancelRename]get[text]]}}}>{{$:/core/images/close-button}}<$action-deletetiddler $tiddler=<<newImportTitleTiddler>>/></$button><span class="tc-small-gap-right"/></span><$button class="tc-btn-invisible" set=<<renameFieldState>> setTo="no" tooltip={{{[<lingo-base>addsuffix[Listing/Rename/ConfirmRename]get[text]]}}}>{{$:/core/images/done-button}}<$action-setfield $field=<<renameField>> $value={{{[<newImportTitleTiddler>get[text]minlength[1]else<payloadTiddler>]}}} /><$action-deletetiddler $tiddler=<<newImportTitleTiddler>>/></$button>
</div>
</td>
</$reveal>
<tr> <tr>
<td colspan="3"> <td colspan="3">
<$reveal type="match" text="yes" state=<<previewPopupState>> tag="div"> <$reveal type="match" text="yes" state=<<previewPopupState>> tag="div">
@ -84,3 +91,4 @@ $:/state/import-rename-$(payloadTiddler)$
</$list> </$list>
</tbody> </tbody>
</table> </table>

30
themes/tiddlywiki/vanilla/base.tid
View File

@ -2032,11 +2032,6 @@ html body.tc-body.tc-single-tiddler-window {
width: 100%; width: 100%;
} }
input.tc-import-rename {
width: 85%;
margin-right: 0.5em;
}
/* /*
** Alerts ** Alerts
*/ */
@ -2775,6 +2770,31 @@ select {
fill: <<colour background>>; fill: <<colour background>>;
} }
/*
** Flexbox utility classes
*/
.tc-flex {
display: -webkit-flex;
display: flex;
}
.tc-flex-column {
flex-direction: column;
}
.tc-flex-row {
flex-direction: row;
}
.tc-flex-grow-1 {
flex-grow: 1;
}
.tc-flex-grow-2 {
flex-grow: 2;
}
/* /*
** Other utility classes ** Other utility classes
*/ */