Closed Bug 1187278 Opened 5 years ago Closed 5 years ago

Evaluate variants for setting tabContentStart padding on "Scrollable Tabs"

Categories

(Firefox for Android :: Awesomescreen, defect)

42 Branch
All
Android
defect
Not set
normal

Tracking

()

RESOLVED FIXED
Firefox 42
Tracking Status
firefox42 --- fixed

People

(Reporter: sebastian, Assigned: sebastian)

References

Details

Attachments

(2 files)

There has been some discussion about the padding that has been added to the left-most tab when we switched to "scrollable tabs" (bug 1073053).

This has been added following the material design guidelines for scrollable tabs:
https://www.google.de/design/spec/components/tabs.html#tabs-types-of-tabs

In these guidelines for scrollable tabs (as opposed to fixed tabs) the left-most tab should align with the keyline, see:
https://material-design.storage.googleapis.com/publish/material_v_4/material_ext_publish/0B6Okdz75tqQsQ2l2R1lSU0hzZkE/components_tabs_usage_specs11.png

More on Material design and keylines here:
https://www.google.de/design/spec/layout/metrics-keylines.html

As we do not have anything else align with the keyline (for now) it takes some time getting used to this. In the guidelines the toolbar title is always aligned to this keyline as well - but we don't have anything like that.

I created some variations and attached an image showing them:

* Variation 1: That's how it's right now: 72dp padding from left to the start of the 'strip'.

* Variation 2: I think that's how it is actually meant in the guidelines: 72dp padding from left to the start of the tab title.

* Variation 3: No padding at all. Like 'Fixed tabs' in the guidelines.

* Variation 4: Aligning with top sites tiles, 12 dp.
I agree. Without some sort of title text there right now ("Page title" in the example above), it might make the most sense to pad it left aligned for now. 

If we go left align, I think the 12dp is nice as fixed tabs are butted right against the edge in Material. This 12dp gives us that separation, but also it aligns nicely with the current padding for our top sites tiles.

I'm ok with going for the 12dp for now :)
Assignee: nobody → s.kaspari
Status: NEW → ASSIGNED
I agree, 12 dp is my favorite too. How do we want to proceed on tablets? Our top sites tiles are centered there and 12dp will not create this effect of alignment.
Flags: needinfo?(alam)
I think we should keep this scope within Mobile for now. Tablets are trickier and maybe something we should leave until we get some help from the Support Lib
Flags: needinfo?(alam)
^ Sorry I probably could've been clearer.

I mean to say, let's leave the padding as you have it already (aligned to the same vertical break as the text in the input bar).
Bug 1187278 - Adjust tabContentStart for "scrollable tabs" on phones. r?mhaigh
Attachment #8639961 - Flags: review?(mhaigh)
Comment on attachment 8639961 [details]
MozReview Request: Bug 1187278 - Adjust tabContentStart for "scrollable tabs" on phones. r?mhaigh

https://reviewboard.mozilla.org/r/14261/#review13051

Ship It!
Attachment #8639961 - Flags: review?(mhaigh) → review+
url:        https://hg.mozilla.org/integration/fx-team/rev/be626b9af2fd4faae6d7be2d2f3790d9c73d8231
changeset:  be626b9af2fd4faae6d7be2d2f3790d9c73d8231
user:       Sebastian Kaspari <s.kaspari@gmail.com>
date:       Tue Jul 28 19:20:02 2015 +0200
description:
Bug 1187278 - Adjust tabContentStart for "scrollable tabs" on phones. r=mhaigh
https://hg.mozilla.org/mozilla-central/rev/be626b9af2fd
Status: ASSIGNED → RESOLVED
Closed: 5 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 42
You need to log in before you can comment on or make changes to this bug.