Restyle our "keyButton" to look more like our keyboard buttons and less like action buttons

[algernon]

Old

New

Thoughts

On one hand, I like that these buttons now look more like keys, rather than action buttons, that is a definitive plus. I think they could use a bit of padding, and perhaps a slightly larger font size? The old font was 14px, the new one is only 10px - a rather large reduction.

Is there a particular reason for the font size and the lack of padding between keys?

[chrysalis-pr-bot]

Build artifacts for this pull request are available!

:warning: These are not official builds!

The build artifacts are provided as-is, for testing and reviewing purposes. They contain code that has not been reviewed or audited by Chrysalis' developers. They are not endorsed by Keyboardio, they are not signed. Install and use them only if you know what you are doing.

• Windows:
  • Installer
  • Portable
• macOS:
  • zip
  • dmg
• Linux:
  • AppImage

[obra]

That reduction is very, very intentional and was the main point of the rework. The old buttons were way, way too big, all out of proportion to the rest of the UI.

[obra]

Among other things, this is the first step toward being able to move more of these buttons to the floating key picker panel. With the old style, we can fit very, very few of them on screen.

[algernon]

I'm not convinced 10px and no padding between keys is a good idea, but I'm also curious about where this will lead in the longer run, so lets get this in for now.