Search code examples
rshinyshinythemes

Shiny app with theme can't change button background color

I'm trying to change the background color of a button in a Shiny app, but for some reason I can't make the color change. When I look at the html, I can't even find an id for the button, I only see an id for the text inside the button.

I think this is due to shinythemes, but I'm unsure. How do I change the button color in this sample app? Can anyone verify they have the same issue if they run this app, or maybe it is just my setup.

library(shiny)
library(shinythemes)

ui = fluidPage(
    theme = shinytheme("cerulean"), 
    navbarPage("App Name", selected = "Tab1", 
        id = "navbar",
        position = "fixed-top", 
        tabPanel("Tab1", id = "tab1Id",
            #padding between navbar and page when using fixed-top
            tags$style(type="text/css", "body {padding-top: 70px;}"), 
            fluidPage(
                actionButton("saveBtn2", "Update Schedule", 
                    icon("floppy-o"), 
                    #style="color: #0000ff;border-color: #2e6da4; background-color: #0000ff"
                    style = "background-color: #e7e7e7; color: black"
                )
            )
        )
    )
)
server = function(input, output, session) {}
runApp(shinyApp(ui, server))
Solution

  • Perhaps you want to try actionBttn.

    ui = fluidPage(
  theme = shinytheme("cerulean"), 
  navbarPage("App Name", selected = "Tab1", 
             id = "navbar",
             position = "fixed-top", 
             tabPanel("Tab1", id = "tab1Id",
                      #padding between navbar and page when using fixed-top
                      tags$style(type="text/css", "body {padding-top: 70px;}"), 
                      fluidPage(
                        actionBttn('insertBtn1', 
                                   'Add variable',
                                   style = "simple",
                                   color = "primary",
                                   icon=icon("floppy-o"),
                                   size = "sm",
                                   block = FALSE,
                                   no_outline = TRUE  
                        ),
                        actionButton("saveBtn2", "Update Schedule", 
                                     icon("floppy-o"), 
                                     #style="color: #0000ff;border-color: #2e6da4; background-color: #0000ff"
                                     style = "background-color: #e7e7e7; color: black"
                        )
                      )
             )
  )
)
server = function(input, output, session) {}
runApp(shinyApp(ui, server))

    output