search

rstudio / bslib

Tools for theming Shiny and R Markdown via Bootstrap 3, 4, or 5.
https://rstudio.github.io/bslib/
Other
472 stars 57 forks source link

fix: unset `--_sidebar-fg` by default #1062

Closed gadenbuie closed 4 months ago

gadenbuie commented 4 months ago

Fixes an issue introduced by https://github.com/rstudio/bslib/pull/1056

We were using this CSS:

$bslib-sidebar-fg: inherit !default;

.bslib-sidebar-layout {
  --_sidebar-fg: var(--bslib-sidebar-fg, #{$bslib-sidebar-fg});

  .sidebar {
    color: var(--_sidebar-fg);
  }
}

The problem with this approach is that if --_sidebar-fg is set on a parent of .bslib-sidebar-layout, the "inherit" in .bslib-sidebar-layout means inherit the _value of --_sidebar-fg_ and is evaluated in that context rather than being evaluated as inherit inside of .sidebar { color: inherit }.

The result was that if a parent sidebar layout uses fg of white, that value would end up passing down to an inner sidebar layout.

The new approach simply resets --_sidebar-fg: var(--bslib-sidebar-fg) at each .bslib-sidebar-layout. This way, outer sidebar layouts don't affect inner sidebar layouts, unless globally via --bslib-sidebar-fg.

This issue is demonstrated in the second tab of 308-sidebar-kitchen-sink and was found in this run: https://github.com/rstudio/shinycoreci/tree/gha-bea44a3-2024_05_31_05_04-4.4-macOS/inst/apps/308-sidebar-kitchen-sink/tests/testthat/_snaps/mac-4.4/308-sidebar-kitchen-sink.