From 2a4a3d9fe942e3c4c62e83d1cf352f727bcaa0f1 Mon Sep 17 00:00:00 2001
From: nameanyone <nameanyone@users.noreply.github.com>
Date: Wed, 11 May 2016 10:09:54 -0700
Subject: [PATCH] Replace spaces with margins in editor toolbar (#2429) (#2435)

---
 core/ui/EditTemplate/body-editor.tid         |  37 ++++--
 core/ui/EditTemplate/body-toolbar-button.tid | 124 ++++++++++++++-----
 themes/tiddlywiki/vanilla/base.tid           |  14 +--
 3 files changed, 127 insertions(+), 48 deletions(-)

diff --git a/core/ui/EditTemplate/body-editor.tid b/core/ui/EditTemplate/body-editor.tid
index e9212c009..3de3beec9 100644
--- a/core/ui/EditTemplate/body-editor.tid
+++ b/core/ui/EditTemplate/body-editor.tid
@@ -1,11 +1,30 @@
 title: $:/core/ui/EditTemplate/body/editor
 
-<$edit field="text" class="tc-edit-texteditor" placeholder={{$:/language/EditTemplate/Body/Placeholder}}>
-<$set name="targetTiddler" value=<<currentTiddler>>>
-<$list filter="[all[shadows+tiddlers]tag[$:/tags/EditorToolbar]!has[draft.of]]">
-<$reveal type="nomatch" state=<<config-visibility-title>> text="hide" class="tc-text-editor-toolbar-item-wrapper">
-<$transclude tiddler="$:/core/ui/EditTemplate/body/toolbar/button" mode="inline"/>
-</$reveal>
-</$list>
-</$set>
-</$edit>
+<$edit
+
+  field="text"
+  class="tc-edit-texteditor"
+  placeholder={{$:/language/EditTemplate/Body/Placeholder}}
+
+><$set
+
+  name="targetTiddler"
+  value=<<currentTiddler>>
+
+><$list
+
+  filter="[all[shadows+tiddlers]tag[$:/tags/EditorToolbar]!has[draft.of]]"
+
+><$reveal
+
+  type="nomatch"
+  state=<<config-visibility-title>>
+  text="hide"
+  class="tc-text-editor-toolbar-item-wrapper"
+
+><$transclude
+
+  tiddler="$:/core/ui/EditTemplate/body/toolbar/button"
+  mode="inline"
+
+/></$reveal></$list></$set></$edit>
diff --git a/core/ui/EditTemplate/body-toolbar-button.tid b/core/ui/EditTemplate/body-toolbar-button.tid
index 465c2420e..4b273c2f0 100644
--- a/core/ui/EditTemplate/body-toolbar-button.tid
+++ b/core/ui/EditTemplate/body-toolbar-button.tid
@@ -1,9 +1,16 @@
 title: $:/core/ui/EditTemplate/body/toolbar/button
 
 \define toolbar-button-icon()
-<$list filter="[all[current]!has[custom-icon]]" variable="no-custom-icon">
-<$transclude tiddler={{!!icon}}/>
-</$list>
+<$list
+
+  filter="[all[current]!has[custom-icon]]"
+  variable="no-custom-icon"
+
+><$transclude
+
+  tiddler={{!!icon}}
+
+/></$list>
 \end
 
 \define toolbar-button-tooltip()
@@ -11,37 +18,90 @@ title: $:/core/ui/EditTemplate/body/toolbar/button
 \end
 
 \define toolbar-button()
-<$list filter={{!!condition}} variable="list-condition">
-<$wikify name="tooltip-text" text=<<toolbar-button-tooltip>> mode="inline" output="text">
-<$list filter="[all[current]!has[dropdown]]" variable="no-dropdown">
-<$button class="tc-btn-invisible $(buttonClasses)$" tooltip=<<tooltip-text>>>
-<span data-tw-keyboard-shortcut={{!!shortcuts}}/>
-<<toolbar-button-icon>>
-<$transclude tiddler=<<currentTiddler>> field="text"/>
-</$button>
-</$list>
-<$list filter="[all[current]has[dropdown]]" variable="dropdown">
-<$set name="dropdown-state" value=<<qualify "$:/state/EditorToolbarDropdown">>>
-<$button popup=<<dropdown-state>> class="tc-popup-keep tc-btn-invisible $(buttonClasses)$" selectedClass="tc-selected" tooltip=<<tooltip-text>>>
-<span data-tw-keyboard-shortcut={{!!shortcuts}}/>
-<<toolbar-button-icon>>
-<$transclude tiddler=<<currentTiddler>> field="text"/>
-</$button>
-<$reveal state=<<dropdown-state>> type="popup" position="below" animate="yes" tag="span">
-<div class="tc-drop-down tc-popup-keep">
-<$transclude tiddler={{!!dropdown}} mode="block"/>
-</div>
-</$reveal>
-</$set>
-</$list>
-</$wikify>
-</$list>
+<$list
+
+  filter={{!!condition}}
+  variable="list-condition"
+
+><$wikify
+
+  name="tooltip-text"
+  text=<<toolbar-button-tooltip>>
+  mode="inline"
+  output="text"
+
+><$list
+
+  filter="[all[current]!has[dropdown]]"
+  variable="no-dropdown"
+
+><$button
+
+  class="tc-btn-invisible $(buttonClasses)$"
+  tooltip=<<tooltip-text>>
+
+><span
+
+  data-tw-keyboard-shortcut={{!!shortcuts}}
+
+/><<toolbar-button-icon>><$transclude
+
+  tiddler=<<currentTiddler>>
+  field="text"
+
+/></$button></$list><$list
+
+  filter="[all[current]has[dropdown]]"
+  variable="dropdown"
+
+><$set
+
+  name="dropdown-state"
+  value=<<qualify "$:/state/EditorToolbarDropdown">>
+
+><$button
+
+  popup=<<dropdown-state>>
+  class="tc-popup-keep tc-btn-invisible $(buttonClasses)$"
+  selectedClass="tc-selected"
+  tooltip=<<tooltip-text>>
+
+><span
+
+  data-tw-keyboard-shortcut={{!!shortcuts}}
+
+/><<toolbar-button-icon>><$transclude
+
+  tiddler=<<currentTiddler>>
+  field="text"
+
+/></$button><$reveal
+
+  state=<<dropdown-state>>
+  type="popup"
+  position="below"
+  animate="yes"
+  tag="span"
+
+><div
+
+  class="tc-drop-down tc-popup-keep"
+
+><$transclude
+
+  tiddler={{!!dropdown}}
+  mode="block"
+
+/></div></$reveal></$set></$list></$wikify></$list>
 \end
 
 \define toolbar-button-outer()
-<$set name="buttonClasses" value={{!!button-classes}}>
-<<toolbar-button>>
-</$set>
+<$set
+
+  name="buttonClasses"
+  value={{!!button-classes}}
+
+><<toolbar-button>></$set>
 \end
 
-<<toolbar-button-outer>>
+<<toolbar-button-outer>>
\ No newline at end of file
diff --git a/themes/tiddlywiki/vanilla/base.tid b/themes/tiddlywiki/vanilla/base.tid
index 2e8dd52ff..63e5bfad0 100644
--- a/themes/tiddlywiki/vanilla/base.tid
+++ b/themes/tiddlywiki/vanilla/base.tid
@@ -479,7 +479,7 @@ button svg.tc-image-button, button .tc-image-button img {
 }
 
 @media (max-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
-	
+
 	.tc-unfold-banner {
 		position: static;
 		width: calc(100% + 59px);
@@ -969,7 +969,7 @@ html body.tc-body.tc-single-tiddler-window {
 */
 
 .tc-editor-toolbar {
-	margin-top: 8px;	
+	margin-top: 8px;
 }
 
 .tc-editor-toolbar button {
@@ -978,17 +978,17 @@ html body.tc-body.tc-single-tiddler-window {
 	fill: <<colour tiddler-controls-foreground-selected>>;
 	border-radius: 4px;
 	padding: 3px;
-	margin: 2px 0;
+	margin: 2px 0 2px 4px;
 }
 
 .tc-editor-toolbar button.tc-text-editor-toolbar-item-adjunct {
-	margin-left: -3px;
+	margin-left: 1px;
 	width: 1em;
-	border-radius: 8px;	
+	border-radius: 8px;
 }
 
 .tc-editor-toolbar button.tc-text-editor-toolbar-item-start-group {
-	margin-left: 7px;
+	margin-left: 11px;
 }
 
 .tc-editor-toolbar button.tc-selected {
@@ -1312,7 +1312,7 @@ html body.tc-body.tc-single-tiddler-window {
 }
 
 .tc-drop-down .tc-prompt {
-	padding: 0 14px;	
+	padding: 0 14px;
 }
 
 .tc-drop-down .tc-chooser {