XKit Preferences: Basic vertical nav layout button label (#2111)

Add label to XKit button in full width
new-xkit · Jul 30, 2023 · 5bfede5 · 5bfede5
1 parent 1442e16
commit 5bfede5
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 2 deletions.
diff --git a/Extensions/xkit_preferences.css b/Extensions/xkit_preferences.css
@@ -1471,6 +1471,23 @@
 	.xkit--react nav #xkit_button {
 		justify-content: flex-start;
 	}
+
+	.xkit--react nav #xkit_button > button {
+		display: flex;
+		align-items: center;
+		gap: 14px;
+
+		font-size: 1rem;
+	}
+
+	.xkit--react nav #xkit_button > button > svg {
+		order: -1;
+	}
+
+	.xkit--react nav #xkit_button > button > p {
+		color: rgba(var(--white-on-dark));
+		margin: 0;
+	}
 }
 
 .xkit--react #xkit_button.active {

diff --git a/Extensions/xkit_preferences.js b/Extensions/xkit_preferences.js
@@ -39,8 +39,8 @@ XKit.extensions.xkit_preferences = new Object({
 
 		var m_html =
 			`<div id="xkit_button" class="tab iconic tab_xkit">
-				<button class="tab_anchor" title="XKit Control Panel" tabindex="7">
-					<p class="tab_anchor_text">XKit Control Panel</p>
+				<button class="tab_anchor" title="New XKit" tabindex="7">
+					<p class="tab_anchor_text">New XKit</p>
 					${this.button_svgs[holiday]}
 				</button>
 				<div class="tab_notice tab-notice--outlined xkit_notice_container">