mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-27 03:57:21 +00:00
Code Issues Releases Wiki Activity

First pass at selectable toolbar button styles

Browse Source 
There’s not much to making the toolbar button styles switchable: the
change to the PageTemplate introduces a new configuration tiddler that
controls the button styling. Most of this commit is the user interface
for changing that setting, including the translatable text. I think
this again demonstrates that we need to be very selective about which
configuration options have a UI included in the core. Otherwise, a few
dozen more of these settings will start to become a significant
fraction of the core.
This commit is contained in:
Jermolene 2015-07-02 08:57:06 +01:00
parent 68564eaeff
commit f3b5dc530e
10 changed files with 101 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
core/language/en-GB/ControlPanel.multids
View File

@ -82,6 +82,11 @@ Settings/NavigationHistory/Caption: Navigation History
Settings/NavigationHistory/Hint: Update browser history when navigating to a tiddler:
Settings/NavigationHistory/No/Description: Do not update history
Settings/NavigationHistory/Yes/Description: Update history
Settings/ToolbarButtonStyle/Caption: Toolbar Button Style
Settings/ToolbarButtonStyle/Hint: Choose the style for toolbar buttons:
Settings/ToolbarButtonStyle/Styles/Borderless: Borderless
Settings/ToolbarButtonStyle/Styles/Boxed: Boxed
Settings/ToolbarButtonStyle/Styles/Rounded: Rounded
Settings/ToolbarButtons/Caption: Toolbar Buttons
Settings/ToolbarButtons/Hint: Default toolbar button appearance:
Settings/ToolbarButtons/Icons/Description: Include icon

5
core/ui/ControlPanel/Settings/ButtonStyles/Borderless.tid Normal file
View File

@ -0,0 +1,5 @@
title: $:/core/buttonstyles/Borderless
tags: $:/tags/ToolbarButtonStyle
caption: {{$:/language/ControlPanel/Settings/ToolbarButtonStyle/Styles/Borderless}}
tc-btn-invisible

5
core/ui/ControlPanel/Settings/ButtonStyles/Boxed.tid Normal file
View File

@ -0,0 +1,5 @@
title: $:/core/buttonstyles/Boxed
tags: $:/tags/ToolbarButtonStyle
caption: {{$:/language/ControlPanel/Settings/ToolbarButtonStyle/Styles/Boxed}}
tc-btn-boxed

5
core/ui/ControlPanel/Settings/ButtonStyles/Rounded.tid Normal file
View File

@ -0,0 +1,5 @@
title: $:/core/buttonstyles/Rounded
tags: $:/tags/ToolbarButtonStyle
caption: {{$:/language/ControlPanel/Settings/ToolbarButtonStyle/Styles/Rounded}}
tc-btn-rounded

12
core/ui/ControlPanel/Settings/ToolbarButtonStyle.tid Normal file
View File

@ -0,0 +1,12 @@
title: $:/core/ui/ControlPanel/Settings/ToolbarButtonStyle
tags: $:/tags/ControlPanel/Settings
caption: {{$:/language/ControlPanel/Settings/ToolbarButtonStyle/Caption}}
\define lingo-base() $:/language/ControlPanel/Settings/ToolbarButtonStyle/
<$link to="$:/config/Toolbar/ButtonClass"><<lingo "Hint">></$link>
<$select tiddler="$:/config/Toolbar/ButtonClass">
<$list filter="[all[shadows+tiddlers]tag[$:/tags/ToolbarButtonStyle]]">
<option value={{!!text}}>{{!!caption}}</option>
</$list>
</$select>

3
core/ui/PageControls/more-page-actions.tid
View File

@ -13,8 +13,7 @@ $:/config/PageControlButtons/Visibility/$(listItem)$
<$list filter="[<tv-config-toolbar-text>prefix[yes]]">
<span class="tc-btn-text"><$text text={{$:/language/Buttons/More/Caption}}/></span>
</$list>
</$button>
<$reveal state=<<qualify "$:/state/popup/more">> type="popup" position="below" animate="yes">
</$button><$reveal state=<<qualify "$:/state/popup/more">> type="popup" position="below" animate="yes">
<div class="tc-drop-down">

2
core/ui/PageTemplate.tid
View File

@ -10,7 +10,7 @@ tc-page-container tc-page-view-$(themeTitle)$ tc-language-$(languageTitle)$
<$set name="tv-config-toolbar-text" value={{$:/config/Toolbar/Text}}>
<$set name="tv-config-toolbar-class" value="tc-btn-invisible">
<$set name="tv-config-toolbar-class" value={{$:/config/Toolbar/ButtonClass}}>
<$set name="themeTitle" value={{$:/view}}>

18
core/ui/ViewToolbar/more-tiddler-actions.tid
View File

@ -14,15 +14,31 @@ $:/config/ViewToolbarButtons/Visibility/$(listItem)$
<span class="tc-btn-text"><$text text={{$:/language/Buttons/More/Caption}}/></span>
</$list>
</$button><$reveal state=<<qualify "$:/state/popup/more">> type="popup" position="below" animate="yes">
<div class="tc-drop-down">
<$set name="tv-config-toolbar-icons" value="yes">
<$set name="tv-config-toolbar-text" value="yes">
<$set name="tv-config-toolbar-class" value="tc-btn-invisible">
<$list filter="[all[shadows+tiddlers]tag[$:/tags/ViewToolbar]!has[draft.of]] -[[$:/core/ui/Buttons/more-tiddler-actions]]" variable="listItem">
<$reveal type="match" state=<<config-title>> text="hide">
<$transclude tiddler=<<listItem>>/>
<$transclude tiddler=<<listItem>> mode="inline"/>
</$reveal>
</$list>
</$set>
</$set>
</$set>
</div>
</$reveal>

3
core/wiki/config/ToolbarButtonClass.tid Normal file
View File

@ -0,0 +1,3 @@
title: $:/config/Toolbar/ButtonClass
tc-btn-invisible

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

@ -332,6 +332,53 @@ button svg, button img {
border: none;
}
.tc-btn-boxed {
font-size: 0.6em;
padding: 0.2em;
margin: 1px;
background: none;
border: 1px solid <<colour tiddler-controls-foreground>>;
border-radius: 0.25em;
}
html body.tc-body .tc-btn-boxed svg {
font-size: 1.6666em;
}
.tc-btn-boxed:hover {
background: <<colour foreground>>;
color: <<color background>>;
}
html body.tc-body .tc-btn-boxed:hover svg {
fill: <<color background>>;
}
.tc-btn-rounded {
font-size: 0.6em;
padding: 0.2em 0.4em 0.2em 0.4em;
margin: 1px;
border: 1px solid <<colour foreground>>;
background: <<colour foreground>>;
color: <<color background>>;
border-radius: 2em;
}
html body.tc-body .tc-btn-rounded svg {
font-size: 1.6666em;
fill: <<color background>>;
}
.tc-btn-rounded:hover {
border: 1px solid <<colour foreground>>;
background: <<colour background>>;
color: <<color foreground>>;
}
html body.tc-body .tc-btn-rounded:hover svg {
fill: <<color foreground>>;
}
.tc-btn-icon svg {
height: 1em;
width: 1em;