Thoughts about Radium for this project about mjml HOT 5 CLOSED

Hey @TheSisb, thanks for opening this issue, we appreciate your involvement!
​
Radium looks really nice, however I think it's too much overhead for our case.
It has cool features to scope css and support multiple styling states, but I think we don't need those for standard components.
Can you provide an example on how you could integrate Radium in a simple MJML component like mj-text ?
But Radium isn't the only solution, and we may need to rework the way we handle default attributes, default css and markup css to a simpler solution.
​
Does it make sense to you?

from mjml.

Hi @TheSisb, we would really love to understand how Radium could make the MJML engine better.
Thanks a lot for your feedback!

from mjml.

Sorry for the delayed response. I see that rather than using inline-styles, you use attributes to the same effect. What you're doing is somewhat similar yet much more basic than what Radium provides.

For a very simple case, you can take a look at this template: https://mjml.io/try-it-live/mama-mia. There are three repetitions of color="#EEE" font-family="roboto" align="center".

If we were using Radium you could have a:

const styles = {
  text: {
    color: '#eee',
    fontFamily: 'roboto',
    align: 'center'
  }
}

Then pass it to components in a standard way like this: <mj-text style={styles.text}> ...</mj-text>

With objects, suddenly you can re-use, extend, and classify styles with names. It makes the template engine look much cleaner and you can avoid having to build in the attribute extender into custom mjml components. i.e.: the getStyles function with its merge.

Radium takes these styles and renders them to inline styles anyways, so it aligns perfectly with the motive of this project.

Issues like #32 become non-issues :) Components would have defaultStyles but they would be overwritten by the passed style prop.

Hope this helps clarify some things!

from mjml.

Hi @TheSisb,

I see, sounds very interesting approach, thanks for taking the time to explaining more in details what you had in mind. For now, we're focused on improving the rendering process, the components interface, etc but will definitely consider that improvement for a future release.

Meanwhile, we would be more than happy to review a contribution from you and integrate it back in the project.

Keep you posted on our progress,
Arnaud.

from mjml.

Hey @TheSisb, we described with more details in #79 how we would like to handle this feature. Let's move the discussion there.

Thanks again for your contribution to MJML.

from mjml.