Possible UI redesign

[steveiliop56]

Hello everyone,

I was wondering if anyone would be interested in some sort of redesign in the UI. I chose mantine because it was simple to get started but now I feel like it looks quite basic compared to the login screen that pocket ID offers for example which is a masterpiece! I currently don't have any ideas on a possible redesign but I would be interested in seeing yours. To give you some context I believe we should keep that simple flat look and allow the possibility for UI extensibility in the future like a simple settings screen. What do you think?

[erwinkramer]

Maybe some CSS extensibility if you want to make it flexible. I personally love this one https://github.com/scalar/scalar/blob/a9f232ad2a1eb6ae4edefa3c235e075901ced846/packages/themes/src/presets/deepSpace.css

[steveiliop56]

Yeah that's one reason I want to change the UI, with mantine it will be terribly hard to customize the css especially when running in production.

[GentleHoneyLover]

What'd be great is an ability to set your own favicon and webpage title. To white-label the page... ;)

[steveiliop56]

I considered setting a custom title but the implementation didn't satisfy me. The issue is that the app loads with the "Tinyauth" title and then it fetches the user context and app context which includes the user settings like the login screen title. Since this happens before the rendering I can set the login title to whatever you set but the page title will have a flash of "Tinyauth" and then will change to your own title which I didn't like that's why I decided to not include it. Same deal with the favicon.

[riwich]

For me personally, the current login screen is absolutely sufficient. As the name suggests, Tinyauth, I appreciate the simplicity and ease of Tinyauth and I don't need ‘eye candy’.

OK, that doesn't mean that nothing ‘should’ be changed in terms of appearance, but I would rather prioritise functional optimisations.

Wherever the journey goes, I'm a big fan of Tinyauth!

[notfixingit3]

Not sure if this helps or not, but it would be nice to have a name or logo on the login screen, for no other reason than having something to let users know they are on the correct login screen. Maybe move Tinyauth down to the bottom of the login screen with something like "Powered By" and then where TinyAuth is current displayed just load a 128x128 blank transparent png (or what ever size etc makes sense). Then it can be overwrote with a volume mount like ./mylogo.png:/path/to/tinyauth_transparent.png

At worst, hopefully this will spark an idea

[steveiliop56]

You probably got the new UI in v3.4.0. I didn't manage to include all the suggestions but I hope you like it!

[gatodelcaribe]

I know we have APP_TITLE and BACKGROUND_IMAGE, Can we change the Favicon / Tittle of the website? Maybe adding a "powered by TinyAuth" or making a Donation to the author for White label option, so we can support Steve too.

Asking it due have better control on the logging zone and know where I'm logging, like @notfixingit3 is saying.

The BACKGROUND_IMAGE only work with URL doesn't work with local images.

[steveiliop56]

There is an open pull request here #306

[gatodelcaribe]

Thanks i'll check it.

On this bug:
"The BACKGROUND_IMAGE only work with URL doesn't work with local images." there is a pull too?

[steveiliop56]

It's not really bug it's just not implemented. Tinyauth v4 will support local assets though.