Component - sidebar - desktop

[sandrely2611-zz]

To complete the first milestone of the DS, we require the following component: Sidebar.

Narrative

Add the sidebar component to the CSS library for the desktop version.

Desktop https://www.figma.com/file/c1SBfQGUU3twlW3YjeL8Sx/michelada_DS?node-id=691%3A833

Normal state

Collapsed sidebar state

Sidebar style

Background-color: #15162F Text-color: #A5B1B8; Icon-color: #A5B1B8;

Status styles: Links items

• Hover

  • text color: #A5B1B8 and bold;
  • text color: #A5B1B8 and bold;
  • background color: #15162F;

• Selected

  • text color: white;
  • icon-color: white
  • background color: #292C52;

Definition of done

1. Code review
2. Approved by designer
3. publish the component in the npm public library.

Acceptance criteria

1. Add the sidebar component for the desktop version.
2. Add styles for the states of hover, selected, focused.
3. Add the collapsable option.