RDM new design - a bit of spacing polish

RESOLVED FIXED in Firefox 65

Status

enhancement
P3
normal
RESOLVED FIXED
9 months ago
6 months ago

People

(Reporter: victoria, Assigned: gl)

Tracking

unspecified
Firefox 65

Firefox Tracking Flags

(firefox65 fixed)

Details

Attachments

(3 attachments, 1 obsolete attachment)

Reporter

Description

9 months ago
Posted image image.png
Image attached of the bits of spacing polish we need.
Assignee

Updated

9 months ago
Priority: -- → P3

Comment 1

8 months ago
@Victoria is this a good first bug to work on? I'll be glad to give it a try.
Thanks Anshika
Reporter

Comment 2

8 months ago
Yes, that would be great! Let us know here or in DevTools slack (https://devtools-html-slack.herokuapp.com/) if you have any questions.
Reporter

Comment 3

7 months ago
One other tiny polish thing would be to remove the dotted focus ring from the custom user agent field, since it already has the blue focus ring :)

Anshika, just wanted to check, are you still interested in working on this bug?

Comment 4

7 months ago
I am actually quite caught up. Anyone can feel free to work on this.
Assignee

Updated

7 months ago
Assignee: nobody → gl
Status: NEW → ASSIGNED
Reporter

Comment 5

7 months ago
As discussed, we are going to group the device selector back with the other controls in centered RDM.

(The original idea to split them was for visual balance and to give the toolbar a heading, but this came with poorer usability of having the selector too far away from the other controls.)

Another little thing: There's a few px too much vertical space between the viewport and the toolbar - it should match the left spacing in left-aligned mode.
Posted image image.png
The 'Responsive' drop down label (rendered on the left side) shrinks to almost nothing when making the browser window thinner. This makes the text unreadable (see the attached screenshot). Can you avoid that?

Honza
Flags: needinfo?(gl)
Assignee

Comment 8

6 months ago
(In reply to Jan Honza Odvarko [:Honza] (need-info? me) from comment #7)
> Created attachment 9026359 [details]
> image.png
> 
> The 'Responsive' drop down label (rendered on the left side) shrinks to
> almost nothing when making the browser window thinner. This makes the text
> unreadable (see the attached screenshot). Can you avoid that?
> 
> Honza

I am gonna block this bug on Bug 1493745, which should fix this issue.
Blocks: 1493745
Flags: needinfo?(gl)
Assignee

Comment 9

6 months ago
Attachment #9025706 - Attachment is obsolete: true
Attachment #9025706 - Flags: review?(odvarko)
Attachment #9026529 - Flags: review?(odvarko)
Assignee

Updated

6 months ago
No longer blocks: 1493745
Assignee

Comment 10

6 months ago
I landed a fix from Bug 1493745 that should make the shrinking problem go away. This patch should be reviewable now.
Comment on attachment 9026529 [details] [diff] [review]
1488972.patch [1.0]

Review of attachment 9026529 [details] [diff] [review]:
-----------------------------------------------------------------

Looks good (also Network monitor is not broken)

Only one small comment, the original screenshot (from comment #0) indicates that there should be a bit more horizontal space before "viewport-dimension". The patch doesn't seem to solve this.

But, I won't block on this.

R+ assuming Try is green

Thanks for making the UI better!

Honza
Attachment #9026529 - Flags: review?(odvarko) → review+

Comment 12

6 months ago
Pushed by gabriel.luong@gmail.com:
https://hg.mozilla.org/integration/mozilla-inbound/rev/8a54a4fa7f4c
Adjust horizontal spacing for the dropdown menu buttons. r=Honza

Comment 13

6 months ago
bugherder
https://hg.mozilla.org/mozilla-central/rev/8a54a4fa7f4c
Status: ASSIGNED → RESOLVED
Last Resolved: 6 months ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 65
You need to log in before you can comment on or make changes to this bug.