Skip to content
This repository has been archived by the owner on May 22, 2021. It is now read-only.

The blue down arrow wrongly exceeds the "Downloads" button area when the browser is resized to mobile view #820

Closed
SoftVision-CosminMuntean opened this issue May 23, 2018 · 3 comments
Labels
good first issue [QA]:Normal issue Label for QA to mark normal issues logged [QA]:Verified fixed Label for QA to mark verified fixed issues skill:css

Comments

@SoftVision-CosminMuntean

[Affected versions]:

  • Firefox 60.0.1 and up
  • Safari 11.03
  • Microsoft Edge 41.16299.402.0

[Affected Platforms]:

  • All Windows
  • All Mac
  • All Linux

[Steps to reproduce]:

  1. Start Firefox browser and navigate to https://send.dev.mozaws.net/.
  2. Upload a file.
  3. Reduce the size of the browser window until mobile view is reached.
  4. Observe the down arrow from the "Downloads" button.

[Expected result]:

  • The arrow is correctly displayed in the button.

[Actual results]:

  • The down arrow is moved outside of the "Downloads" button.

[Notes]:

  • This issue is also reproducible on stage and prod servers.
  • The issue is not reproducible on Chrome.
  • Here is a screen recording with the issue:
    blue down arrow
@SoftVision-CosminMuntean SoftVision-CosminMuntean added the [QA]:Normal issue Label for QA to mark normal issues logged label May 23, 2018
@johngruen
Copy link
Contributor

I bet if we just made the selector block level on responsive views this would get fixed

@SoftVision-CosminMuntean
Copy link
Author

I have verified this issue on Send dev website and is partially fixed. The arrow is moved to the next row if the browser is resized to its minimum.

Here is a screen recording with the issue:
down arrow

@dannycoates
Copy link
Contributor

yeah that's as good as it's going to get. we could set a min-width on the page, but meh.

@SoftVision-CosminMuntean SoftVision-CosminMuntean added the [QA]:Verified fixed Label for QA to mark verified fixed issues label Jun 7, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
good first issue [QA]:Normal issue Label for QA to mark normal issues logged [QA]:Verified fixed Label for QA to mark verified fixed issues skill:css
Projects
None yet
Development

No branches or pull requests

3 participants