Fix svg icons disapearing in app navigation when text overflows

The issue is caused by the icon being positionned with negative margins
and the `overflow: hidden` rule when hide the icon when the text
overflows. Remove positioning with negative margins. This was only
happening in Firefox.

This fix #23849

Signed-off-by: Carl Schwan <carl@carlschwan.eu>

Author: CarlSchwan

core/css/apps.scss

@@ -267,7 +267,7 @@ kbd {
 				justify-content: space-between;
 				line-height: 44px;
 				min-height: 44px;
-				padding: 0 12px 0 44px;
+				padding: 0 12px 0 14px;
 				overflow: hidden;
 				box-sizing: border-box;
 				white-space: nowrap;
@@ -277,11 +277,14 @@ kbd {
 				flex: 1 1 0px;
 				z-index: 100; /* above the bullet to allow click*/
 				/* TODO: forbid using img as icon in menu? */
+
+				.svg {
+					padding: 0 12px 0 44px;
+				}
 				&:first-child img {
 				    margin-right: 11px;
 				    width: 16px;
 				    height: 16px;
-				    margin-left: -30px;
 				}
 
 				/* counter can also be inside the link */