1171831 - Confusing footer for “Settings” page

Status: VERIFIED FIXED

(Marketplace Graveyard :: Consumer Pages, defect, P3)

Description

[Valentina Virlics [:vvalentina], Ecosystem QA]

Steps to reproduce:
1. Load MP-dev Settings page on your tablet (Android 4.2.1) in portrait mode https://marketplace-dev.allizom.org/settings
2. Observe the bottom of the page

Expected results:
There are no display or layout issues.

Actual results:
There are two Terms of Use (button and link), two Privacy Policy (button and link) and for admins two Reviewer Tools (button and link) and seems a bit confusing.

Notes/Issues:
Issue is reproducing on desktop, too, for browser dimensions between 700px and 1050px width.
Verified on FF41 on ASUS Transformer (Android 4.2.1)). Issue is reproducing on dev, stage and production.
Screenshot for this issue: http://screencast.com/t/AWkoAWUvQsgA

Comment 1

[Atique Ahmed Ziad [:atiqueahmedziad]]

@mark : Can you suggest which section should we have to hide? Should we hide the "#site-footer" upto 1050px?

Comment 2

[Mark Striemer [:mstriemer]]

I'd remove the hide-on-desktop class from .account-settings-links and instead add some CSS to hide the links at tablet width. You could add something to the `@media $base-tablet` section of account.styl or use the `media--base-tablet()` mixing like `.my-selector { +media--base-tablet() { /* base-tablet styles go here */ } }`.

Comment 3

[Atique Ahmed Ziad [:atiqueahmedziad]]

Attachment: pull request

Please review it.

Comment 4

[Mark Striemer [:mstriemer]]

https://github.com/mozilla/fireplace/commit/c1eba9a8a2796646183eda8ab8825be899a6db98

Comment 5

[Valentina Virlics [:vvalentina], Ecosystem QA]

Verified as fixed on MP-dev FF41(Win 7, Android 4.2.1)
Postfix screencast for desktop: http://screencast.com/t/f8j7OFWrEKB
Postfix screenshot for tablet: http://screencast.com/t/AsHaxLhiC6yU
I suppose the gray padding from Android tablet is intended or should the page footer be at the bottom of the page?

Comment 6

[Mark Striemer [:mstriemer]]

It would probably be ideal for the footer to be at the bottom of the page but I think the page is shorter than the screen so that's why we see the padding.

Comment 7

[Mark Striemer [:mstriemer]]

Attachment: Screen Shot 2015-06-17 at 13.39.31.png

Setting `body { background: white; }` makes it white but leaves the rest the same (on this page anyway). That might be better.

Comment 8

[Atique Ahmed Ziad [:atiqueahmedziad]]

Do i need to do any work?  Or is it okey?

Comment 9

[Valentina Virlics [:vvalentina], Ecosystem QA]

(In reply to Mark Striemer [:mstriemer] from comment #7)
> Created attachment 8623816 [details]
> Screen Shot 2015-06-17 at 13.39.31.png
> 
> Setting `body { background: white; }` makes it white but leaves the rest the
> same (on this page anyway). That might be better.

In Tablet ASUS Transformer(Android 4.2.1) in portrait mode, the gray padding remains (didn't turn into white, and the footer is still up) using FF41 or FF38; on Desktop the gray padding still exists but in other place. 
Is this the final form?
Please see the screenshots: http://screencast.com/t/DrCpAQy4r

Comment 10

[Mark Striemer [:mstriemer]]

The background is set to white on desktop and it is less likely this will occur since generally desktop computers only have a landscape mode. I don't think the background update is related to this bug so I'll file a new one.

Comment 11

[Valentina Virlics [:vvalentina], Ecosystem QA]

(In reply to Mark Striemer [:mstriemer] from comment #10)
> The background is set to white on desktop and it is less likely this will
> occur since generally desktop computers only have a landscape mode. I don't
> think the background update is related to this bug so I'll file a new one.

Closing bug.

Comment 12

[Mark Striemer [:mstriemer]]

Filed bug 1175918.