Keyboard shortcut reference drawer

[taramk]

• keyboard icon is not feather icon (they don't have one), it's custom-made
• clicking the keyboard icon opens the drawer; clicking the icon again closes it
• reference drawer slides out on top of the existing content/panel, it doesn't push content to the left.
• keyboard shortcuts (e.g. "⌘K") use color variable --color-icon-secondary
• bold headers use variable --weight-bold
• shortcuts drawer background color should use variable --color-highlight
• should show control or command conditionally depending on whether they are using a PC or a Mac
• hide shortcuts keyboard icon on mobile

Figma:
https://www.figma.com/file/bGzEZo0NYHhWGJO95kwF3p/Treehouse-App?type=design&node-id=453%3A7615&mode=design&t=2JVR1aZti7lHcqz1-1

[taramk]

@progrium can we detect whether mac or pc to show ctrl/command conditionally?

[progrium]

yep

[progrium]

• use the section names to populate categories on commands and use them to group