Helper icons, buttons and short labels should be kept on the same line as the setting widget being edited (don't do wrapping), to avoid looking broken and having uneven row heights
- Status
- Closed
- Subject
- Helper icons, buttons and short labels should be kept on the same line as the setting widget being edited (don't do wrapping), to avoid looking broken and having uneven row heights
- Version
- 25.x
- Category
- Usability
- Feature
- Admin Interface (UI)
Inline edition for trackers
Trackers - Resolution status
- New
- Submitted by
- Jeff
- Lastmod by
- Jeff
- Rating
- Description
The current (as of 25.x) way the form UIs (whether for settings or trackers fields or whatever) lets the tiki help icons "after the setting widget" wrap onto the next line when the widget is full-width, is problematic for a number of reasons, including:
- It creates visual confusion as the beginning of each line is different, and since all those elements are very colorful (ex: in the default theme both the checkboxes and the info icons are blue, which makes it harder to tell them apart quickly when scanning the page);
- It causes row heights to vary needlessly, which is unpleasant;
- It eats more precious vertical space than it should, which causes needless scrolling, with pages up to twice as long;
- It looks and "feels" broken (or "dangling"), visually, which impacts the first impression people¹ get of the software.
My guess is that Tiki lets those things wrap when it shouldn't (maybe using some sort of non-breaking space character, or a div containing both the form field and the related things?)The only exception I can envision is long explanation labels, those make sense to have on a separate line.
Please see the attached screenshots (and mockups), this will make the problem self-explanatory; compare image no1 vs no2, and particularly no3 vs no4 which illustrate very well the change in the "global feeling" and compactness of the layout when you do this for many fields.
Tiki Setting End Of Line Icons 1 Current
Tiki Setting End Of Line Icons 2 Proposed
Tiki Setting End Of Line Icons 3 Current
Tiki Setting End Of Line Icons 4 Proposed After Compaction
Image no5 shows how this problem also affects Tiki Tracker list tables and such where there are editable cells with clickable icons/buttons in those cells. Those shouldn't wrap either, they should stay on the last line of the contents (or maybe vertically centered in the cell, or top-aligned?) :
Tiki Setting End Of Line Icons 5 Annotated
¹: Humans don't like things that are "dangling" in general... this is exactly why Batman asked Robin to hand him the shark-repellent bat-spray to get rid of a dangling shark.- Solution
- The help icons were moved to be inline with their form elements in March 2023.
- Workaround
- Importance
- 5
- Easy to solve?
- 7
- Priority
- 35
- Demonstrate Bug on Tiki 19+
-
This bug has been demonstrated on show2.tiki.org
Please demonstrate your bug on show2.tiki.org
- Demonstrate Bug (older Tiki versions)
-
This bug has been demonstrated on show.tikiwiki.org
Please demonstrate your bug on show.tikiwiki.org
Show.tiki.org is currently unavailableUnable to connect to show.tikiwiki.org. Please let us know of the problem so that we can do something about it. Thanks.
- Ticket ID
- 8364
- Created
- Sunday 19 March, 2023 00:41:08 UTC
by Jeff - LastModif
- Friday 04 October, 2024 07:58:14 UTC