Page MenuHomePhabricator

Consider theme colors for popover panels
Closed, ResolvedPublic

Description

Presently pop-over panels (in Places and Reading lists) are not themed:

Screen Shot 2018-02-05 at 1.35.37 PM.png (1×752 px, 353 KB)

Popovers are currently using a translucency, so one option to preserve translucency with a darker presentation is setting the main view's background color to something like black with ~20% alpha (alpha in the color itself not the view's alpha):

Screen Shot 2018-02-05 at 1.36.36 PM.png (1×752 px, 341 KB)

(would also need to tweak text colors a bit)


Proposed solution

  • Utilize the same overlay colors for Sepia mode
  • Utilize new overlay colors for Dark and Black mode
    • Change the base of the overlay to be B18: Mesosphere Gray (eg. #43464a) with alpha 80%
    • Change the CTA button to A75: Stratosphere Blue (eg. #69F)
    • Change text and close button color to B90: Snow White (eg. #F8F9FA)

Mocks and redlines

Event Timeline

Mhurd renamed this task from Theme colors for popover panels to Consider theme colors for popover panels.Feb 5 2018, 10:00 PM
cmadeo updated the task description. (Show Details)
cmadeo subscribed.

Testing criteria

  • to trigger a popover panel cold-stop the app, then enable airplane mode, then restart the app. you should see an "Unable to re-establish log in" popover
  • to test that the popover is being themed switch to a theme then repeat the step above, repeat for each theme

There are screenshots of popovers for each theme on the PR ( https://github.com/wikimedia/wikipedia-ios/pull/2157 ) so you can see how the popover should be colored for each theme.