fix(list): Respect BEM when outputting the base stylesheet. (#1799)

Fixes #1748.

Author: simono

packages/mdc-list/mdc-list.scss

@@ -21,27 +21,22 @@
 @import "./mixins";
 @import "./variables";
 
-// TODO(acdvorak): Find a way to remove parent .mdc-list and .mdc-list-group selectors; they violate BEM.
 .mdc-list,
 .mdc-list-group {
-  @include mdc-list-divider-color($mdc-list-divider-color-light);
-
   @include mdc-theme-dark {
     @include mdc-list-divider-color($mdc-list-divider-color-dark);
   }
 }
 
+@at-root {
+  @include mdc-list-divider-color($mdc-list-divider-color-light);
+}
+
 // postcss-bem-linter: define list
 
 .mdc-list {
   @include mdc-typography(subheading2);
-
-  // TODO(acdvorak): Find a way to remove parent .mdc-list selector; it violates BEM.
   @include mdc-list-item-primary-text-ink-color(text-primary-on-background);
-  @include mdc-list-item-secondary-text-ink-color(text-secondary-on-background);
-  @include mdc-list-item-graphic-fill-color(transparent);
-  @include mdc-list-item-graphic-ink-color(text-icon-on-background);
-  @include mdc-list-item-meta-ink-color(text-hint-on-background);
 
   @include mdc-theme-dark {
     @include mdc-list-item-primary-text-ink-color(text-primary-on-dark);
@@ -59,6 +54,13 @@
   list-style-type: none;
 }
 
+@at-root {
+  @include mdc-list-item-secondary-text-ink-color(text-secondary-on-background);
+  @include mdc-list-item-graphic-fill-color(transparent);
+  @include mdc-list-item-graphic-ink-color(text-icon-on-background);
+  @include mdc-list-item-meta-ink-color(text-hint-on-background);
+}
+
 .mdc-list--dense {
   padding-top: 4px;
   padding-bottom: 4px;
@@ -215,8 +217,6 @@ a.mdc-list-item {
 // postcss-bem-linter: define list-group
 
 .mdc-list-group {
-  @include mdc-list-group-subheader-ink-color(text-primary-on-background);
-
   @include mdc-theme-dark {
     @include mdc-list-group-subheader-ink-color(text-primary-on-dark);
   }
@@ -238,4 +238,8 @@ a.mdc-list-item {
   }
 }
 
+@at-root {
+  @include mdc-list-group-subheader-ink-color(text-primary-on-background);
+}
+
 // postcss-bem-linter: end