Merge pull request #1294 from primer/link_color_inherit

Link color inherit on :hover

.changeset/fuzzy-moles-guess.md

@@ -0,0 +1,5 @@
+---
+'@primer/css': minor
+---
+
+Adding a color text link on hover that will change a color utility class

docs/content/components/links.md

@@ -50,3 +50,13 @@ Use `.Link--onHover` to make any text color used with links to turn blue on hove
   A link with a partial <span class="Link--onHover">Link--onHover</span>
 </a>
 ```
+
+Link classes in combination with [color utilities](../utilities/colors) lets you colorize information separately inside of a link but have all of the link turn into one color on hover.
+
+```html live
+<a class="Link--primary text-bold" href="#url">
+  <svg class="octicon octicon-flame color-text-danger" viewBox="0 0 12 16" version="1.1" width="12" height="16" aria-hidden="true"><path fill-rule="evenodd" d="M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"></path></svg>
+  Hot
+  <span class="color-text-secondary">potato</span>
+</a>
+```