feat(a): support theme colors

- default is set to accent according the spec
- supporting primary and warn colors as well

> breaking

fixing #6815

Closes #7472

docs/app/css/style.css

@@ -43,22 +43,14 @@ body.docs-body {
  * TYPE DEFAULTS
  ***************/
 a {
-  color: #106CC8;
   text-decoration: none;
   font-weight: 400;
-  border-bottom: 1px solid rgba(64, 84, 178, 0.25);
   -webkit-transition: border-bottom 0.35s;
   -moz-transition: border-bottom 0.35s;
   -ms-transition: border-bottom 0.35s;
   -o-transition: border-bottom 0.35s;
   transition: border-bottom 0.35s;
 }
-a:hover, a:focus {
-  border-bottom: 1px solid #4054B2;
-}
-a.md-button {
-  border-bottom: none;
-}
 h1, h2, h3, h4, h5, h6 {
   margin-bottom: 1rem;
   margin-top: 1rem;

src/components/button/button-theme.scss

@@ -156,3 +156,27 @@ a.md-button.md-THEME_NAME-theme,
     background-color: transparent;
   }
 }
+
+a.md-THEME_NAME-theme:not(.md-button) {
+  color: '{{accent-color}}';
+
+  &:hover {
+    color: '{{accent-700}}';
+  }
+
+  &.md-primary {
+    color: '{{primary-color}}';
+
+    &:hover {
+      color: '{{primary-700}}';
+    }
+  }
+
+  &.md-warn {
+    color: '{{warn-color}}';
+
+    &:hover {
+      color: '{{warn-700}}';
+    }
+  }
+}