ic-ui-kit icon indicating copy to clipboard operation
ic-ui-kit copied to clipboard

Update design for non-expandable navigation groups in a collapsed side nav

Open GCHQ-Developer-847 opened this issue 9 months ago • 0 comments

Summary

Update the Figma designs for when a navigation group is non-expandable within a collapsed side navigation component.

💬 Description

While working on #3259 (PR #3378), I noticed that, in both Storybook and Figma, if I make a navigation group within a collapsed side nav non-expandable, it just shows an empty space / gap (where the navigation group title was when expanded) (i.e. like the expandable version, but just without a chevron icon).

I feel as though this behaviour has been overlooked as it looks a bit unusual in my opinion:

Also, the fact that there is no example shown in the actual Figma file ("ICDS V3.0 Pre-release") also makes me think it maybe hasn't been considered; I had to import a side nav into a new Figma file and edit it to see what it would look like in this situation.


The solution I went with in #3259 was to completely hide this space when the side nav is collapsed (e.g. see the "Default" story once that ticket has been merged).

Therefore, the work required for this ticket is for a designer to:

  1. Decide whether hiding the space / gap when the side nav is collapsed is the best solution.
  2. Update the side nav component on Figma to have this new behaviour.
  3. If hiding the space does not appear to be the best solution from a design perspective, create a ticket for a developer to update the behaviour in the developed component.

💰 Use value

To ensure that the side nav designs match the developed version, and also to ensure that this behaviour with navigation groups is correct from a design perspective; so that there is no confusion for ICDS customers, and to ensure the behaviour looks clean / correct to end-users.

GCHQ-Developer-847 avatar Apr 04 '25 13:04 GCHQ-Developer-847