[PROPOSAL]: New layout

[vinpac]

Hey 👋

I love Ladle already. Its focus on performance is something I always wanted to see in Storybook. So, I wanna help it give a step forward to have a UI that matches its awesome engineering layers.

Here's is the design I made:

Light

Dark

Here are the steps I imagined for this project:

• Design the new UI
• Collect feedbacks
• Implement changes on the design after feedback
• Start PR with the new layout
• Finish first version of PR
• Get the PR Reviewed
• Implement requested changes
• Get the PR merged

If this layout is not what you expect, please, feel free to express your feelings.
Thanks for the attetion.

UPDATE
The PR is now open #101 as a draft

[wojtekmaj]

I think I've seen this somewhere 😂 Love it!

[nihgwu]

Love it, can we add a place for brand, and layout for mobile/tablet

[vinpac]

Seeing @wojtekmaj, I think Ladle deserves a more original look. It's not much, but I did a little tweak. Here's my take on mobile view too:

• I'm doing it all grey so I make sure the contrast is good for colorblindness. My plan is to make it easy to control colors. Probably through css variables.

[tajo]

Looks nice! I like the second version more since there is a more straightforward connection between the addon button and addon panel itself. Also, I would make the elements and text a bit bigger.

Some other notes:

1. It would be nice if the theme could be just an alternate swappable CSS (configurable through the config). So we can have multiple options, including the current one. We can reorganize the current layout's HTML if needed.
2. It needs to be responsive. So any theme should capture mobile, desktop, light and dark versions.

[vinpac]

Sure @tajo. Thanks for the feedback. I will draft the PR implementing it

[hennessyevan]

I also like the second one with the status bar, I think that's really great.

Can we take this top-level section heading UI from storybook? Looking at the designs in this thread it seems like the intent and a popular organizational approach is to have meta sections like "atoms" "molecules", etc. Having those as folders (especially that are collapsed by default) makes it hard to locate and discover components.