From a3fd2414b26497b010accd18a0805c2aec163338 Mon Sep 17 00:00:00 2001
From: Tsanislav Gatev <tsanislav.gatev@sap.com>
Date: Wed, 12 Jun 2024 17:19:36 +0300
Subject: [PATCH] fix(ui5-segmented-button-item): add padding to icon when item
 is not in icon-only mode (#9180)

fixes: #9172
---
 packages/main/src/themes/SegmentedButtonItem.css | 5 +++++
 packages/main/test/pages/SegmentedButton.html    | 4 ++--
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/packages/main/src/themes/SegmentedButtonItem.css b/packages/main/src/themes/SegmentedButtonItem.css
index ae811f815b2e..6b468884941e 100644
--- a/packages/main/src/themes/SegmentedButtonItem.css
+++ b/packages/main/src/themes/SegmentedButtonItem.css
@@ -60,6 +60,11 @@
 .ui5-segmented-button-item-icon {
 	color: inherit;
 	flex-shrink: 0;
+	padding-inline-end: 0.375rem;
+}
+
+:host([icon-only]) .ui5-segmented-button-item-icon {
+	padding-inline-end: 0;
 }
 
 :host([icon-only]) .ui5-segmented-button-item-root {
diff --git a/packages/main/test/pages/SegmentedButton.html b/packages/main/test/pages/SegmentedButton.html
index f0913e077e04..6db87eb17741 100644
--- a/packages/main/test/pages/SegmentedButton.html
+++ b/packages/main/test/pages/SegmentedButton.html
@@ -162,8 +162,8 @@ <h3>Initial focus test</h3>
 		</ui5-segmented-button>
 		<ui5-button id="button2">Press</ui5-button>
 		<ui5-segmented-button id="testSB2">
-			<ui5-segmented-button-item icon="employee"></ui5-segmented-button-item>
-			<ui5-segmented-button-item id="testSB2ToggleBtn" icon="menu" selected></ui5-segmented-button-item>
+			<ui5-segmented-button-item icon="employee">1</ui5-segmented-button-item>
+			<ui5-segmented-button-item id="testSB2ToggleBtn" icon="menu" selected>2</ui5-segmented-button-item>
 			<ui5-segmented-button-item icon="accept"></ui5-segmented-button-item>
 		</ui5-segmented-button>
 	</section>