1352563 - Build Customizable UI for Focus Promotion

Status: RESOLVED FIXED

(Firefox for iOS :: Browser, enhancement, P1)

Description

[:sdaswani]

This basically looks like an ad rectangle at the bottom of the screen.

Comment 1

[:sdaswani]

We need more info on how to structure the promo for customization.

Comment 2

[:sdaswani]

Attachment: pasted_image_at_2017_04_05_17_46_720.png

iphone UI

Comment 3

[:sdaswani]

Attachment: pasted_image_at_2017_04_05_17_46_720-1.png

ipad UI

Comment 4

[:sdaswani]

Create a LP variable as a dictionary that contains all the customizable elements:
- background color
- Top Text
- Button Text
- Button 'deep link' (URL to open another app or a screen in current app)

Comment 5

[:sdaswani]

Robin, will you be able to specify the background color of the Promo UI as a six-character hex string, e.g., 0xFF13FC ?

Comment 6

[Bryan Munar (:bkmunar)]

Actually, we can just use the RGB int. I think Robin knows what that is. We already have the extension in the code!

Comment 7

[Robin Andersen [:tecgirl]]

Colors specs were attached to the Trello card (I usually do it here but we were using Trello, so…)

The hex and RGB color is #9012FE (alpha 40) and R144 G14 B254 A40

https://trello-attachments.s3.amazonaws.com/5876537a515b328f9da83ada/58c82d61513e6cbd2b0aaa96/7cd935ff55f6beb796b50b0038fcc58c/MMA-iOS-MVP-1-Layout-Specs.png

and I'll attach here as well.

Comment 8

[Robin Andersen [:tecgirl]]

Attachment: MMA-iOS-MVP-1-Layout-Specs.png

Comment 9

[:sdaswani]

Thanks for the specs Robin. And +1 to using the RGB int Bryan (e.g., R144 G14 B254 A40).

Comment 10

[Bryan Munar (:bkmunar)]

You know what, just kidding, the hex number would be fine -- sorry about that! No need for RGBs

Comment 11

[:sdaswani]

Bryan how does the Hex number encapsulate the alpha setting?

Comment 12

[:sdaswani]

Robin, should we also templatize the text color so we can handle different light/dark backgrounds? Also Bryan is still checking on how to incorporate Alpha into the Hex String.

Comment 13

[Bryan Munar (:bkmunar)]

http://stackoverflow.com/questions/15852122/hex-transparency-in-colors

Comment 14

[Robin Andersen [:tecgirl]]

(In reply to Susheel Daswani from comment #12)
> Robin, should we also templatize the text color so we can handle different
> light/dark backgrounds? 


Yes, we should! See attached.

Comment 15

[Robin Andersen [:tecgirl]]

Attachment: Leanplum Snippet iPhone.png

Comment 16

[Robin Andersen [:tecgirl]]

Attachment: MMA-iOS-Template-Layout-Specs.png

Comment 17

[Robin Andersen [:tecgirl]]

Attachment: Leanplum Snippet iPhone Landscape.png

Comment 18

[Robin Andersen [:tecgirl]]

Attachment: Leanplum Snippet iPad.png

Comment 19

[Robin Andersen [:tecgirl]]

Attachment: Leanplum Snippet iPad Landscape.png

Comment 20

[:sdaswani]

Merged in https://github.com/mozilla-mobile/firefox-ios/pull/2606/commits/cf540eb129150875d9b980a471eff8972ee6b51a#diff-3c6707ca508c97b210b46eab979e2667