Support Non-SCSS about ember-freestyle HOT 8 CLOSED

@chrislopresto I very interested by your addon, it could solve a problem we have in my compagny for all the reasons you mentioned at Ember Conf.
But we are using LESS, so how can I help you to support that?

So reading your previous comment, I was thinking, why not just providing a simple .css file? Then, we just have to override properties with our favorite preprocessor.

I do, for example, the parallel with Bootstrap, Bootstrap 3 use LESS but you can still use the css and then, of course, override what you want using the preprocessor of your choice.
In Bootstrap 4 they'll switch to SASS, but your application made with LESS will still continue to work, because the library itself is not dependant of the preprocessor used by the application that will us it. And I think for your addon it should be the same?

What do you think?

from ember-freestyle.

yo yo yo, I converted almost all the scss into plain jane css over the weekend. Ill make a PR this week for review

from ember-freestyle.

How can I help?

from ember-freestyle.

@knownasilya I'm starting to chat with some folks about the best approach. I want to find a way to provide styles that are overridable by parent apps regardless of preprocessor (LESS | SCSS | PostCSS). Any thoughts are welcome, as all styled addons face this problem.

There's some general Ember CSS chatter that will hopefully turn into one or more RFCs. I'm open to simpler ideas in the interim.

from ember-freestyle.

it would be great if there was a precompiled css file that we could import instead of the .scss file

from ember-freestyle.

In ember-css-modules, there's the concept of a virtual module for letting addon consumers configure constants for things like theming as part of build config.

I maintain that addon, so I naturally have a biased opinion of it as a whole (everyone should use it for everything 😉 ), but even if you're married to Sass it seems that a similar approach could work to allow non-Sass users to override the configurable colors.

new EmberApp(defaults, {
  freestyle: {
    colors: {
      primary: 'pink'
    }
  }
});

I could imagine taking that config ⬆️ and emitting a _colors.scss file that you @import at the top of ember-freestyle's base stylesheet. Any thoughts on whether that's an approach worth pursuing?

from ember-freestyle.

That is beautiful

from ember-freestyle.

Thanks for the work on this. For a few related and unrelated reasons we opted to move Ember Freestyle's CSS to the addon tree to avoid taking an opinion on consuming application CSS pre- and post-processors... and to simplify the process of blacklisting / stripping ember-freestyle from production builds.

More details are here: #106

I'm going to close this PR and a few others now that we have carved out a direction. Feel free to reach out with thoughts and questions as we work to get the next release out the door.

Cheers!

from ember-freestyle.