Closed Bug 1253654 Opened 4 years ago Closed 3 years ago

Update section header UI in History panel

Categories

(Firefox for Android :: General, defect)

All
Android
defect
Not set

Tracking

()

RESOLVED FIXED
Firefox 50
Tracking Status
firefox50 --- fixed

People

(Reporter: antlam, Assigned: JanH)

References

(Blocks 2 open bugs)

Details

Attachments

(5 files, 1 obsolete file)

Attached image prev_history_mock4.png
Currently used in the History panel, but given the abundance of UX work that might be happening in this panel. These need a lighter UI to help clear the clutter and establish a better visual hierarchy.

NOTE: mock for the section headers only, the rest of the UI is not a part of this bug.
Flags: needinfo?(liuche)
From antlam: the text color should be #BFBFBF (@color/disabled_grey) not #363B40.
Flags: needinfo?(liuche)
JanH, if you want to continue working on home panels, this is another bug that you could take a look at!
Flags: needinfo?(jh+bugzilla)
I can take a look at it together with the other follow-up bugs.
Assignee: nobody → jh+bugzilla
Flags: needinfo?(jh+bugzilla)
(In reply to Jan Henning [:JanH] from comment #4)
> I can take a look at it together with the other follow-up bugs.

Awesome! thanks JanH!
(In reply to Jan Henning [:JanH] from comment #6)
> Created attachment 8769435 [details]
> Screenshot_2016-07-09-15-37-19.png

Looking good! 

Is it possible to remove the divider underneath the label? I.e. inbetween "Yesterday" and the first item underneath it.

To double check, does this follow the type specs in comment 1?

Thanks JanH!
Flags: needinfo?(alam) → needinfo?(jh+bugzilla)
(In reply to Anthony Lam (:antlam) from comment #7)
> Is it possible to remove the divider underneath the label? I.e. inbetween
> "Yesterday" and the first item underneath it.

I feel that the bottom padding/total height might be a bit too large now without the divider. But yes, it's possible.

http://archive.mozilla.org/pub/mobile/try-builds/mozilla@buttercookie.de-193130a3dd184fdc94461f4dd970afbd31fa33fb/try-android-api-15/fennec-50.0a1.en-US.android-arm.apk
Attachment #8769435 - Attachment is obsolete: true
Flags: needinfo?(jh+bugzilla) → needinfo?(alam)
(In reply to Jan Henning [:JanH] from comment #8)
> Created attachment 8770251 [details]
> Screenshot_2016-07-12-20-12-05.png
> 
> (In reply to Anthony Lam (:antlam) from comment #7)
> > Is it possible to remove the divider underneath the label? I.e. inbetween
> > "Yesterday" and the first item underneath it.
> 
> I feel that the bottom padding/total height might be a bit too large now
> without the divider. But yes, it's possible.
> 
> http://archive.mozilla.org/pub/mobile/try-builds/mozilla@buttercookie.de-
> 193130a3dd184fdc94461f4dd970afbd31fa33fb/try-android-api-15/fennec-50.0a1.en-
> US.android-arm.apk

This looks great! Thanks JanH! 

I don't think the "padding" is an issue. It's actually really helpful that it allows our eyes to just fall into the item and creates an obvious hierarchy for these sections. Especially when they're butted against each other like in your screenshot.

ship it! \o/
Flags: needinfo?(alam)
That way, the section headers (e.g. "Today", "Yesterday", "Last 7 days" etc.) blend better with the following item.

The correct hiding of the divider depends on the view type reported for the respective RecylerView child items. Because the view type is stored a simple number, this means that any other RecylerView wanting to use this divider decoration implementation must use the same item types as the history panel in order to remain compatible, otherwise the divider could be unexpectedly hidden. Therefore, we rename the DividerItemDecoration to underline its intended usage scope.

Review commit: https://reviewboard.mozilla.org/r/64306/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/64306/
Comment on attachment 8771052 [details]
Bug 1253654 - Part 1 - Update home panels section header styling.

https://reviewboard.mozilla.org/r/64304/#review61716
Attachment #8771052 - Flags: review?(liuche) → review+
Comment on attachment 8771053 [details]
Bug 1253654 - Part 2 - Don't show the item divider in the history panel after a section header.

https://reviewboard.mozilla.org/r/64306/#review61718

This looks great, thanks for picking up this bug :)
Attachment #8771053 - Flags: review?(liuche) → review+
Pushed by cbook@mozilla.com:
https://hg.mozilla.org/integration/fx-team/rev/1557fb4540f2
Part 1 - Update home panels section header styling. r=liuche
https://hg.mozilla.org/integration/fx-team/rev/23bdc280b66e
Part 2 - Don't show the item divider in the history panel after a section header. r=liuche
Keywords: checkin-needed
https://hg.mozilla.org/mozilla-central/rev/1557fb4540f2
https://hg.mozilla.org/mozilla-central/rev/23bdc280b66e
Status: NEW → RESOLVED
Closed: 3 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 50
You need to log in before you can comment on or make changes to this bug.