Bug 146248 - Web Inspector: Pad ruler selection area by 1px in the Rendering Frames timeline overview
Summary: Web Inspector: Pad ruler selection area by 1px in the Rendering Frames timeli...
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Web Inspector (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Normal
Assignee: Matt Baker
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2015-06-23 14:29 PDT by Matt Baker
Modified: 2015-07-07 12:59 PDT (History)
8 users (show)

See Also:


Attachments
[Patch] Proposed Fix (2.53 KB, patch)
2015-06-23 14:36 PDT, Matt Baker
no flags Details | Formatted Diff | Diff
[Image] New UI - zoomed in (215.94 KB, image/png)
2015-06-23 14:37 PDT, Matt Baker
no flags Details
[Image] New UI - zoomed out (215.95 KB, image/png)
2015-06-23 14:37 PDT, Matt Baker
no flags Details
[Patch] Proposed Fix (7.67 KB, patch)
2015-07-06 20:20 PDT, Matt Baker
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Matt Baker 2015-06-23 14:29:14 PDT
* SUMMARY
Pad ruler selection area by 1px in the Rendering Frames timeline overview.

Frame elements have 1px of left padding, but no right padding (since it would result in 2px gaps between frames). As a result, there is a nice 1px space between the left edge of the ruler selection and the first selected frame, but the right edge is flush against the last frame.
Comment 1 Radar WebKit Bug Importer 2015-06-23 14:29:49 PDT
<rdar://problem/21511319>
Comment 2 Matt Baker 2015-06-23 14:36:41 PDT
Created attachment 255433 [details]
[Patch] Proposed Fix
Comment 3 Matt Baker 2015-06-23 14:37:22 PDT
Created attachment 255434 [details]
[Image] New UI - zoomed in
Comment 4 Matt Baker 2015-06-23 14:37:43 PDT
Created attachment 255435 [details]
[Image] New UI - zoomed out
Comment 5 Timothy Hatcher 2015-06-23 14:45:47 PDT
Comment on attachment 255433 [details]
[Patch] Proposed Fix

View in context: https://bugs.webkit.org/attachment.cgi?id=255433&action=review

The zoomed in image shows the shading being off by 0.5px, what could cause that? Zoomed out looks fine.

> Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css:58
> +.timeline-overview.frames > .timeline-ruler > .shaded-area.right {
> +    -webkit-transform: translateX(1px);
> +}

Need to shift the right handle too.
Comment 6 Matt Baker 2015-07-06 20:20:18 PDT
Created attachment 256272 [details]
[Patch] Proposed Fix
Comment 7 Timothy Hatcher 2015-07-06 21:10:09 PDT
Comment on attachment 256272 [details]
[Patch] Proposed Fix

View in context: https://bugs.webkit.org/attachment.cgi?id=256272&action=review

> Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css:57
> +    -webkit-transform: translateX(0px);

Why is this needed?

> Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css:61
> +    -webkit-transform: translateX(5px);

5px seems like a lot, why not just 1px here too?
Comment 8 Matt Baker 2015-07-07 12:07:22 PDT
Comment on attachment 256272 [details]
[Patch] Proposed Fix

View in context: https://bugs.webkit.org/attachment.cgi?id=256272&action=review

>> Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css:57
>> +    -webkit-transform: translateX(0px);
> 
> Why is this needed?

It undoes -webkit-transform: translateX(-1px) declared in the rule set for .timeline-ruler > .header > .divider in TimelineRuler.css.

>> Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css:61
>> +    -webkit-transform: translateX(5px);
> 
> 5px seems like a lot, why not just 1px here too?

Using 1px  would effectively be -webkit-transform: translateX(-3px), as .timeline-ruler > .selection-handle.right is translated by 4px by default (TimelineRuler.css).
Comment 9 WebKit Commit Bot 2015-07-07 12:59:07 PDT
Comment on attachment 256272 [details]
[Patch] Proposed Fix

Clearing flags on attachment: 256272

Committed r186471: <http://trac.webkit.org/changeset/186471>
Comment 10 WebKit Commit Bot 2015-07-07 12:59:11 PDT
All reviewed patches have been landed.  Closing bug.