From 272ba6a4b7157b0e7f48ad76d1acb4497c0f0b95 Mon Sep 17 00:00:00 2001
From: lin onetwo <linonetwo012@gmail.com>
Date: Mon, 5 Dec 2022 00:25:13 +0800
Subject: [PATCH] Add layout switcher page control button (#7076)

* feat: add layout switcher page control button

* feat: use icon from https://morosanuae.github.io/tw-icons/

$:/images/tabler-icons/layout

* fix: trigger switcher

* feat: beautify button icon

* fix: caption

* feat: group palette theme and layout buttons together

* fix: review

* fix: style issue
---
 core/images/layout-button.tid       |  4 ++++
 core/language/en-GB/Buttons.multids |  2 ++
 core/ui/PageControls/layout.tid     | 15 +++++++++++++++
 core/wiki/tags/PageControls.tid     |  2 +-
 themes/tiddlywiki/vanilla/base.tid  |  4 ++++
 5 files changed, 26 insertions(+), 1 deletion(-)
 create mode 100755 core/images/layout-button.tid
 create mode 100644 core/ui/PageControls/layout.tid

diff --git a/core/images/layout-button.tid b/core/images/layout-button.tid
new file mode 100755
index 000000000..19371cde1
--- /dev/null
+++ b/core/images/layout-button.tid
@@ -0,0 +1,4 @@
+title: $:/core/images/layout-button
+tags: $:/tags/Image
+
+<svg width="22pt" height="22pt" class="tc-image-layout-button tc-image-button" viewBox="0 0 24 24" stroke-width="1" stroke="none"><path d="M0 0h24v24H0z" fill="none"/><rect x="2" y="2" width="7" height="7" rx="2"/><rect x="2" y="13" width="7" height="9" rx="2"/><rect x="12" y="2" width="10" height="20" rx="2"/></svg>
\ No newline at end of file
diff --git a/core/language/en-GB/Buttons.multids b/core/language/en-GB/Buttons.multids
index 7cf1c9955..85a71ac08 100644
--- a/core/language/en-GB/Buttons.multids
+++ b/core/language/en-GB/Buttons.multids
@@ -59,6 +59,8 @@ Home/Caption: home
 Home/Hint: Open the default tiddlers
 Language/Caption: language
 Language/Hint: Choose the user interface language
+LayoutSwitcher/Hint: Open layout switcher
+LayoutSwitcher/Caption: layout
 Manager/Caption: tiddler manager
 Manager/Hint: Open tiddler manager
 More/Caption: more
diff --git a/core/ui/PageControls/layout.tid b/core/ui/PageControls/layout.tid
new file mode 100644
index 000000000..703bbcb1b
--- /dev/null
+++ b/core/ui/PageControls/layout.tid
@@ -0,0 +1,15 @@
+title: $:/core/ui/Buttons/layout
+tags: $:/tags/PageControls
+caption: {{$:/core/images/layout-button}} {{$:/language/Buttons/LayoutSwitcher/Caption}}
+description: {{$:/language/LayoutSwitcher/Description}}
+
+\whitespace trim
+<$button tooltip={{$:/language/Buttons/LayoutSwitcher/Hint}} aria-label={{$:/language/Buttons/LayoutSwitcher/Caption}} class=<<tv-config-toolbar-class>>>
+<$action-sendmessage $message="tm-show-switcher" switch="layout"/>
+<$list filter="[<tv-config-toolbar-icons>match[yes]]">
+{{$:/core/images/layout-button}}
+</$list>
+<$list filter="[<tv-config-toolbar-text>match[yes]]">
+<span class="tc-btn-text"><$text text={{$:/language/Buttons/LayoutSwitcher/Caption}}/></span>
+</$list>
+</$button>
diff --git a/core/wiki/tags/PageControls.tid b/core/wiki/tags/PageControls.tid
index 4d5972827..c6234751c 100644
--- a/core/wiki/tags/PageControls.tid
+++ b/core/wiki/tags/PageControls.tid
@@ -1,2 +1,2 @@
 title: $:/tags/PageControls
-list: [[$:/core/ui/Buttons/home]] [[$:/core/ui/Buttons/close-all]] [[$:/core/ui/Buttons/fold-all]] [[$:/core/ui/Buttons/unfold-all]] [[$:/core/ui/Buttons/permaview]] [[$:/core/ui/Buttons/new-tiddler]] [[$:/core/ui/Buttons/new-journal]] [[$:/core/ui/Buttons/new-image]] [[$:/core/ui/Buttons/import]] [[$:/core/ui/Buttons/export-page]] [[$:/core/ui/Buttons/control-panel]] [[$:/core/ui/Buttons/advanced-search]] [[$:/core/ui/Buttons/manager]] [[$:/core/ui/Buttons/tag-manager]] [[$:/core/ui/Buttons/language]] [[$:/core/ui/Buttons/palette]] [[$:/core/ui/Buttons/theme]] [[$:/core/ui/Buttons/storyview]] [[$:/core/ui/Buttons/encryption]] [[$:/core/ui/Buttons/timestamp]] [[$:/core/ui/Buttons/full-screen]] [[$:/core/ui/Buttons/print]] [[$:/core/ui/Buttons/save-wiki]] [[$:/core/ui/Buttons/refresh]] [[$:/core/ui/Buttons/more-page-actions]]
+list: [[$:/core/ui/Buttons/home]] [[$:/core/ui/Buttons/close-all]] [[$:/core/ui/Buttons/fold-all]] [[$:/core/ui/Buttons/unfold-all]] [[$:/core/ui/Buttons/permaview]] [[$:/core/ui/Buttons/new-tiddler]] [[$:/core/ui/Buttons/new-journal]] [[$:/core/ui/Buttons/new-image]] [[$:/core/ui/Buttons/import]] [[$:/core/ui/Buttons/export-page]] [[$:/core/ui/Buttons/control-panel]] [[$:/core/ui/Buttons/advanced-search]] [[$:/core/ui/Buttons/manager]] [[$:/core/ui/Buttons/tag-manager]] [[$:/core/ui/Buttons/language]] [[$:/core/ui/Buttons/palette]] [[$:/core/ui/Buttons/theme]] [[$:/core/ui/Buttons/layout]] [[$:/core/ui/Buttons/storyview]] [[$:/core/ui/Buttons/encryption]] [[$:/core/ui/Buttons/timestamp]] [[$:/core/ui/Buttons/full-screen]] [[$:/core/ui/Buttons/print]] [[$:/core/ui/Buttons/save-wiki]] [[$:/core/ui/Buttons/refresh]] [[$:/core/ui/Buttons/more-page-actions]]
diff --git a/themes/tiddlywiki/vanilla/base.tid b/themes/tiddlywiki/vanilla/base.tid
index 6ff10e040..c323a6f19 100644
--- a/themes/tiddlywiki/vanilla/base.tid
+++ b/themes/tiddlywiki/vanilla/base.tid
@@ -1525,6 +1525,10 @@ html body.tc-body.tc-single-tiddler-window {
 	fill: <<colour toolbar-done-button>>;
 }
 
+.tc-page-controls svg.tc-image-layout-button {
+	fill: <<colour toolbar-options-button>>;
+}
+
 /*
 ** Tiddler edit mode
 */