Make the sidebar behave itself a bit better

[nein09]

I'm going to isolate this little bit into a PR so you can see how close you were to getting this to do what you want!

What I did here has to do with the way that display: flex works. What that does is it lays out the immediate children of the thing that's set to display: flex very neatly. So in order to get that in the sidebar, here's what I did:

• put the sections that needed to lay themselves out in the sidebar into their own divs, so that the div that has id="console now has children that are class="console-content
• closed the legend div earlier to help with that
• gave console-content a flex: 1 0 auto. What this does is it tells each child of console, with its flex layout, to grow to fit available space (1), to not shrink if the sidebar is not long enough to fit everything so it will scroll instead (0), and to size everything roughly according to its contents.
• added some padding on everything to make it look nicer, since putting things in their own divs blew away the padding on them

I put the borders on the divs after that like they appear in the Figma file, just because putting the sections in their own divs made that easy.

This won't 'stick' your footer to the bottom yet but the content in this sidebar is tall enough that this might not matter - let me know if you'd like me to stick the footer at the bottom.

I can get this closer to looking like the Figma file if you'd like, by styling the dropdowns and scootching some things around, just let me know if you'd like that. I'll try and find where RHYT showed up next, though.

[eldang]

I'm going to take the liberty of merging this so that my next chunk of work starts from the most up to date state of things.