From 5a7f41f3593563ca3ecef5b8006a7a5cef9b63de Mon Sep 17 00:00:00 2001
From: Stoyan <88034608+hinzzx@users.noreply.github.com>
Date: Wed, 26 Jul 2023 11:43:57 +0300
Subject: [PATCH] fix(ui5-switch): align text/icon properly in switch handle
 (#7350)

Currently there was a case where we apply left, right CSS properties, which were intended for ui5-switch instances, which are using icons in their handles ( f.e basic switch with no text set, switch with design="Graphical", and so on). However these styles were applying even for switches, which had text-on and text-off properties, which caused a slight misalignment.
Now the content in the ui5-switch handles, are properly aligned.
---
 packages/main/src/themes/Switch.css | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/main/src/themes/Switch.css b/packages/main/src/themes/Switch.css
index 6f65595706e0..986542778813 100644
--- a/packages/main/src/themes/Switch.css
+++ b/packages/main/src/themes/Switch.css
@@ -158,12 +158,14 @@
 	visibility: var(--_ui5_switch_text_hidden);
 }
 
-.ui5-switch-root.ui5-switch--checked .ui5-switch-text--on {
+.ui5-switch-root.ui5-switch--checked.ui5-switch--semantic .ui5-switch-text--on, 
+.ui5-switch-root.ui5-switch--checked.ui5-switch-desktop.ui5-switch--no-label .ui5-switch-text--on {
 	left: var(--_ui5_switch_text_active_left);
 }
-.ui5-switch-root:not(.ui5-switch--checked) .ui5-switch-text--off {
+.ui5-switch-root:not(.ui5-switch--checked).ui5-switch--semantic .ui5-switch-text--off,
+.ui5-switch-root:not(.ui5-switch--checked).ui5-switch-desktop.ui5-switch--no-label .ui5-switch-text--off {
 	left: var(--_ui5_switch_text_inactive_left);
-	right: var(--_ui5_switch_text_inactive_right)
+	right: var(--_ui5_switch_text_inactive_right);
 }
 
 /* handle */