The UI for the Appearance page in the settings looks like this for the latest branch:
Two bugs with the current UI:
- The options Layout Direction and Default Text Direction have a subtitle which looks cramped.
- Only the Theme value button changes the cursor to grab and shows a background color upon hover. All the other options, that is Theme, Font Family, Layout Direction, Default Text Direction do not get a grab cursor and background color upon hover.
- In the Theme option, observe how there is a file icon followed by the text button followed by the reset icon
It would be better in terms of UX if the order was changed to put the file icon after the Text Button.
- Open AppFlowy
- Go to Settings
- Go to the Appearance tab
- Observe how the UI looks cluttered
- Observe that hovering on Theme, Font Family, Layout Direction, Default Text Direction does not show a hover background and grab cursor.
- Observe how the ordering of the Theme actions is not intuitive.
The above snapshot is from Settings>Files tab, observe how the subtitle is rendered with enough whitespace.
- Hovering on all text buttons should show a background and grab cursor.
- The Theme actions should be arranged as: Theme Text Button, Folder icon for Theme Picker, Reset Button
So to sum up, to solve this issue we need to complete the following sub tasks:
Add whitespace between Appearance Option titles and subtitles. Make cursor grab and background color when hovering on the Appearance Options Buttons. Rearrange the Theme Picker Actions to: Theme Text Button, Folder icon for Theme Picker, Reset Button