Add support for more custom branding

[jespino]

Summary

Ticket Link

Screenshots

Release Note

[mm-cloud-bot]

@jespino: Adding the "do-not-merge/release-note-label-needed" label because no release-note block was detected, please follow our release note process to remove it.

I understand the commands that are listed here

[matthewbirtch]

This is really great @jespino. Amazing work!

A few things in my initial pass. I thought I would share these for now. I may have more, but this is a good starting point to fix.

1. Can we move the fields around a bit in the system console? I'd like to put the logo fields and favicon field at the top (under site name) so all the login fields are grouped together below that.

2. For the labels, can we have (Enterprise) at the end of the label rather than the beginning? I know you mentioned you'll be updating the labels, so let's do this as well in advance of the UI improvements.

3. For the favicon, there area actually a lot more images we could generate for the app touch icons. I was thinking we could require a 512x512 image for the favicon and then output all the necessary images. I'm not sure how big of a lift this is to generate all these possible files though.

4. In the system console config, there are two fields with the same label (Enterprise Only) Login page background color:. I think the first one is supposed to be Login page text color.

5. For the 'logo for dark backgrounds' image preview in the system console, can we add a dark background to the preview container?

6. On the login page, when I view on smaller window sizes, it looks like some colors are not getting customized properly. In the example below, you can also see that the logo for dark backgrounds in not getting applied.

7. On the login page, can we remove the bottom margin on the custom brand image? There seems to be too much of a gap between the image and the title

8. On the create account page, when there is a custom brand image, we remove the Let's get started' title and make the image really big. Can we just make this layout consistent with the login screen so that the Let's get started` title remains, but the custom brand image shows above? Also, can we left-align the text that appears below? Again, to be consistent with the login screen layout.

   • For comparison, here's the login page:
     

   • Here's the create account page:
     

9. On the login/account creation pages we need to also adjust the colors on the input fields so they use the custom login form text colors. We should keep the existing opacities on the input fields for the borders and text, but use the custom color rgba values to override the default input colors. Otherwise, the input field's boundaries aren't clear and it becomes a usability issue.
   

10. The 'Back' button on the create account screen should use the login page button bg color instead of the login page text color

11. The footer links need to use the login page text color (but keep existing opacities) otherwise they can become illegible (see above screenshot)

12. I tried the Quartz theme and it looks like the logo is not flipping to the one used for light themes in the global header. Is that part supposed to be working? When using custom themes, the logo doesn't seem to swap to the appropriate dark/light either.
    

I'll likely have more as I continue reviewing and playing around, but wanted to call these out for now.

[matthewbirtch]

One other item I just noticed:

Right now, I can't show the footer links unless I have custom branding enabled. This should not be the case. These footer links should always be there. The enterprise-only feature here is to be able to hide these links

[jespino]

1. Done

2. Done

3. We can do it, not a big deal, but in my opinion is low priority for now (We can do it later with more validation).

4. Done

5 Done

6. The logo selection based on the background color is done, I haven't done anything else around this.

7. I think you already fixed that

8. Again I think you already fixed that.

9. I think you already did it

10. I think you already did it

11. I don't even know if that is fixed

12. This is fixed now