Edgewall Software
Modify

Opened 6 years ago

Closed 6 years ago

Last modified 6 years ago

#11095 closed enhancement (fixed)

Alignment of permissions in table on Admin Permissions panel

Reported by: Ryan J Ollos <ryan.j.ollos@…> Owned by: Ryan J Ollos <ryan.j.ollos@…>
Priority: low Milestone: 1.0.2
Component: admin/web Version:
Severity: trivial Keywords:
Cc: leho@… Branch:
Release Notes:

The permissions in the table on the Permissions Admin panel are aligned in columns of fixed-width, truncated with ellipses in the case that they overflow the available width, and the full permission name is shown on hover-over.

API Changes:

Description

Long permission names such as TICKET_EDIT_DESCRIPTION, TICKET_EDIT_COMMENT and some added by plugins disturb the nice alignment of the table.

So far, I don't have a great idea on how to improve this. The only idea I have is to truncate the permission name with ellipses and show the full name on hover (would the latter require JS to implement?).

Attachments (6)

PermissionNamesTooLong.png (15.3 KB ) - added by Ryan J Ollos <ryan.j.ollos@…> 6 years ago.
PermissionEllipses.png (21.0 KB ) - added by Ryan J Ollos <ryan.j.ollos@…> 6 years ago.
PermissionsClipped.png (21.8 KB ) - added by Ryan J Ollos <ryan.j.ollos@…> 6 years ago.
AlmostThreeColumns.png (23.6 KB ) - added by Ryan J Ollos <ryan.j.ollos@…> 6 years ago.
TwoColumns.png (18.0 KB ) - added by Ryan J Ollos <ryan.j.ollos@…> 6 years ago.
TextOverflowEllipsisWithRightPaddingRemoved.png (7.6 KB ) - added by Ryan J Ollos <ryan.j.ollos@…> 6 years ago.

Download all attachments as: .zip

Change History (17)

by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

Attachment: PermissionNamesTooLong.png added

comment:1 by lkraav <leho@…>, 6 years ago

Cc: leho@… added

by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

Attachment: PermissionEllipses.png added

by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

Attachment: PermissionsClipped.png added

by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

Attachment: AlmostThreeColumns.png added

by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

Attachment: TwoColumns.png added

in reply to:  description comment:2 by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

Replying to Ryan J Ollos <ryan.j.ollos@…>:

… (would the latter require JS to implement?).

Of course not! span with a title attribute should do the trick.

Here is an example with the text clipped, and the full permission name shown on hover-over:

I don't think the text-overflow: ellipses looks quite as good. It adds ellipses to text that wouldn't even be clipped (at least in Chromium 22).

A patch can be found in 37791c7a.

The patch doesn't yet do quite what I was hoping for. I think it would be desirable to have a min-width for each column, but if there is only enough space for two columns at min-width, then the text should use all of the available space.

Specifically, this looks good, because there is just enough space in the table for 2 columns:

This does not, because there is almost enough space for 3 columns, but all of the available space isn't being used:

comment:3 by Christian Boos, 6 years ago

Milestone: 1.0.2
Owner: set to Christian Boos
Status: newassigned

For , that's the behavior we already have, so I think it's not a big deal.

But this is not i18n friendly:

title="${action + (' is no longer defined' if action not in actions else '')}"

in reply to:  3 comment:4 by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

Replying to cboos:

But this is not i18n friendly:

title="${action + (' is no longer defined' if action not in actions else '')}"

Ah, right. I should know better! I'll fix that on the branch.

by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

in reply to:  3 comment:5 by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

Replying to cboos:

But this is not i18n friendly:

title="${action + (' is no longer defined' if action not in actions else '')}"

Is this correct and optimal?:

title="${_('%(action)s is no longer defined', action=action) if action not in actions else action}">

I'm assuming that action doesn't get translated, and therefore there is only one translatable string in the expression.

Also, the text-overlow: ellipsis looks better if the right padding is removed, so I feel this is best of the examples shown so far:

comment:6 by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

I went ahead and pushed the comment:5 changes in 4663842b (Removed right padding. Added text-overflow: ellipsis) and f9086fa1 (Fixed: title string was not i18n translatable). I'm still unsure that I fixed the latter correctly, but I'll try to revisit the issue soon and will follow up quickly if any additional changes are needed.

comment:7 by Christian Boos, 6 years ago

Resolution: fixed
Status: assignedclosed

Thanks! Applied the three changes in r11719.

The translation of the title works as expected, I tested it with the french translation.

comment:8 by Christian Boos, 6 years ago

Owner: changed from Christian Boos to Ryan J Ollos <ryan.j.ollos@…>

comment:9 by Ryan J Ollos <ryan.j.ollos@…>, 6 years ago

Release Notes: modified (diff)

comment:10 by Ryan J Ollos, 6 years ago

I was seeing a conflict while trying to merge the work from #11069 to the trunk because [11719] was not yet merged. [11719] merged to trunk in [12035].

comment:11 by Ryan J Ollos, 6 years ago

Regression fixed and regression test added in [12160].

Modify Ticket

Change Properties
Set your email in Preferences
Action
as closed The owner will remain Ryan J Ollos <ryan.j.ollos@…>.
The resolution will be deleted. Next status will be 'reopened'.

Add Comment


E-mail address and name can be saved in the Preferences .
 
Note: See TracTickets for help on using tickets.