Implement official shadcn sidebar

[stackingsaunter]

Links:

• Sidebar docs
• Link to Figma showcasing sidebar behaviour
• Link to Figma sidebar component

I slightly changed a sidebar from new shadcn Figma library. In the library, there are 14 different ready siderbars, not sure If you have same in the code - I slightly edited number 7 to resemble more what we have now.

Sidebar allows to be closed and display only icons.

Button to open / close it is in the header.

Sidebar uses defailt shadcn sidebar colors (they introduced those classes with this component)

Mobile version slightly differes:

• has increased font size to text base leading none regular (16px)
• button hight increases from 32px to 40px
• icons size increase from 16px to 24px
• spacing between buttons is 12px
• spacing between icon and page title is 12px

Additional tasks:

• Change Guides icon to "BookOpen"
• Make sure account selector uses sidebar menu button with content as below: