element-web
element-web copied to clipboard
element-hq
Margin between "Forgot password?" and SSO buttons
Steps to reproduce
- Logout from the session
- Re-login
Outcome
What did you expect?
The button should remain displayed with disabled state.
What happened instead?
The button disappears.
https://user-images.githubusercontent.com/3362943/159900205-56000c8a-c1ec-43bd-a5fc-40e3582ad5a7.mp4
Operating system
No response
Browser information
No response
URL for webapp
localhost
Application version
develop branch
Homeserver
No response
Will you send logs?
No
https://user-images.githubusercontent.com/60646682/160227287-e1f8ef1c-d580-4454-bbe0-948b76ad6d56.mov
I have tried to retain the sign in button here just let me know if it's good enough.
@AryaArunB unfortunately this issue was not up for grabs. A PR was already open https://github.com/matrix-org/matrix-react-sdk/pull/8143. I've assigned the original issue author @luixxiul back to this issue.
I guess the design proposed in the closed PR could work as well.
@AryaArunB Maybe creating another issue to discuss the design would be appreciated.
Design input
It looks like some ugly UX debt.
The correct way to handle it would be to use a busy state for the button (disabled button, loading spinner inside), so there are no UI reflows / layout shifts involved.
Unsure if we have such a busy state already that we can reuse.
Ref. https://github.com/matrix-org/matrix-react-sdk/pull/8143#issuecomment-1096612558
This issue is also back up for grabs now that there's no active PR assigned to it.
@sentinel-sam You're more than welcome to submit a fix, though our current policy is to wait until at least a draft PR has been submitted before assigning a new external contributor to an issue.
Ok, I'll be on stand by then. Meanwhile, I noticed the "Sign In" is an input, not button. How do we implement a loader spinner inside an input tag?
@turt2live Thanks! Other than being disabled, does that button busy state show any form of feedback on progress/activity (loading spinner or similar)?
We don't have a consistent design, but can put the spinner there. We tend to put the spinner in a convenient place rather than consistent.
Good to know that we can use it (we'll eventually fix any arbitrary inconsistencies). 👍
@Vijaykv5
Thank you for your interest in this issue. We will normally not assign the issue to an external contributor until they have provided at least a draft PR which is taking the right direction. For further details, see our guidance on assigning issues.
If you have any technical questions about this issue, you can ask for help in #element-dev:matrix.org
Given that we have upcoming changes for OIDC login, and it has been difficult to get design attention for this issue, I'm going to close this issue. Apologies to those who have put time into it. I think we probably should have asked for design input on the issue, before anyone worked on any code for this, and before we marked it as good first issue. We will attempt to do that in future.
