Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bs4Dash bug when switch from light to dark to light mode #11 #268

Closed
ShinyFabio opened this issue Mar 3, 2022 · 2 comments · Fixed by #281
Closed

bs4Dash bug when switch from light to dark to light mode #11 #268

ShinyFabio opened this issue Mar 3, 2022 · 2 comments · Fixed by #281

Comments

@ShinyFabio
Copy link

Hi,
I was trying to made a customized bs4Dash using {fresh} package but I have some problems. Here's a reproducible example.

mytheme = create_theme(

  bs4dash_status(primary = "#2aaae2", light = "#2aaae2"),
  
  bs4dash_sidebar_light(
    bg = "#2c2f76", #sfondo sidebar
    color = "#FFF", #colore testo
    hover_color = "#2aaae2", #colore testo quando evidenziato
    submenu_bg = "#2c2f76", 
    submenu_color = "#FFF", 
    submenu_hover_color = "#2aaae2"
  ),
  
  bs4dash_layout(main_bg = "#FFF"),
  
  bs4dash_vars(
    navbar_light_color = "#2c2f76", #colore icone navbar 
    navbar_light_active_color = "#FFF",
    navbar_light_hover_color = "#FFF"
  )
)

library(shiny)
library(bs4Dash)
library(fresh)

shinyApp(
  ui = dashboardPage(
    title = "Basic Dashboard",
    header = bs4DashNavbar(
      skin = "light", status = "primary",
      title = dashboardBrand("ShinyDash", color = "primary"),
      
      rightUi = tags$li(class = "dropdown", actionButton(inputId  = "jumptohome", label =NULL, icon = icon("home"),status = "primary")) 
    ),
    
    sidebar = dashboardSidebar(
      skin = "light", 
      inputId = "sidebarState",
      bs4Dash::sidebarUserPanel(name = "nome"),
      
      bs4Dash::sidebarMenu(
        id = "sidebarmenu",
        bs4Dash::menuItem("Home", tabName = "home", icon = icon("home")),
        bs4Dash::menuItem("Cytotoxicity", tabName = "cytotab",icon = icon("file-import")),
        bs4Dash::menuItem("D1", tabName = "d1tab", icon = icon("table"),
                          bs4Dash::menuSubItem("guarda", tabName = "wow")
        )
        
      )
      
      
    ),
    controlbar = dashboardControlbar(),
    footer = dashboardFooter(),
    body = bs4Dash::dashboardBody(
      fresh::use_theme(mytheme),
      tabItems(
        tabItem(tabName = "home",h1(strong("Welcome to ShinyDash!"))),
        tabItem(tabName = "cytotab"),
        tabItem(tabName = "d1tab"),
        tabItem(tabName = "wow", h4("ok")))
    )
  ),
  server = function(input, output) {}
)
  1. If you try to run the code at the first the navbar is light blue as it should be, but if you change to dark mode and then again to light mode, the navbar becomes white even if in bs4dash_status() I specified that the light color should be that light blue.

Screenshot (150)

Screenshot (151)

  1. I want to add a home button in the navbar that has the same behaviour and colors of the switch button and the controllbar button (so like just an icon without the button around and the icon should be dark blue when not triggered, and white when hover or click). I tried some combinations even with different packages but without any luck.

I think my problem is both with {fresh} package and with {bs4Dash} so I posted the issue also here dreamRs/fresh#11

@paulimer
Copy link

Hi! I have the same issue, but it does happen whether I use fresh or not, and only thing I have done is set dashboardHeader()'s status to "primary".

@PythonCoderUnicorn
Copy link

Hello,

I was testing out your demo code from your README and noticed that the toggle does not work properly, the plot has a white background when in dark mode toggle.

Since I have used thematic and bslib in Shiny apps before I tried to use the following:

# placed above the ui = dashboard()
thematic::thematic_shiny(font='auto')

# place right after ui = dashboard()

# ran bs_theme_preview() since initially copying theme = bs_theme( ) from another file did not work to get the plot to have same color 
#bs_theme_preview(),

# this should have styled the dashboard with a black background
theme = bs_theme(theme, fg = "rgb(0, 221, 110)", primary = "#6CD62A", 
                  font_scale = NULL, bootswatch = "cyborg", bg = "rgb(6, 6, 6)"),

This failed to work. I expected the plot to have same background color as theme.

I appreciate the toggle.

Screen Shot 2022-04-30 at 4 25 36 PM

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants