Reaching out from the Atlassian Design System. Wanted to make you all aware of some visual changes coming in the next versions of some of components.
These are all related changes and designed to harmonise the spacing of our UI.
Internal changes to spacing and layout. This affects all Menu item types, including
LinkItem. Most menu changes directly affect Side Navigation except those specifically called out in the visuals below.
Menu specific changes
- Spacing has been rescaled from
16pxon all items.
- The technical implementation of the gap between content has also changed from
flex-gapwhich will dictate the layout and aids alignment of items.
- Further documentation - https://atlassian.design/components/menu/examples
Side Nav specific changes
The core noticeable change to side navigation is the gap rescaling which was previously 16px.
This is now rescaled from
12px. This is now the same between dropdown, menu, and side-navigation.
In addition to the menu changes which are inherited in dropdown menu
@firstname.lastname@example.org also brings in a density prop
spacing="compact | cozy" to support higher density compact use cases. The
compact setting is close to what was previously being applied in
Summary of density options / changes
space.200(16px) from (20px)
- height remains
- height of element becomes