Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add support for sub-header text in Login component #1487

Closed
mcoker opened this issue Feb 26, 2019 · 3 comments
Closed

Add support for sub-header text in Login component #1487

mcoker opened this issue Feb 26, 2019 · 3 comments
Assignees
Milestone

Comments

@mcoker
Copy link
Contributor

mcoker commented Feb 26, 2019

Related to #354

Need to add support for the "Log in to Application" text as seen on https://rawgit.com/patternfly/patternfly/master-dist/dist/tests/login-single-sign-on.html

Details to come.

cc @tlabaj @mceledonia

@mceledonia
Copy link

mceledonia commented Feb 26, 2019

Let's go with small text style (14px) left-aligned underneath the header with spacing: 16px top, 32px below.. on mobile the language selector should go below the description and above the inputs.

image

@mcoker
Copy link
Contributor Author

mcoker commented Mar 4, 2019

@mceledonia the bottom spacing is a bit different. After the header text currently, there is 16px bottom padding on the header, then the hidden error message, and then 24px (lg) spacer as the gap between the error message and first form field.

Here I just left all of the existing spacing the way it is and added the sub-header text (description) with 16px between it and the content above it. Then on mobile, there is 16px between the title, description, and dropdown.

Desktop

screen shot 2019-03-04 at 5 11 50 pm

Desktop with error

screen shot 2019-03-04 at 5 11 52 pm

Mobile

screen shot 2019-03-04 at 5 12 36 pm

Mobile with error

screen shot 2019-03-04 at 5 12 46 pm

I think it looks OK, but the spacing between the description and error on desktop seems too tight. Here it is with an 8px (sm) spacer below the description on desktop only.

Regular

screen shot 2019-03-04 at 5 23 59 pm

Error

screen shot 2019-03-04 at 5 24 02 pm

@mceledonia
Copy link

This all looks great, thanks @mcoker !!

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

No branches or pull requests

3 participants