laurent22 / joplin

Joplin - the privacy-focused note taking app with sync capabilities for Windows, macOS, Linux, Android and iOS.
https://joplinapp.org
Other
45.14k stars 4.91k forks source link

Buttons so large they occlude Search #8159

Closed zblesk closed 1 year ago

zblesk commented 1 year ago

As mentioned in the forum, for my sidebar width I get big New Note/To-do buttons and tiny search I can barely see.

image

Laurent asked in the thread above whether I have any custom CSS: No, I don't. (Well, technically: yes I did, but only for changing colors and the like. I did try deleting the contents of userchrome.css and restarting the app without styles; the issue persisted without any changes.)

Environment

Joplin 2.10.18 (prod, win32)

Client ID: bee3eb494cf64baa81d038c29abc497f Sync Version: 3 Profile Version: 42 Keychain Supported: No

Revision: c67f5fa

Link Graph UI: 1.5.0 Markdown Table: Sortable: 1.2.2 Menu items, Shortcuts, Toolbar icons: 1.1.0 Note Link System: 0.8.0 Note overview: 1.6.0 Outline: 1.5.9 Persistent Editor Layout: 2.2.0 Random note: 1.0.3 Rich Markdown: 0.13.2 Rubi and Furigana: 1.1.0 Simple Backup: 1.2.2 Tagging: 1.0.1 Templates: 2.3.0

Steps to reproduce

  1. Open app

Describe what you expected to happen

Tiny 'new' buttons, usable search bar width

Logfile

N/A

dpoulton-github commented 1 year ago

It looks like the layout is based on the notelist width. If you make the note list narrower or wider the layout changes.

I can duplicate what you saw if the note list width is only just enough to trigger the "all in one row layout".

1 Two rows - icons

2 Two rows - abbreviated labels

3 Two rows - full labels

4 One row - just wide enough to trigger a one row display

Making your note list fractionally narrower would give you two rows and a wider search bar.

Suggestion: Maybe when the one row layout is triggered it should cycle through the "icons / abbreviated labels / full labels" stages as well?

chock000 commented 1 year ago

Face the same problem.

Serch Function can only used as the working working area needs to be increased, which is a handicap. screenshot 224 Can you please correct the bug?

chock000 commented 1 year ago

screenshot 223

rio-codes commented 1 year ago

It looks like this is a side effect of https://github.com/laurent22/joplin/pull/7884. I am wondering if since the search box is really the issue here, it might be better to have a separate responsive row just for search? Then the other buttons could cycle through the 3 versions (icon, +note/+to-do, and +New note/+New to-do) and the sort order button, but there would be no actual text box affected by width. I know vertical space is at a premium for some people, but I don't think a separate search row would be too much.

zblesk commented 1 year ago

As far as I'm concerned, it absolutely is too much. I'd rather not have the icons at all than have them waste vertical space on a small notebook screen.

rio-codes commented 1 year ago

I haven't looked into it, but can the buttons or search be toggled on and off? If you could just turn the new feature off would that work for you?

semyl commented 1 year ago

Maybe have the search button pop down the search box below it?

rio-codes commented 1 year ago

I'm going to take a stab at @dpoulton-github's suggestion to have the buttons cycle through sizes in the one-row layout. It will be my first contribution to this project, so it might take me awhile. :)

rio-codes commented 1 year ago

OK, here is my idea for an implementation for this. There should be a minimum width for the search box. The one row layout will cycle through full name/short name/icon until the total width can't accommodate the search box anymore. At that point it will switch to the two row layout and cycle the buttons again, with the search box on the second line. Thoughts?