[Feature] Improve the UI design

[eduardconstantin]

The current design is a bit too dark. I am open to any suggestions about improving the UI design, making it more pleasing.

[etnlbck]

Are you thinking of having something like a toggle between light and dark? Either via a button or detecting user system preferences?

[eduardconstantin]

I was thinking to lighten the dark UI a little bit. I think the shades are too dark. If you think having a dark and a light mode could improve the UI you can try to implement it.

[etnlbck]

I agree. It could use more contrast with a subtle gradient to give dimension. You can assign this issue to me.

[etnlbck]

How do you feel about this for lightening the dark UI?

I also added a responsive class so users can use it on mobile.

[eduardconstantin]

I think it's too much gradient. I don't think anyone will use the mobile version but is a nice addition. Also could you add a margin on the top and bottom? let's say 2-3rem maybe

[etnlbck]

Sounds good. And I agree. The user isn't going to copy/paste their component on mobile.

I'll make the adjustments this evening.

Also, I ran into an issue with theme context and RSC. I haven't worked with RSC before.

[eduardconstantin]

@etnlbck Sounds great! RSC you mean react styled components? Because the project is using tailwind for styling.

[etnlbck]

React Server Components.

Next was cranky when I tried to add the useState hook, because it can only be used on the client. Then I tried adding the recommended "use client" annotation. But since the metadata is exported it gets treated a server.

[eduardconstantin]

I see, server components are the trouble, maybe tailwind can help

[eduardconstantin]

You can leave the theme toggle and focus on the UI for now. Maybe you can create an issue for the toggle.

[etnlbck]

I'll do that. So That I'm not holding up this issue.

[etnlbck]

does this fall in line with what you're thinking.

[eduardconstantin]

this looks nice