What is the correct way organize CSS file with Ember.js?

@1c7 wrote:

1. Question

1. What is the correct way organize CSS file with Ember.js?
2. Any general suggestion/advice on CSS when using Ember.js?
3. How to write CSS per-component/ per-templates, avoid name confilct?

2. Why ask

I am trying to customize Discourse,
and their app/assets/stylesheets just confusing,

How they avoid conflict with CSS name?

Example:

.latest-topic-list, .top-topic-list {
  @extend .topic-list-icons;

  .table-heading {
    padding: 12px 5px;
    color: dark-light-choose($primary-medium, $secondary-high);
  }

  .no-topics, .more-topics {
    margin-top: 1em;
  }
}

3. The research I done before asking question

1. Google Search “Ember CSS” “ember where to put css”, not really helpful, otherwise I wouldn’t ask question here
2. Ember.js document didn’t mention too much about it.
   it did say CSS should go into app/styles/
   https://ember-cli.com/user-guide/#layout-within-app-directory

4. So

How to organize CSS file in Ember.js?

Thank you !

Posts: 9

Participants: 5

Read full topic