GithubHelp home page GithubHelp logo

[PROPOSAL]: New layout about ladle HOT 6 CLOSED

tajo avatar tajo commented on May 9, 2024 28
[PROPOSAL]: New layout

from ladle.

Comments (6)

wojtekmaj avatar wojtekmaj commented on May 9, 2024 5

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

from ladle.

tajo avatar tajo commented on May 9, 2024 2

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.

from ladle.

vinpac avatar vinpac commented on May 9, 2024 1

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.

Light

13 Pro - 1

13 Pro - 2

from ladle.

vinpac avatar vinpac commented on May 9, 2024 1

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

from ladle.

nihgwu avatar nihgwu commented on May 9, 2024

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

from ladle.

hennessyevan avatar hennessyevan commented on May 9, 2024

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.

image

from ladle.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.