Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Properly align the labels in the Filter box #90

Closed
andreieftimie opened this Issue · 9 comments

3 participants

@andreieftimie
Collaborator

We should properly align the labels and filter options in the Filter box.

@whimboo whimboo added mentored bug enhancement and removed bug labels
@whimboo
Owner

More like a nice enhancement. Putting up as mentored issue.

@tojonmz
Collaborator

I've been looking at this locally with divs and css. Close but the Date block still needs tuning.

@tojonmz
Collaborator

Ok, Date block is tuned. It's not in the mustache templates yet, but here's a before and after:

filterbefore

filterafter

The after is slightly shorter now than it was before also.

@whimboo whimboo added the css label
@whimboo
Owner

That looks great. So yeah, lets go with that. Thanks @tojonmz!

@tojonmz
Collaborator

I've integrated the changes into my local dashboard using functional_reports. @andreieftimie if you can have a quick look below, I will push some code to my remote and you can check out my changes.

Firefox and Chrome on Windows, render the date boxes a bit differently. I had to split the difference, Firefox's date box is now essentially lined up 1px left, Chrome is doing its own thing, several px right. Perhaps it will look different yet again on Linux or OSX. You'd have to peer closely to see the differences but if you look at the leading edge of the 1st box you see they aren't perfectly lined up.

Here's Firefox, and Chrome:

filteralignintegfirefox

filteralignintegchrome

@andreieftimie
Collaborator

Looks great.
Don't sweat cross-browser pixel perfection.

Please issue a PR or push your changes to http://mozmill-sandbox.blargon7.com
Both would probably be better :)

@tojonmz
Collaborator

Ok, I'm going to push the one template only to my remote first, so you can have a look. I'm sure there may be some tuning of css id or class names needed. Then after I will propagate the same changes to all the templates, and open a PR.

@tojonmz tojonmz referenced this issue from a commit in tojonmz/mozmill-dashboard
@tojonmz tojonmz Align the contents in the Filter box (#90) 3801fcd
@andreieftimie andreieftimie referenced this issue from a commit in andreieftimie/mozmill-dashboard
@andreieftimie andreieftimie Align filters via CSS (#90) ca608b3
@andreieftimie andreieftimie referenced this issue from a commit in andreieftimie/mozmill-dashboard
@andreieftimie andreieftimie Use em instead of px and reduce label width (#90) 83a68c6
@andreieftimie andreieftimie referenced this issue from a commit in andreieftimie/mozmill-dashboard
@andreieftimie andreieftimie Align filters via CSS (#90) f89bf0e
@andreieftimie
Collaborator

Merged as f89bf0e
And pushed to all instances.

@whimboo
Owner

Wonderful. Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.