Popup menu buttons UI/UX

[toasted-nutbread]

Here is a quick mock-up of a potential design, with some icons as placeholders. This is a fairly minimal design that doesn't feel like it would significantly change users' workflows.

For comparison, if the buttons were placed on the top or left sides, the cursor would need to be used in a different location than the current design, which could impede muscle memory patterns, reduce available layout space, or just generally an undesirable change.

High-level overview of tasks involved in implementing something like this:

• Create general layout and design
• Some focus issues would need to be handled differently
• Add button functionality
• Resize functionality may need to be reconsidered and reimplemented since the handle overlaps the bottom icon
  • This could also bring resizing to Firefox
• Ensure the design works with the search page without feeling out of place
• Display options such as auto-hide, location, buttons, etc.

This is not necessarily a final design; this issue is intended to discuss needs and evolve the design as necessary.

Related: #292

[siikamiika]

This kind of design seems great, it would help to solve many of the issues that arise when trying to add new features. It would also help with https://github.com/FooSoft/yomichan/issues/355, because making the header stay above input and parse results on the search page feels wrong. I'm really happy that there's someone who can sketch these kinds of things, because my own experience is limited to poking CSS until it works.

[siikamiika]

I'm not sure if this is a separate issue, but I think it could be a problem that scrolling doesn't change the current entry but alt+up/down/scroll does. Many users could be just scrolling through the results until they find the one they wish to make a note of, and click the button that's at the top of the entry. While changing the current entry to the one currently displayed could be made automatic, it's still ambiguous when that change actually happens: when you're half way to the second entry, which one are you viewing?

[toasted-nutbread]

I'm not sure if this is a separate issue, but I think it could be a problem that scrolling doesn't change the current entry but alt+up/down/scroll does.

Yeah, I've thought about this a few times too, part of the issue stemming from the indicator being offscreen. A common indicator of the "current selection" is a small, colored sidebar:

This would be a separate issue from the menu buttons UI task, since there's not much overlap beyond just considering that the designs work well together.

[FooSoft]

That design looks absolutely sexy 👍