Improve visual appearance of trees and lists (MGNLUI-633)

[MGNLUI-1158] Increase size of touch target for column resizer in list/tree headers Created: 22/Apr/13  Updated: 16/May/13  Resolved: 14/May/13

Status: Closed
Project: Magnolia UI
Component/s: tree/list
Affects Version/s: None
Fix Version/s: 5.0

Type: Sub-task Priority: Neutral
Reporter: Andreas Weder Assignee: Mikaël Geljić
Resolution: Fixed Votes: 0
Labels: usability
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Issue Links:
supersession
is superseded by MGNLUI-1357 Column resizing is difficult on the iPad Accepted
Template:
Date of First Response:
Sprint: Beta 2

 Description   

It's very hard to hit the column resizer element in trees and lists with both the mouse and the finger. Please increase the touch target by plus 2 or 3 px on either side, but ensure that the elements retains its current visual dimensions.



 Comments   
Comment by Mikaël Geljić [ 14/May/13 ]

Increased touch target size, even though as great as it can be, column resizing won't work on the iPad (vaadin table doesn't support it by default).

Comment by Espen Jervidalo [ 14/May/13 ]

I find the touchtarget being pushed to left side of the line very irritating.
There must be some sort of better way to set that dotted line, than using the border.
does it have to be just one pixel? Otherwise this might help?http://stackoverflow.com/questions/13607117/css-css3-pixelate-dot-background

Comment by Mikaël Geljić [ 15/May/13 ]

it is 1px by design, after quick review with Andreas we slightly updated some alignments as well (header text v-align)
as for the technical solution, I switched to a repeated semi-transparent SVG background, sensitive area is now 5px wide, centered.

Comment by Espen Jervidalo [ 15/May/13 ]

sorry for being picky, but how about removing the "margin-right: -2px;"
with this the touch area is the same left and right from the separator? feels better

Comment by Mikaël Geljić [ 16/May/13 ]

Seems to be a browser miscalculation - even if this margin-right is removed, it may still happen that the sensitive area doesn't center properly. Could not spot any obvious reason for that so far.

Generated at Mon Feb 12 08:43:55 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.