FontAwesome solid icons

[jamstack-elise]

💡 UI-Idea: Include FontAwesome's solid icon svgs in the codebase library

🎯 Goal Include the {faEnvelopeSquare} object for developer's who want to use an 'email' button Or via array-- icon={['fas', icon]}

📋 Initial steps to solve the problem

• explore gatsby-theme-chronoblog/packages/src/components/social-links.js codebase
• test

End goal: the code works, and celebrate🎉!

[jamstack-elise]

tests:

• imported npm package for @fortawesome/free-solid-svg-icons, and imported {faEnvelopeSquare}
• added <FontAwesomeIcon icon='envelope-square' /> into line 32
• updated gatsby-config

results:

• url updates
• icon does not appear (see attached screenshot with highlights)

[ganevdev]

Yes, that's a good idea.

The user should be able to indicate their email like this (in gatsby-config.js):

{
  icon: `envelope`,
  url: `mailto:hello@mail.com`
},

I wrote this in a test starter (but it doesn't work yet, of course): https://github.com/Chronoblog/gatsby-theme-chronoblog/blob/master/starters/tests/gatsby-config.js

[ganevdev]

So now we can use the "envelope", "at" and "phone" icons in the author banner (need gatsby-theme-chronoblog version 0.19.0 or higher).