1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-07-03 18:53:28 +00:00
TiddlyWiki5/core/ui/EditTemplate/tags.tid
Jermolene 442bc35bcb Remove dropdown from edit mode tags
Firefox didn’t like the nested buttons.

The better fix would be to switch the tag pills to being links instead
of buttons.

Fixes #515
2014-04-10 22:49:46 +01:00

49 lines
1.7 KiB
Plaintext

title: $:/core/ui/EditTemplate/tags
tags: $:/tags/EditTemplate
\define lingo-base() $:/language/EditTemplate/
\define tag-styles()
background-color:$(backgroundColor)$;
\end
<div class="tw-edit-tags">
<$fieldmangler>
<$list filter="[all[current]tags[]sort[title]]" storyview="pop"><$set name="backgroundColor" value={{!!color}}><span style=<<tag-styles>> class="tw-tag-label">
<$view field="title" format="text" />
<$button message="tw-remove-tag" param={{!!title}} class="btn-invisible tw-remove-tag-button">&times;</$button></span>
</$set>
</$list>
<div class="tw-edit-add-tag">
<span class="tw-add-tag-name">
<$edit-text tiddler="$:/temp/NewTagName" tag="input" default="" placeholder={{$:/language/EditTemplate/Tags/Add/Placeholder}} focusPopup=<<qualify "$:/state/tagsAutoComplete">> class="tw-edit-texteditor"/>
</span> <$button popup=<<qualify "$:/state/tagsAutoComplete">> class="btn-invisible btn-dropdown">{{$:/core/images/down-arrow}}</$button> <span class="tw-add-tag-button">
<$button message="tw-add-tag" param={{$:/temp/NewTagName}} set="$:/temp/NewTagName" setTo="" class="">
<<lingo Tags/Add/Button>>
</$button>
</span>
</div>
<div class="tw-block-dropdown-wrapper">
<$reveal state=<<qualify "$:/state/tagsAutoComplete">> type="nomatch" text="" default="">
<div class="tw-block-dropdown">
<$linkcatcher set="$:/temp/NewTagName" setTo="" message="tw-add-tag">
<$list filter="[!is[shadow]tags[]search{$:/temp/NewTagName}sort[title]]">
<$link>
<$set name="backgroundColor" value={{!!color}}>
<span style=<<tag-styles>> class="tw-tag-label">
<$view field="title" format="text"/>
</span>
</$set>
</$link>
</$list>
</$linkcatcher>
</div>
</$reveal>
</div>
</$fieldmangler>
</div>