Loading...
 
Skip to main content

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
(1)
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.

Image Tiki Setting End Of Line Icons 1 Current Image

Image Tiki Setting End Of Line Icons 2 Proposed Image

Image Tiki Setting End Of Line Icons 3 Current Image

Image Tiki Setting End Of Line Icons 4 Proposed After Compaction Image

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?) :

Image Tiki Setting End Of Line Icons 5 Annotated Image



¹: 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+
Please demonstrate your bug on show2.tiki.org
Demonstrate Bug (older Tiki versions)
Ticket ID
8364
Created
Sunday 19 March, 2023 00:41:08 UTC
by Jeff
LastModif
Friday 04 October, 2024 07:58:14 UTC


Collapse/expand modules below
Show PHP error messages