CSS recommendations

Does anyone have advice for me, from an Ember-centric point of view, regarding selection of CSS framework? Bootstrap vs Foundation vs Semantic-UI vs etc?

1 Like

Hello, user. First of all - I think the design tag is incorrect here, it’s more about design of software. But nevertheless, back to your question.

Did you specify your requirements for the framework? It can be low size of final css, targeted browsers support, provided features (glyphs, grids, buttons, all other UI whistles) and many others.

My background is ~2 years of bootstrap. But on the recent project I started for use pure-css and it’s really more suitable for me, because I didn’t really use that tons of features and UI elements from bootstrap. (For the record - yes, I know about modular structure of TBS and I used it.)

D’oh. Thanks for pointing that out.

I think both bootstrap and foundation are fine css frameworks. If you are uncomfortable with either, there is a lot more bootstrap support.

If you are also lacking in the design department, there are websites like wrapbootstrap.com that can provide you with a shell of an interface, that way you can focus more on wiring your app up with ember and then focus on making the design yours.

Whenever I use bootstrap, I always use the SASS version and include only the things that I need. There is a really nice addon for SASS - ember-cli-sass.

https://github.com/ebryn/ember-component-css is well worth a look for organising your css in the pod structure. I’ve just started using it but already I can’t imagine wanting to build components without it.

2 Likes

At ClearSight Studio we use thoughtbot’s Sass mixins, Bourbon, Neat and Bitters. We have a middleman template (here) with all 3 installed. It might help you get things setup correctly.

I’ve used Bootstrap in the past, and I definitely prefer Bourbon and Neat. Bootstrap is great for getting something stood up fast, but I feel it’s more difficult to remove the Bootstrap look and feel for the final product.

anybody know a good setup for bourbon, neat, bitters for ember-cli?

once css-blocks from @chriseppstein comes out that is going to be the shit

Subscribe for updates at css-blocks.com

It’s not technically released but some beta is here, which is pretty insightful:

Just a splattering of interesting links…

If you want just straight up css-in-js: GitHub - upsilonIT/ember-cli-jss: JSS integration for Ember

Another ui library: https://suitcss.github.io/

Ember-paper is a legit ui library too: ember-paper - The Ember approach to Material Design.

If you end up going with react checkout react-native-web: https://necolas.github.io/react-native-web/storybook/

Similar thread: https://www.reddit.com/r/emberjs/comments/5otpit/beginner_adding_css_per_template/