Clean up how styles are used in all starters about rangle-starter HOT 7 CLOSED

Both react projects are done. Angular ones still TODO. I'll tackle them when I have time.

from rangle-starter.

That's cool, certainly an option. I still think it's worth doing as much of the transforms at build time instead of at run time though.

from rangle-starter.

@SethDavenport How do you fee about getting rid of the Column component. IMO this doesn't provide much value. We could instead just do:

<div className="col ...">
    { children }
</div>

from rangle-starter.

Yeah I agree. There are a few things like that...

from rangle-starter.

For reference, we decided not to go with Radium for now. The reasoning is that 90% of your styling should be with basscss classes; anything exotic is best kept in a component-specific .css file that gets required into the JSX and uses BEM syntax for scoping.

This allows it to benefit from the entire postcss toolchain including theme variables and autoprefixer support (Radium does some prefixing but it's not as robust).

It's also an idiom that's preferred by our Design team.

If you have a need for heavy dynamic inline styles in your project, feel free to bring in Radium to your own repo after cloning the seed.

from rangle-starter.

Now that we have harmonized the apps across to the angular starters, they should get the new styles too.

from rangle-starter.

This might be a reasonable alternative to Radium for React + TS inline style projects: https://github.com/postcss/autoprefixer#css-in-js

from rangle-starter.