Stacking icons - basic example

Question

I'm new to R and currently trying to use Shiny to build basic apps. I'm seeking to understand how to stack icons; here is my attempt :

library(shiny)

ui <- fluidPage(  
  h5("Hello there"),                                          
  br(),                                                       

  actionButton(inputId = "ClickonMe", label = (
    "test stack",
    icon = icon("commenting","fa-2x", lib = "font-awesome"),
    icon("ban", "fa-stack-1x", lib = "font-awesome"),
    span(shiny::icon("fa fa-user-ban"))
  ))

  mainPanel(verbatimTextOutput("Response_text"))
)

server <- function(input,output,session) { }

shinyApp(ui, server)

This is freely adapted from the solution proposed here, to no avail : https://github.com/rstudio/shinydashboard/issues/110

I also looked here, but I'm not experienced enough to be able to understand it too well : http://fontawesome.io/examples/

I want to figure out how to put the ban icon over the top of another icon, in this case "commenting".

Could somebody explain to me if I'm on the right path ? If not, why ?

Last edit - working version of original code :

    library(shiny)

    ui <- fluidPage(  
      h5("Hello there"),                                          
      br(),                                                       

  actionButton(inputId = "ClickonMe", label = div(
    tags$span("test stack"),
    tags$span(class = "fa-stack",
              icon("ban",
                   "fa-stack-2x", 
                   lib = "font-awesome"),
              shiny::icon("fa fa-commenting",class = "fa-stack-1x"), style = "color:red"
    )
  )
  )

      mainPanel(verbatimTextOutput("Response_text"))
    )

    server <- function(input,output,session) { }

    shinyApp(ui, server)

Answer 1

when you want more complicated HTML in the action button use only the label parameter and ignore the icon parameter. You can place the icons in the Label

Is this doing what you want?

actionButton(inputId = "ClickonMe", label = div(
  tags$span("test stack"),
  tags$span(class = "fa-stack",
            icon("commenting",
                 "fa-stack-2x", 
                 lib = "font-awesome"),
            shiny::icon("fa fa-user-plus",class = "fa-stack-1x")
            )
  )
),