mozilla-mobile / firefox-ios

Firefox for iOS
Mozilla Public License 2.0
12.23k stars 2.93k forks source link

Recently Visited shadow is different from other sections #13710

Closed data-sync-user closed 6 months ago

data-sync-user commented 1 year ago

The Recently Visited section on homepage shadow is only on the bottom of the section, it should be all the way around like the other homepage sections.

Technical reason for this: The recently visited section is made up of a bunch of cells that are put together to appear as one section - but technically we cannot just add a shadow to the whole section, we have to add to each cell.

Design solutions: each item is its own cell; the background is static while the items scroll (but then it would not go off the edge)

┆Issue is synchronized with this Jira Task

data-sync-user commented 1 year ago

➤ Daniela Arcese commented:

Michael Verdi is this an accurate description of the issue?

data-sync-user commented 1 year ago

➤ Michael Verdi commented:

This section should have the same shadow as all the other sections have.

data-sync-user commented 1 year ago

➤ Daniela Arcese commented:

This is not a simple fix - would require a refactor

data-sync-user commented 1 year ago

➤ Winnie Teichmann commented:

This is not possible with the current design.

I tried using a decoration view for the section. Decoration views don't scroll when the content of the section is scrolled and so we end up with situations like this:

!Simulator Screenshot - iPhone 14 Pro - 2023-04-21 at 13.25.17.png|width=1179,height=2556!

I additionally tried adding a supplementary view to the first item with the same size as the section (minus the header). With that the background scrolls but the background disappears when the first item is disappearing off screen e.g. when 3 columns are displayed and the user scrolls to see the third column. With this solution there is also a limitation with how the items can be displayed: having columns is not possible. Items would be displayed in one long horizontally scrolling line.

Suggestions: If we want to keep the the 3 column design I suggest to remove the rounded corners and leading + trailing space and have the white background cover the whole width of the device. With that we can add a decoration view for the section that has shadows.

Alternatively we could drop the horizontal scrolling and re-design the content so that it scrolls vertically like most of the rest of the content of the homepage.

Or every item displayed would be it's own "card" with rounded corners and shadows.

github-actions[bot] commented 7 months ago

This issue has been automatically marked as stale. Has the issue been fixed, or does it still require the community's attention? Please leave any comment to keep this issue opened. It will be closed automatically if no further update occurs in the next 30 days. Thank you for your contributions!

github-actions[bot] commented 6 months ago

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue linking to this one, with up-to-date information. Thank you!