1822211 - Spotlight center layout: support vertically oriented buttons box for additional_button

Status: RESOLVED FIXED

(Firefox :: Messaging System, enhancement, P1)

Description

[Shane Hughes [:aminomancer]]

Attachment: A design example of the desired layout

We want to support designs like the one attached, with two CTAs aligned vertically, plus a secondary text-link CTA at the bottom. But currently, the only way to get 3 CTAs (not counting dismiss button or top-aligned secondary CTAs) in a legacy spotlight like this is to use additional_button, which is placed in a box with the primary_button which flows horizontally.

Should be a pretty simple fix. We just need to add some kind of message property for Spotlight, which results in the additional button box getting flex-direction: column.

Unfortunately, as far as I can tell, there isn't any way to do this with configurable styles, so we can't do an experiment with this vertical layout on existing Fx versions. But since design is heading in this direction, we should land support for this ASAP so we can start targeting current Fx versions for experiments on these new designs.

Comment 1

[Shane Hughes [:aminomancer]]

Attachment: The closest implementation we can currently achieve to the previous design example

Here's the closest implementation we can currently achieve to the previous design example.

Comment 2

[Shane Hughes [:aminomancer]]

Attachment: Bug 1822211 - Add vertical button layout for center layout Spotlight. r=#omc-reviewers

Comment 3

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/619439997a12
Add vertical button layout for center layout Spotlight. r=omc-reviewers,barret

Comment 4

[Atila Butkovits]

https://hg.mozilla.org/mozilla-central/rev/619439997a12