Suggested mixin updates

Author: castastrophe

elements/pfe-accordion/src/pfe-accordion-header.scss

@@ -8,49 +8,24 @@
   @include  pfe-accordion-header;
 
   button {
-    @include pfe-trigger-button; // border 3px
-    @include pfe-trigger-color-light;
+    @include pfe-trigger-button($component-name: accordion); // border 3px
+    @include pfe-trigger-color($component-name: accordion);
 
     &[aria-expanded="true"] {
-        @include pfe-trigger-color-light-expanded;
+        @include pfe-trigger-color-expanded($component-name: accordion);
         @include pfe-trigger-expanded;
     }
 
     &[aria-expanded="true"]::after {
-        @include pfe-chevron-expanded-true;
+        @include pfe-chevron-expanded;
     }
 
     &[aria-expanded="false"]::after {
-        @include pfe-chevron-expanded-false;
+        @include pfe-chevron-expanded($state: false);
     }
   }
 }
 
-////////// last child
-
-// @TODO: add lighter/lightest and darker/darkest colors.
-
-// :host([color="darker"]:last-of-type),
-// :host([color="darkest"]:last-of-type) {
-//   button[aria-expanded="false"] {
-//     @include pfe-trigger-button-last($theme: dark);
-//   }  
-// }
-
-// :host([color="lighter"]:last-of-type),
-// :host([color="lightest"]:last-of-type) {
-//   button[aria-expanded="false"] {
-//     @include pfe-trigger-button-last($theme: light);
-//   }  
-// }
-
-// :host([color="darker"]:first-child),
-// :host([color="darkest"]:first-child) {
-//   button {
-//     @include pfe-trigger-button-first($theme: dark);
-//   }  
-// }
-
 :host(:first-child),
 :host([color="lighter"]:first-child),
 :host([color="lightest"]:first-child) {
@@ -77,34 +52,10 @@
 
 :host([on="dark"]) {
   button {
-    @include pfe-trigger-color-dark;
+    @include pfe-trigger-color($theme: dark, $component-name: accordion);
 
     &[aria-expanded="true"] {
-      @include pfe-trigger-color-dark-expanded;
+      @include pfe-trigger-color-expanded($theme: dark, $component-name: accordion);
     }
   }
 }
-
-// @TODO: add lighter/lightest and darker/darkest colors.
-
-// :host([color="lighter"]),
-// :host([color="lightest"]) {
-//     button {
-//       @include pfe-trigger-color-lightest;
-
-//       &[aria-expanded="true"] {
-//         @include pfe-trigger-color-light-expanded;
-//       }
-//     }
-// }
-
-// :host([color="darker"]),
-// :host([color="darkest"]) {
-//   button {
-//     @include pfe-trigger-color-darkest;
-
-//     &[aria-expanded="true"] {
-//       @include pfe-trigger-color-darkest-expanded;
-//     }
-//   }
-// }

elements/pfe-accordion/src/pfe-accordion-panel.scss

@@ -29,23 +29,8 @@
 :host(:last-of-type[expanded]) {
   @include pfe-accordion-panel-expanded-last;
 }
-
-// @TODO: add lighter/lightest and darker/darkest colors.
-
-// :host([color="lighter"][expanded]),
-// :host([color="lightest"][expanded]) {
-//   @include pfe-accordion-panel-expanded-style;
-//   @include pfe-accordion-panel-expanded-style-lightest;
-// }
-
-// :host([color="darker"][expanded]),
-// :host([color="darkest"][expanded]) {
-//   @include pfe-accordion-panel-expanded-style($theme: dark);
-//   @include pfe-accordion-panel-expanded-style-darkest;
-//  }
-
-// :host(:last-of-type[color="darker"][expanded]),
-// :host(:last-of-type[color="darkest"][expanded]) {
-//    @include pfe-accordion-panel-expanded-last-dark;
-// }
+ 
+:host(:last-of-type[expanded][on="dark"]) {
+  @include pfe-accordion-panel-expanded-last($theme: dark);
+}