0

I am creating shiny app using shiny dashboard and trying to add font awesome icons to my action buttons. The app runs with no error messages, however, some of the icons are not displayed.

I used the code below to create the app but the icons for pie, pizza, salad, stew do not show:

#load packages
library(shiny)
library(shinydashboard)


# Define UI for application that draws a histogram
ui <- dashboardPage(
  #set up app colour scheme
  skin = "black",
  #set up app title
  dashboardHeader(title = "Create Desirable Food Descriptions", 
                  #puts sidebar toggle on right
                  titleWidth = "calc(100% - 44px)"
  ),
  #set up sidebar menu
  dashboardSidebar(width = 290,
               sidebarMenu(id = "tabs",
                           menuItem("Start Here", tabName = "startHere"),
                           menuItem("Desirable Word Generator", tabName = "wordGenerator")
               )
  ),
  #set up the structure content within each of the menu pages
  dashboardBody(
    #access font awesome icons 
    tags$script(src = "https://kit.fontawesome.com/<you>.js"),
    #wraps dash body to correct height automatically
    tags$head(tags$style(HTML('.content-wrapper { overflow: auto; }'))),
    tabItems(
      #structure of menuItem startHere
      tabItem(tabName = "startHere",
               column(
               width = 12,
                fluidRow(
                  box(title = "What's The Problem?", "insert text", width = 6),
                  box(title = "Our Solution", "insert text", width = 6)
                )
              )
      ),
      #structure of menuItem wordGenerator
      tabItem(tabName = "wordGenerator",
              column(
                 width = 12,
                fluidRow(
                  box(title = "How To Use the Generator", "insert text", width = 12),
                  box(
                    title = "Pick Your Food", width = 12,
                    actionButton("burger", "Burger", icon = tags$i(class = "fa-solid fa-burger")),
                    actionButton("chilli", "Chilli", icon = tags$i(class = "fa-solid fa-pepper-hot")),
                    actionButton("curry", "Curry", icon = tags$i(class = "fa-solid fa-bowl-rice")),
                    actionButton("pasta", "Pasta", icon = tags$i(class = "fa-solid fa-bowl-food")),
                    actionButton("pie", "Pie", icon = tags$i(class = "fa-solid fa-pie")),
                    actionButton("pizza", "Pizza", icon = tags$i(class = "fa-solid fa-pizza")),
                    actionButton("soup", "Salad", icon = tags$i(class = "fa-solid fa-salad")),
                    actionButton("stew", "Stew", icon = tags$i(class = "fa-solid fa-pot-food"))
                  ),
                  box(title = "Desirable Words", "insert text", width = 12)
                )
              )
      )
     )
  )
)

# Define server logic required to draw a histogram
server <- function(input, output) {

}

# Run the application 
shinyApp(ui = ui, server = server)
akrodger
  • 1
  • 2
  • Are you using a free kit? (`https://kit. ...`)? E.g. `pizza` is contrary to `pepper hot` a pro icon and I suppose it's not included in your icon family. – Jan Jul 14 '23 at 18:05
  • @Jan thank you - I think that must be the issue as I am using the free kit. Appreciate your help. I replaced pizza with pizza-slice a free icon and it worked. – akrodger Jul 14 '23 at 18:20

0 Answers0