Custom brand color no longer works in Ember CLI 3.13

[barryofguilder]

I just upgraded my addon from Ember CLI 3.12 to 3.13 and the custom brand color is no longer working. It seems there's something strange going on in the CSS backing it.

This screenshot is on Ember CLI 3.12 (works):

And here is Ember CLI 3.13 (doesn't work):

[barryofguilder]

The workaround for now (for our addon anyways) was to add the following to our app.css file in our dummy app:

.docs-bg-brand {
  background-color: #e04e39 !important;
}
.docs-text-brand {
  color: #e04e39 !important;
}

[kimroen]

Looks to me like the css isn't processed by postcss for some reason.

Why? Because:

• The @apply rule from tailwind is still there
• The color in the background-color declaration is uppercase
• The declaration doesn't have the body part

[RobbieTheWagner]

Yeah, might be something with ember-cli-tailwind no longer working. I know the recommendation was to use tailwind directly per the discussion on embermap/ember-cli-tailwind#143

@samselikoff do you think we need to make the switch here to fix this?

[samselikoff]

Yes, it would be good to get AddonDocs off of Ember CLI Tailwind. I actually have a free video coming out soon walking through doing this on EmberMap's frontend codebase but if anyone wants to they can dive in and do it with Ember CLI Postcss right away.

[RobbieTheWagner]

^ cc @alexlafroscia

[samselikoff]

#412 swapped out Ember CLI Tailwind with PostCSS and tailwindcss, but someone should verify if it actually fixed the brand color issue here before closing this.

[barryofguilder]

I can look into this today.

[barryofguilder]

@samselikoff I can confirm that the custom brand color is working for me when I use the master branch in my addon! Thanks @josemarluedke

[samselikoff]

Woot!