Skip to content

fix: elevate CSS specificity for BS5 radio/checkbox group label margin#1308

Open
elnelson575 wants to merge 7 commits into
mainfrom
fix/bs5-radio-button-spacing
Open

fix: elevate CSS specificity for BS5 radio/checkbox group label margin#1308
elnelson575 wants to merge 7 commits into
mainfrom
fix/bs5-radio-button-spacing

Conversation

@elnelson575
Copy link
Copy Markdown
Contributor

@elnelson575 elnelson575 commented May 8, 2026

Summary

  • Bumps CSS specificity on bslib's BS5 radio/checkbox group label-spacing rule by doubling the class (.shiny-input-radiogroup.shiny-input-radiogroup)
  • This makes bslib's rule win the specificity tie against Shiny's inline-specific override (.shiny-input-radiogroup.shiny-input-container-inline), so inline radio/checkbox groups now use the same calculated label-to-options spacing as their stacked counterparts.
  • Note, for this to transfer to py-shiny, this needs to be merged into bslib, pyshiny needs the change in sass load order (so that this rule wins the specificity cascade), and then needs to revendor assets.

What changes visually

Stacked (vertical / many-choice) groups are unchanged. Inline groups gain ~2px of breathing room between the group label and the first option so all three variants are consistent.

Computed margin-top on .shiny-options-group:

main this PR
Vertical −3.4px −3.4px
Inline −1px −3.4px
Many −3.4px −3.4px

Before (main)

compare_main

After (this PR)

compare_new_fix

Test plan

  • Verify vertical radioButtons() label spacing is unchanged
  • Verify inline radioButtons() label spacing now matches vertical
  • Verify vertical checkboxGroupInput() label spacing is unchanged
  • Verify inline checkboxGroupInput() label spacing now matches vertical

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@elnelson575 elnelson575 force-pushed the fix/bs5-radio-button-spacing branch from 4f0136c to 40e324d Compare May 11, 2026 15:51
Comment thread inst/bs3compat/_shiny_input.scss Outdated
Per review on #1308, use `.shiny-input-radiogroup.shiny-input-radiogroup`
to bump specificity in a way that signals the duplication is purely for
specificity, rather than the semantically-misleading `.shiny-input-container.X`.
Also unifies inline radio/checkbox label spacing with the stacked variants by
winning the specificity tie against Shiny's inline override.
@elnelson575 elnelson575 marked this pull request as ready for review May 21, 2026 21:57
@elnelson575 elnelson575 requested a review from gadenbuie May 22, 2026 17:06
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.

2 participants