How to make a univeral Font Awesome mixin with SASS - unicode

Question

I'm trying to make a SASS mixin that lets me specify the mixin call and the Unicode number only. This case is for list items where the icon would show up before the item.
My SASS mixin looks like this. I added both font-family options to include everything. If this isn't a good idea, maybe I'll do an if statement or something:
=faIconBefore($unicode)
display: inline-block
content: "\$unicode"
font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands"
font-size: 0.9em
font-style: normal
font-weight: 900
font-variant: normal
color: $colorPrime
text-rendering: auto
-webkit-font-smoothing: antialiased
margin-right: 0.25em
This can be used in code for a download icon like this:
+faIconBefore('f019')
I've also tried using this in the content line:
content: "\#{$unicode}"
Ideally, this would just add the icon I wanted, however instead I get $unicode item.pdf in my result.
It works fine when hard code the Unicode number into the SASS file, but I can't seem to get this part to work.
UPDATE:
I tried to put together a fiddle, but it wasn't working at all with the font.

Answer 1

Well it looks like that just doesn't work. Maybe using the #extend command, but changing the content style in the mixin to remove the single quotes and slash ('\') and adding the slash to the Unicode number in the stylesheet seemed to fix it. Here's my new code:
// Adding a Font Awesome icon before an element, specifying the unicode number - Usage: +faIconBefore('\f019')
=faIconBefore($unicode)
display: inline-block
content: $unicode
font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands"
font-size: 0.9em
font-style: normal
font-weight: 900
font-variant: normal
color: $colorPrime
text-rendering: auto
-webkit-font-smoothing: antialiased
margin-right: 0.25em
And the usage:
+faIconBefore('\f019')
If anyone knows of how it could use some refinement, let me know.
Thanks