Skip to content
This repository has been archived by the owner on Mar 12, 2020. It is now read-only.

Login Screen CSS #120

Open
mymattcarroll opened this issue Apr 25, 2018 · 6 comments
Open

Login Screen CSS #120

mymattcarroll opened this issue Apr 25, 2018 · 6 comments

Comments

@mymattcarroll
Copy link

mymattcarroll commented Apr 25, 2018

Not sure if this is the right place to be putting these issues, or if we should be going straight to AWS Support, anyway here goes...

We have been attempting to make the login screen look a little bit more like our application (which is using AngularJS Material) but have run into a few issues.

As you can see from the screen shot below, we have been able to hide the <label> elements on the signin and signup screens

image

Although, the <label>s on the reset password screen does not have the same classes on the <label> elements. Also the inputs do not have placeholders like the signin and signup screens

image

Would it be possible to upload a favicon.ico file as all screens have an empty favicon which does not look very professional.

We would also like to change the background colour of the screen from the murky grey. There does not seem to be any options to change CSS outside of the modal.

Lastly, we would like all button text to be in uppercase.

@jollsker
Copy link

I think theese are the properties that you can change
https://docs.aws.amazon.com/cognito/latest/developerguide/cognito-user-pools-app-ui-customization.html

@tonyjayfunk
Copy link

Hi, have you had an answer to your issues by any chance. Hitting the same problems.
Cheers

@mrcoles
Copy link

mrcoles commented Jul 14, 2019

We would also like to change the background colour of the screen from the murky grey. There does not seem to be any options to change CSS outside of the modal.

@mymattcarroll have you had any luck with changing the gray body background?

Similarly, I’d love to be able to do something like:

body { background: #fff; }
.modal-content { box-shadow: none; }

@mymattcarroll
Copy link
Author

Was only able to update it using the API directly, not via the console.

https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/CognitoIdentityServiceProvider.html#setUICustomization-property

@mrcoles
Copy link

mrcoles commented Jul 15, 2019

Yeah, that works for some things, but body is rejected (and so is .modal-content).

  message: 'The CSS class body is not in the list of allowed classes.',
  code: 'InvalidParameterException',

@shortstack
Copy link

Would also love to have this capability.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants