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

fix(shiny-preset): Improve Sass variable support #1134

Merged
merged 2 commits into from
Nov 21, 2024
Merged

Conversation

gadenbuie
Copy link
Member

@gadenbuie gadenbuie commented Nov 19, 2024

Fixes #1132

For page_navbar(), don't set CSS vars holding the default background colors if the user gave us $navbar-bg or $navbar-{light,dark}-bg Sass vars.

For page_sidebar(), don't set navbar colors if the user is relying on $navbar-bg.

In the example app, switch between page_navbar() and page_sidebar() to demonstrate that $navbar-bg sets the navbar color as expected (note that inverse is ignored in page_sidebar()).

In page_navbar(), disable the light/dark navbar bg Sass vars to confirm that $navbar-bg wins in both. Then re-enable light/dark bg vars and toggle inverse to see the navbar switch between light/dark variant.

library(shiny)
pkgload::load_all()

# ui <- page_navbar(
ui <- page_sidebar(
  title = "My Simple App",
  theme = bs_theme(
    preset = "default",
    navbar_bg = "#732400",
    navbar_light_bg = "#b2d8ff",
    navbar_dark_bg = "#00165d",
    cache_buster = format(as.integer(Sys.time()))
  ),
  inverse = TRUE,
  sidebar = sidebar(
    title = "Settings",
    "Just stuff here",
    input_dark_mode(),
  ),
  nav_panel("Home",
    h1("Welcome to the Home Page"),
    p("This is some boilerplate text for the home page."),
    card(
      card_header("Just a regular card"),
      layout_sidebar(
        sidebar = sidebar(
          "Some stuff here too",
          position = "right"
        ),
        "And card content with a sidebar!"
      )
    )
  )
)

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

}

shinyApp(ui, server)

For page_navbar(), don't set CSS vars holding the default background colors if the user gave us $navbar-bg and $navbar-{light,dark}-bg sass vars.

For page_sidebar(), don't set navbar colors if the user is relying on $navbar-bg
@gadenbuie gadenbuie merged commit c925ae5 into main Nov 21, 2024
13 checks passed
@gadenbuie gadenbuie deleted the fix/navbar-sass-vars branch November 21, 2024 21:37
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 this pull request may close these issues.

Need to be able to set navbar colors from Sass
2 participants