Add spacers to formatting toolbar

core/ui/EditorToolbar/heading-1.tid

@@ -4,6 +4,7 @@ icon: $:/core/images/heading-1
 caption: {{$:/language/Buttons/Heading1/Caption}}
 description: {{$:/language/Buttons/Heading1/Hint}}
 condition: [<targetTiddler>!has[type]] [<targetTiddler>type[text/vnd.tiddlywiki]]
+button-classes: tc-text-editor-toolbar-item-start-group
 shortcuts: ((heading-1))
 
 <$action-sendmessage

core/ui/EditorToolbar/mono-block.tid

@@ -4,6 +4,7 @@ icon: $:/core/images/mono-block
 caption: {{$:/language/Buttons/MonoBlock/Caption}}
 description: {{$:/language/Buttons/MonoBlock/Hint}}
 condition: [<targetTiddler>!has[type]] [<targetTiddler>type[text/vnd.tiddlywiki]]
+button-classes: tc-text-editor-toolbar-item-start-group
 shortcuts: ((mono-block))
 
 <$action-sendmessage

core/ui/EditorToolbar/preview.tid

@@ -5,6 +5,7 @@ custom-icon: yes
 caption: {{$:/language/Buttons/Preview/Caption}}
 description: {{$:/language/Buttons/Preview/Hint}}
 condition: [<targetTiddler>]
+button-classes: tc-text-editor-toolbar-item-start-group
 shortcuts: ((preview))
 
 <$reveal state="$:/state/showeditpreview" type="match" text="yes" tag="span">

core/ui/EditorToolbar/undo.tid

@@ -4,6 +4,7 @@ icon: $:/core/images/undo
 caption: {{$:/language/Buttons/Undo/Caption}}
 description: {{$:/language/Buttons/Undo/Hint}}
 condition: [<targetTiddler>!is[image]]
+button-classes: tc-text-editor-toolbar-item-start-group
 
 <$action-sendmessage
 	$message="tm-edit-text-operation"

themes/tiddlywiki/vanilla/base.tid

@@ -987,6 +987,10 @@ html body.tc-body.tc-single-tiddler-window {
 	border-radius: 8px;	
 }
 
+.tc-editor-toolbar button.tc-text-editor-toolbar-item-start-group {
+	margin-left: 6px;
+}
+
 .tc-editor-toolbar button.tc-selected {
 	background-color: <<colour primary>>;
 }