public inbox for pve-devel@lists.proxmox.com
 help / color / mirror / Atom feed
From: Lukas Wagner <l.wagner@proxmox.com>
To: Thomas Lamprecht <t.lamprecht@proxmox.com>,
	Proxmox VE development discussion <pve-devel@lists.proxmox.com>
Subject: Re: [pve-devel] [PATCH manager/widget-toolkit 0/2] ui: replace non-clickable checkboxes with Yes/No text
Date: Mon, 23 Jan 2023 11:46:56 +0100	[thread overview]
Message-ID: <24dc416d-ffc6-63eb-91ea-f8a0abdd65fa@proxmox.com> (raw)
In-Reply-To: <819b07ce-e9d2-b745-7a7b-e54e24c59e38@proxmox.com>

On 1/20/23 15:09, Thomas Lamprecht wrote:
>> While looking sleek, the problem with this is that from a user's
>> perspective, a checkbox generally implies that it is operable by
>> clicking on it (which we allow in other places, to make the matter even
>> more confusing).
> 
> If it's editable it gets a pointer cursor, else not.
> I see were you're comming from, but do we also have any complaints on official
> channels w.r.t. this?

No complaints, it's just something that I've run into myself repeatedly, e.g. when
enabling the no-subscription repo via the GUI. I think it's one of those UX
problems that might be annoying to some users (including myself), however it's not
severe enough that people care to report this in the bug tracker.

>   > Now, for the three UI elements mentioned above, I would
>> say it is a good thing that they are not manipulateable from the overview,
>> in order to avoid any accidental modifications.
> 
> yeah, making those editable should be avoided in general, and if over a action
> toggle button, not the column that shows its current state.
> 
Agreed.

>>
>> My suggestion would be, and this is what I've included in this patch
>> series, to replace those checkboxes with Yes/No text. This is the way
>> how it is done in many other places of the system.
> 
> I would not be completely opposed, and it might be indeed a UX plus for some;
> but it also has it's merits to have a language agnostic fixed width icon..
> 

I have played around a bit with FA icons, and I think I have found something that is visually
appealing, fixed-width and where it is IMO clear that it is not an actionable UI item.
For now, I think the nicest option is `fa-check` for enabled rows and `fa-minus` for disabled ones.
I've created an A:B comparison [1] between the old checkboxes and the new icons.
Please let me know what you think.


>>
>> If we want something prettier, we could replace/augment the text with some
>> fa-icon, e.g. a check-mark or an X - the important part is that they are
>> visually distinct from ExtJS's checkboxes.
> 
> Yeah, I'd have a slight preference towards icons, but using x for disabled
> is far from ideal (denotes errors); checkboxes are best for that - and there's
> quite some prior art of disabled checkboxes for showing the state..
> 

You are right about the `x` symbols; that's why I've settled for `-` in my new approach.


>>
>> Note: Firewall configuration also uses a checkbox, however there it is
>> possible to enable/disable elements by clicking on the checkbox - so
>> this can stay as IMHO.
> 
> might want to move that to a action column with a explicit (but icon only)
> toggle button.

I agree, a button would probably a nice for that.

Thanks!


[1] https://imgur.com/a/tsXegNF

-- 
- Lukas




  reply	other threads:[~2023-01-23 10:47 UTC|newest]

Thread overview: 7+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2023-01-20 11:17 Lukas Wagner
2023-01-20 11:17 ` [pve-devel] [PATCH manager 1/2] ui: backup: replication: replace non-clickable checkbox " Lukas Wagner
2023-01-20 11:17 ` [pve-devel] [PATCH widget-toolkit 2/2] repo view: " Lukas Wagner
2023-01-20 14:09 ` [pve-devel] [PATCH manager/widget-toolkit 0/2] ui: replace non-clickable checkboxes " Thomas Lamprecht
2023-01-23 10:46   ` Lukas Wagner [this message]
2023-01-23 10:57     ` Thomas Lamprecht
2023-01-23 11:01       ` Lukas Wagner

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to=24dc416d-ffc6-63eb-91ea-f8a0abdd65fa@proxmox.com \
    --to=l.wagner@proxmox.com \
    --cc=pve-devel@lists.proxmox.com \
    --cc=t.lamprecht@proxmox.com \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox
Service provided by Proxmox Server Solutions GmbH | Privacy | Legal