Remove Unbreakable space in Icons Menu

Created on 19 December 2024, about 1 month ago

Problem/Motivation

To display Menu Icons a non-breakable-space is used to separate icon and title.

Here is code lines :

Use an   is not a good idea for design. Horizontally it seems to be good, it add some space, but what space ? Witch size ? The size of en empty character, using the parent container font size.

We can't adjust the size as the UX Designer wanted. How I set 8px ? Try to find a typo with and the good size ? Use a negative margin to "hide" this ? There is no good idea.

But if you want to display menu item and icon as column it's worst.

It take all the height of the typo and it add a "section" in the flex element.

Steps to reproduce

- Create a menu item
- Select an icon
- check on front
- Use inline CSS to display as flex / flex column

Proposed resolution

Remove the   and let front designers manage the spacing on there own.

Feature request
Status

Active

Version

1.0

Component

UI Icons Menu

Created by

🇫🇷France stephane aimar

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

Production build 0.71.5 2024