jurrejansen
commented
6 days ago @DonKoko is there a demo environment or something like this where I can check how the maximizing / minimizing works with the Mintlify sidebar component?
I agree let's make it more compact in general. The current implementation of what you pushed to testapp looks pretty good. However there are issues when sidebar is minimized and the stroke width of icons and text doesn't feel right. Spent a bit of time on design and basically looks like what you implemented but I would like to be very specific with paddings / spacings / stroke width, etc.
https://www.figma.com/design/ykvc0MhPeNLsrJ4tJsKosQ/Shelf-%7C-UX-Scenarios?node-id=6460-2198
https://github.com/Shelf-nu/shelf.nu/assets/76112272/bb92489c-ad4b-4266-a66c-912bac005e63 https://github.com/Shelf-nu/shelf.nu/assets/76112272/3ed33b91-a53a-4fe1-b198-8df3840a92a9
The slight color difference between icon and text is intentional. I personally like it but let's see.
Using the Radix Icons would drastically limit the amount of icons we can use. Would prefer to find a procedure that works for using the Untitled UI ones.
The sidebar was the only place where they were looking good and contained actually. Besides the edited icon for scanning I provided and the the one for Calendar. Stroke width was too thin. But if we can figure out a procedure to make the icons look good and consistent for the elements down below we're good.
DonKoko
@carlosvirreira @jurrejansen, so as we discussed before I was a bit triggered by our sidebar. I feel like the menu items are too huge and the icons are very big and bulky with very wide stroke. Also our icons have different color than the text so that also looks not so great. Especially when i compare it to some other sidebars that look so much cleaner.
Mintlify example:
I also really like how their close/open works. Also this part is kinda messy in terms of code and I think it should be in general cleaned up and made easier to maintain and work with.
I would also like to consider the idea of using radix icons in the sidebar, as they just work. We dont need to export and do some shenanigans for each icon for it to work. https://www.radix-ui.com/icons
I have deployed this to testapp(https://github.com/Shelf-nu/shelf.nu/actions/runs/9713220465) so u can see it and lmk what u think. Its very experimental for now.