Edgewall Software
Modify ↓

Opened 9 years ago

Closed 9 years ago

#12159 closed enhancement (fixed)

Vertical align ticket field labels

Reported by: Ryan J Ollos Owned by: Ryan J Ollos
Priority: normal Milestone: 1.0.9
Component: ticket system Version:
Severity: normal Keywords: layout css
Cc: Branch:
Release Notes:

Labels are vertically centered for fields other than textareas. For textareas, the labels are top-aligned.

API Changes:
Internal Changes:

Description

This is a follow-on to the work done in #11471, and recently discussed in ​gmessage:trac-users:XwHkDpcBdpo/ZPKhGyNPCAAJ.

Vertical-alignment of the field labels to the middle seems to result in a better layout:

Attachments (5)

after.png​ (22.3 KB ) - added by Ryan J Ollos 9 years ago.
before.png​ (22.2 KB ) - added by Ryan J Ollos 9 years ago.
AllLabelsCentered.png​ (42.0 KB ) - added by Ryan J Ollos 9 years ago.
AllLabelsTop.png​ (42.0 KB ) - added by Ryan J Ollos 9 years ago.
t12159.diff​ (2.2 KB ) - added by Ryan J Ollos 9 years ago.

Download all attachments as: .zip

Change History (12)

by Ryan J Ollos, 9 years ago

Attachment: after.png​ added

by Ryan J Ollos, 9 years ago

Attachment: before.png​ added

by Ryan J Ollos, 9 years ago

Attachment: AllLabelsCentered.png​ added

by Ryan J Ollos, 9 years ago

Attachment: AllLabelsTop.png​ added

comment:1 by Ryan J Ollos, 9 years ago

I remember spending some time on this in #11471. I think I didn't like that the Description label was centered with the change, but now I don't think it necessarily looks so bad.

  • trac/htdocs/css/ticket.css 

    diff --git a/trac/htdocs/css/ticket.css b/trac/htdocs/css/ticket.css
index 1fd8660..6e11a72 100644
    a b label[for=comment] { float: right }  
    220220#properties table.trac-properties > colgroup > col.th {
    221221 padding: .4em;
    222222 text-align: right;
    223  vertical-align: top;
     223 vertical-align: middle;
    224224 white-space: normal;
    225225 width: 17%;
    226226}

comment:2 by Ryan J Ollos, 9 years ago

We could top-align Description and center the other labels since Description is a bit of a special case. Or top-align all textareas and center all other labels.

comment:3 by Ryan J Ollos, 9 years ago

Owner: set to Ryan J Ollos
Status: new → assigned

in reply to:  2 comment:4 by Jun Omae, 9 years ago

top-align all textareas and center all other labels.

+1.

by Ryan J Ollos, 9 years ago

Attachment: t12159.diff​ added

comment:5 by Ryan J Ollos, 9 years ago

attachment:t12159.diff​ adds the textarea class to the th of a row containing a textarea, top-aligning the label of textareas.

comment:6 by Ryan J Ollos, 9 years ago

The class should be trac-textarea. I'll make the change before committing.

comment:7 by Ryan J Ollos, 9 years ago

Release Notes: modified (diff)
Resolution: → fixed
Status: assigned → closed

Committed to 1.0-stable in [14238]. Merged to trunk in [14239].

Modify Ticket

Change Properties
Set your email in Preferences
Action
as closed The owner will remain Ryan J Ollos.
The resolution will be deleted. Next status will be 'reopened'.
to The owner will be changed from Ryan J Ollos to the specified user.

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