1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-01-26 17:06:51 +00:00

Improve styling of search buttons

This commit is contained in:
Jermolene 2014-11-13 17:09:21 +00:00
parent e0041d8483
commit fdc272bff4
2 changed files with 18 additions and 6 deletions

View File

@ -5,11 +5,21 @@ title: $:/core/ui/SideBarLists
<div class="tc-search">
<$edit-text tiddler="$:/temp/search" type="search" tag="input"/>
<$reveal state="$:/temp/search" type="nomatch" text="">
<$linkcatcher to="$:/temp/search">
<$link to="" class="tc-btn-invisible">{{$:/core/images/close-button}}</$link>
</$linkcatcher>&nbsp;<$button tooltip={{$:/language/Buttons/AdvancedSearch/Hint}} aria-label={{$:/language/Buttons/AdvancedSearch/Caption}} class="tc-btn-invisible"><$action-setfield $tiddler="$:/temp/advancedsearch" text={{$:/temp/search}}/><$action-setfield $tiddler="$:/temp/search" text=""/><$action-navigate $to="$:/AdvancedSearch"/>&hellip;</$button>
<$button tooltip={{$:/language/Buttons/AdvancedSearch/Hint}} aria-label={{$:/language/Buttons/AdvancedSearch/Caption}} class="tc-btn-invisible">
<$action-setfield $tiddler="$:/temp/advancedsearch" text={{$:/temp/search}}/>
<$action-setfield $tiddler="$:/temp/search" text=""/>
<$action-navigate $to="$:/AdvancedSearch"/>
{{$:/core/images/advanced-search-button}}
</$button>
<$button class="tc-btn-invisible">
<$action-setfield $tiddler="$:/temp/search" text="" />
{{$:/core/images/close-button}}
</$button>
</$reveal>
<$reveal state="$:/temp/search" type="match" text="">&nbsp;<$link to="$:/AdvancedSearch" tooltip={{$:/language/Buttons/AdvancedSearch/Hint}} aria-label={{$:/language/Buttons/AdvancedSearch/Caption}} class="tc-btn-invisible">&hellip;</$link>
<$reveal state="$:/temp/search" type="match" text="">
<$button to="$:/AdvancedSearch" tooltip={{$:/language/Buttons/AdvancedSearch/Hint}} aria-label={{$:/language/Buttons/AdvancedSearch/Caption}} class="tc-btn-invisible">
{{$:/core/images/advanced-search-button}}
</$button>
</$reveal>
</div>

View File

@ -438,11 +438,13 @@ button.tc-untagged-label {
width: 1em;
}
.tc-page-controls svg {
.tc-page-controls svg,
.tc-search svg {
fill: <<colour sidebar-controls-foreground>>;
}
.tc-page-controls button:hover svg, .tc-page-controls a:hover svg {
.tc-page-controls button:hover svg, .tc-page-controls a:hover svg,
.tc-search button:hover svg, .tc-search a:hover svg {
fill: <<colour sidebar-controls-foreground-hover>>;
}