1212787 - Conversation controls look bad

Status: VERIFIED FIXED

(Hello (Loop) :: Client, defect, P1)

Description

[Mark Banner (:standard8)]

Attachment: Bad layout

This is a regression from bug 1209632 that I should have caught when reviewing.

The layout of the conversation icons for the controls now looks bad - see attached screenshot

Comment 1

[Mark Banner (:standard8)]

Attachment: Revert Loop's conversation toolbar button sizes due to bug 1209632 causing a visual regression.

This reverts the size of the buttons to what they were before and fixes the layout. Screenshots coming up in a moment.

Comment 2

[Mark Banner (:standard8)]

Attachment: Standalone view with original sized buttons

Sevaan: What do you think about reverting the conversation toolbar button sizes to the original - 28px high, 33px wide - rather than 24px by 24px.

We can do the work to make them smaller, but I think we'll need a new background for the mute buttons, and we might need a little more work to get the placement right. Not saying we can't/won't do it. Just seeing what the options are.

Comment 3

[Mark Banner (:standard8)]

Attachment: Desktop conversation window with original sized buttons

Comment 4

[Sevaan Franks [:sevaan]]

(In reply to Mark Banner (:standard8) from comment #2)
> Created attachment 8671286 [details]
> Standalone view with original sized buttons
> 
> Sevaan: What do you think about reverting the conversation toolbar button
> sizes to the original - 28px high, 33px wide - rather than 24px by 24px.
> 
> We can do the work to make them smaller, but I think we'll need a new
> background for the mute buttons, and we might need a little more work to get
> the placement right. Not saying we can't/won't do it. Just seeing what the
> options are.

Sure, I think that's okay to have the original size at the moment.

Comment 5

[Sevaan Franks [:sevaan]]

Comment on attachment 8671286 [details]
Standalone view with original sized buttons

+r but can we fix the margin on the left of the leave button to match the margin on the right of the Mozilla logo?

Comment 6

[Sevaan Franks [:sevaan]]

Comment on attachment 8671287 [details]
Desktop conversation window with original sized buttons

We should move the inset video in more to match the left and bottom margins of the control buttons.

Comment 7

[Mark Banner (:standard8)]

Attachment: Revert Loop's conversation toolbar button sizes due to bug 1209632 causing a visual regression.

This does the backout and also fixes the insert for the conversation toolbar - the hangup button was taking more width than it needed to. We can't change the width of the other buttons, but we can fix the width of just the hangup button.

Comment 8

[Dan Mosedale (:dmosedale, :dmose)]

Comment on attachment 8671574 [details] [diff] [review]
Revert Loop's conversation toolbar button sizes due to bug 1209632 causing a visual regression.

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

r=dmose with added comment

::: browser/components/loop/content/shared/css/conversation.css
@@ +60,1 @@
>  }

Please add a comment explaining why this override is necessary.

Comment 9

[Pulsebot]

https://hg.mozilla.org/integration/fx-team/rev/4a9f34794678

Comment 10

[Carsten Book [:Tomcat]]

https://hg.mozilla.org/mozilla-central/rev/4a9f34794678

Comment 11

[Bogdan Maris, Desktop QA]

Attachment: Screencast showing the issue

I can still see some issues with the controls after clicking on them both conversation and standalone, should I log a new bug on this?

Comment 12

[Mark Banner (:standard8)]

(In reply to Bogdan Maris, QA [:bogdan_maris] from comment #11)
> Created attachment 8682543 [details]
> Screencast showing the issue
> 
> I can still see some issues with the controls after clicking on them both
> conversation and standalone, should I log a new bug on this?

Yes please, I'm thinking they are possibly windows only as I've not seen them on this Mac.

Comment 13

[Bogdan Maris, Desktop QA]

(In reply to Mark Banner (:standard8) from comment #12)
> (In reply to Bogdan Maris, QA [:bogdan_maris] from comment #11)
> > Created attachment 8682543 [details]
> > Screencast showing the issue
> > 
> > I can still see some issues with the controls after clicking on them both
> > conversation and standalone, should I log a new bug on this?
> 
> Yes please, I'm thinking they are possibly windows only as I've not seen
> them on this Mac.

It reproduces across platforms (Windows 7 64-bit, Windows 10 64-bit, Mac OS X 10.11.1, Ubuntu 14.04 32-bit) but Firefox needs to be restarted before a call or use a clean profile.
Logged bug 1221486.

Also closing this bug since the initial issue with the wrong placement of the controls was verified across platforms using latest Firefox Developer Edition 44.0a1.