font awesome icon v4 and v5 compatibility issue

[dracodoc]

I just upgraded shiny to 1.2.0 and found github icon is shown with wrong size and alignment:

It turned out it was using fa icon 5.0 name:

> str(icon("github"))
List of 3
 $ name    : chr "i"
 $ attribs :List of 1
  ..$ class: chr "fab fa-github"

while the 4.7 name should be fa fa-github.

Per help

currently icons from the v5.3.1 set are supported with the v4 naming convention

I think there is something wrong here but not sure why this only happen to github icon but not others.

> str(icon("info-circle"))
List of 3
 $ name    : chr "i"
 $ attribs :List of 1
  ..$ class: chr "fa fa-info-circle"

> sessionInfo()
R version 3.5.1 (2018-07-02)
Platform: x86_64-apple-darwin15.6.0 (64-bit)
Running under: macOS High Sierra 10.13.6

Matrix products: default
BLAS: /System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libBLAS.dylib
LAPACK: /Library/Frameworks/R.framework/Versions/3.5/Resources/lib/libRlapack.dylib

locale:
[1] en_US.UTF-8/en_US.UTF-8/en_US.UTF-8/C/en_US.UTF-8/en_US.UTF-8

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods   base     

other attached packages:
[1] data.table_1.11.8    ctmm_0.5.3           DT_0.5               shinydashboard_0.7.1
[5] shiny_1.2.0          pacman_0.5.0   

[jcheng5]

Thanks for the report. Are you adding some extra classes for the size?

[dracodoc]

I do have some customized styles but I don't think I changed anything for this part. Here are the inspected details about the github icon and another item with exactly same structure, just different icon:

[dracodoc]

v4 have proper sizes:

but v5 (mainly 5 brands) don't have size information

[AshesITR]

@dracodoc The sizing CSS comes from shinydashboard. What happens if you fix the CSS for shinydashboard by adding an analogous .fab (and .far, .fas, .fal) selector to the rule?

[dracodoc]

@AshesITR The v5 icon is using .fab and having problem. The v4 icon used .fa selector which have proper size information width: 50px.

I tested with your patch and it worked. Hope it will be merged soon!