aditya/hugo-theme-introduction
1
0
Fork 0
mirror of https://git.adityakumar.xyz/hugo-theme-introduction.git synced 2024-11-09 23:09:47 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add fa icon packs (#113)

Browse source 
This PR adds functionality for users to specify which `icon_pack` to use (`fas` or `fab`; see: https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4) in the `config.toml` file, so that users can use the solid icons as well as the brand icons.

```
    [[params.social]]
        url   = "https://twitter.com/"
        icon  = "twitter" # icon name without the 'fa-'
        icon_pack = "fab"
    [[params.social]]
        url   = "https://facebook.com/"
        icon  = "facebook-f" # icon name without the 'fa-'
        icon_pack = "fab"
    [[params.social]]
        url   = "https://linkedin.com/"
        icon  = "linkedin-in" # icon name without the 'fa-'
        icon_pack = "fab"
    [[params.social]]
        url = "mailto:youremail@email.com"  # For a direct email link, use "mailto:test@example.org".
        icon = "paper-plane" # icon name without the 'fa-'
        icon_pack = "fas"
```
This commit is contained in:
Alison Presmanes Hill 2018-12-14 00:32:50 -08:00 committed by Hanzei
parent 3a6144e557
commit 2c5cfbc4b3
5 changed files with 20 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
docs/de/index.html generated
View file

File diff suppressed because one or more lines are too long

4
docs/es/index.html generated
View file

File diff suppressed because one or more lines are too long

4
docs/index.html generated
View file

File diff suppressed because one or more lines are too long

17
exampleSite/config.toml
View file

@ -34,16 +34,25 @@ DefaultContentLanguage = "en" # Default language fo
pinterest = true pinterest = true
# Social icons appear in introduction and contact section. Add as many more as you like. # Social icons appear in introduction and contact section. Add as many more as you like.
# Find icon names here: https://fontawesome.com/cheatsheet/ # Icon pack "fab" includes social network icons, see: https://fontawesome.com/icons?d=gallery&s=brands&m=free
# Icon pack "fas" includes solid style icons, see: https://fontawesome.com/icons?d=gallery&s=solid&m=free
[[params.social]] [[params.social]]
url = "https://twitter.com/" url = "https://twitter.com/"
icon = "twitter" icon = "twitter" # icon name without the 'fa-'
icon_pack = "fab"
[[params.social]] [[params.social]]
url = "https://facebook.com/" url = "https://facebook.com/"
icon = "facebook-f" icon = "facebook-f" # icon name without the 'fa-'
icon_pack = "fab"
[[params.social]] [[params.social]]
url = "https://linkedin.com/" url = "https://linkedin.com/"
icon = "linkedin-in" icon = "linkedin-in" # icon name without the 'fa-'
icon_pack = "fab"
[[params.social]]
url = "mailto:youremail@email.com" # For a direct email link, use "mailto:test@example.org".
icon = "paper-plane" # icon name without the 'fa-'
icon_pack = "fas"
# If you don't want to use the default menu, you can define one by yourself # If you don't want to use the default menu, you can define one by yourself
# [[menu.main]] # [[menu.main]]

2
layouts/partials/home/social.html
View file

@ -1,7 +1,7 @@
<div class="social-icons"> <div class="social-icons">
{{ range .Site.Params.social }} {{ range .Site.Params.social }}
<a href="{{ .url }}"> <a href="{{ .url }}">
<i class="fab fa-{{ .icon}}"></i> <i class="{{ .icon_pack}} fa-{{ .icon}}"></i>
</a> </a>
{{ end }} {{ end }}
</div> </div>