Auth page should only show what's needed for auth and no other UI elements #351

Closed
opened 2023-11-03 15:09:45 +01:00 by aylamz · 9 comments
Member

This is how Mastodon's looks like for example:
mastodon-auth.png

Iceshrimp currently:
iceshrimp-auth.png

This is how Mastodon's looks like for example: ![mastodon-auth.png](/attachments/a055c8c5-687b-4d38-863f-6c7c03b7466d) Iceshrimp currently: ![iceshrimp-auth.png](/attachments/888190e7-31a4-460c-a063-18e597e559e7)
aylamz added the
enhancement
frontend
labels 2023-11-03 15:09:45 +01:00
aylamz changed title from Auth page should only show what's need for auth and no other UI elements to Auth page should only show what's needed for auth and no other UI elements 2023-11-03 15:10:08 +01:00
zotan self-assigned this 2023-11-03 15:11:25 +01:00
Member

I propose a css.

.widgets-container, .sidebar {display: none;}

._section {
    background: var(--panel);
    padding: 20px 32px;
    border-radius: var(--radius);
    font-size: 1.05em;
    text-align: center;
}

._permissions_1dbad_5 {
    justify-content: center;
    padding-top: var(--margin);
}

image

But it lacks the information of which account is concerned.
And it would be very practical to be able to switch to another account by clicking on it (as is currently the case on the top left).

Like this :
image

I propose a css. ```css .widgets-container, .sidebar {display: none;} ._section { background: var(--panel); padding: 20px 32px; border-radius: var(--radius); font-size: 1.05em; text-align: center; } ._permissions_1dbad_5 { justify-content: center; padding-top: var(--margin); } ``` ![image](/attachments/1208cc28-78a7-410c-959e-2b6c73a78eb6) But it lacks the information of which account is concerned. And it would be very practical to be able to switch to another account by clicking on it (as is currently the case on the top left). Like this : ![image](/attachments/3935030c-37f7-4e7c-ba18-8283304d8fe0)
Author
Member

Yeah something like this could work. The account name or handle should also be visible.

Yeah something like this could work. The account name or handle should also be visible.

In my opinion, the auth page should be statically rendered, without js, so that it works on all platforms, even ones that dont have JS. I think the FE is too bloated in that regard anyways. Thoughts?

In my opinion, the auth page should be statically rendered, without js, so that it works on all platforms, even ones that dont have JS. I think the FE is too bloated in that regard anyways. Thoughts?
Owner

Yeah, that sounds good. This would also fix login in the in-app browser in Tusky.

Yeah, that sounds good. This would also fix login in the in-app browser in Tusky.
Owner

Will start work on this in a minute.

Will start work on this in a minute.
Owner

How is this?

image

Clicking on the avatar opens the account switcher dropdown, like the sidebar would. All other UI elements aren't just hidden but not drawn in the first place.

How is this? ![image](/attachments/2720f530-0da8-45b7-9d1a-ddae2d3c7fd5) Clicking on the avatar opens the account switcher dropdown, like the sidebar would. All other UI elements aren't just hidden but not drawn in the first place.
125 KiB
Owner

A variant without JS will take a lot more work, I'm not sure if it's possible within our current framework (VueJS), might need something different for this route specifically

A variant without JS will take a lot more work, I'm not sure if it's possible within our current framework (VueJS), might need something different for this route specifically
Owner

As this implements basically everything that was suggested that's doable with the current framework, I'm pushing this. If we want a NoJS login form that should be a new issue.

As this implements basically everything that was suggested that's doable with the current framework, I'm pushing this. If we want a NoJS login form that should be a new issue.
Owner

Resolved in 79eb756824494603e9d6c8383791ac0730beaee8

Resolved in 79eb756824494603e9d6c8383791ac0730beaee8
zotan closed this issue 2023-11-04 00:35:29 +01:00
Sign in to join this conversation.
No milestone
No project
No assignees
4 participants
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference: iceshrimp/iceshrimp#351
No description provided.