A similar package about css-verbose HOT 12 CLOSED

Yeah, sounds interesting, do you think I could add shorthand functions and units helpers ?

from css-verbose.

I was thinking about them too: padding: padding(50, 3) the problem with this is the duplication. In theory this would be a bit better: ...padding(50, 3).

Me and @geelen where thinking about an even better syntax:

const className = css
  .display('block')
  .padding(50, 3)

The benefit of chaining here is that:

• you don't need to import every function, which is very annoying
• there is 0 duplication
• it could be fully typed, even the values, if we provide an API without using compound values like '1px solid red'

I think we could make this all part of the css-functions package.

Also, we can allow using both, just direct functions import by using full path to the function file like it is now in css-functions, as well as using one entry which is the index.js then and it will include the entire api.

from css-verbose.

I saw the problem with duplication too, that's why I first thought to a "quiter" helper like: padding: __(50, 3) but it's not really meaningful.

This chaining system sounds really good, although it's semantically different from the standard CSS "object" approach used in both CSS and CSS-in-JS. But I think it could be more convenient, we could even provide a Typescript definitions file.

from css-verbose.

Exactly, typescript, flow. It can compile to regular cssinjs objects now or to ISTF in the future once it is adapted by the majority of libraries. So at some point it could be even converted by a babel plugin to ISTF at build time.

But for now, it could be a nice functional interface, running at runtime.

from css-verbose.

Sounds neat, I'm into it!

from css-verbose.

Would you like to collaborate on this at the css-functions repo? I will add you as a collaborator.

from css-verbose.

Okay let's do that, does that mean we should rewrite the package for the chaining system or build it on the top of your core ?

from css-verbose.

I think we can pretty much do on top, currently you can include each function separately, which is fine. We can just add an entry point which provides the chaining api and uses all other functions defined as standalone modules.

from css-verbose.

also cc @rofrischmann

from css-verbose.

Okay, I'll create a new branch and start working on that as soon as possible.

from css-verbose.

Cool, feel free to create a PR if you want to talk about implementation details or issue if you want to discuss something in advance.

from css-verbose.

No problem, I'll close this issue then, let's use your repo to communicate from now.

from css-verbose.