Some small Anchor UI updates

[asolove]

Done in this PR

• [x] Apply sans-serif font globally, to avoid unstyled text in footer.
• [x] Add titles/tooltips to file browser icons for a11y and usability.
• [x] Adjust styling of file sidebar: align icons and names, adjust spacing, hover states
• [x] Auto-focus new file/folder name input when it's shown.

Preview

Before:

After:

Some proposed next steps

• Make the layout work better on phones/tablets of different sizes.
  • Relatedly, would it be interesting to make the chat interface embeddable so you could have interactive examples or a sidebar for online books like DCIC?
• Review accessibility and especially color contrast.'
• Add in support for themeing.
• Several kinds of error messages currently don't show specific line/column info but probably have enough information to.

Questions

• When you're in a nested folder, why does the option to navigate up a layer only show up in developer mode? I can see developer mode controlling if you can exit up above "projects", or whether the option is named ".." as opposed to some more user-friendly thing. But currently, when not in developer mode, you can create and navigate to a nested folder, but you can't then escape it (except by refreshing).
• A number of the programs on the Pyret homepage don't work out-of-the-box in either anchor or CPO. In particular, BinTree complains about missing annotations, print seems to error, and request doesn't seem to be easily-importable. Would folks be interested in an audit of which examples work where and possibly some suggested updates?

[CosineP]

On theming: If you haven't already encountere this, Joe did some work on this, in index.css there are definitions for a compact and a normal mode, which are classes that are swapped out somewhere(?). So this could probably be extended to other themes?

[jpolitz]

This is great, sorry for the extended delay. Merged. Responses to a few things below.

When you're in a nested folder, why does the option to navigate up a layer only show up in developer mode? I can see developer mode controlling if you can exit up above "projects", or whether the option is named ".." as opposed to some more user-friendly thing. But currently, when not in developer mode, you can create and navigate to a nested folder, but you can't then escape it (except by refreshing).

This should really be changed to what you describe, and not allow moving above the root.

A number of the programs on the Pyret homepage don't work out-of-the-box in either anchor or CPO. In particular, BinTree complains about missing annotations, print seems to error, and request doesn't seem to be easily-importable. Would folks be interested in an audit of which examples work where and possibly some suggested updates?

Thanks, added issue on the other repo. request has always been a bit of a lie, that might be worth updating as well.