bslib icon indicating copy to clipboard operation
bslib copied to clipboard

Small `value_box()` doesn't align showcase properly

Open cpsievert opened this issue 11 months ago • 1 comments

When value boxes get small, we change from a "left center" layout to a "top right" layout. Turns out that, the right portion of that just happens to work when you put icons (which have margin-left: auto) in the showcase, but if you put something else, like text, the showcase is centered:

library(bslib)

page_fixed(
  value_box(
    "Title", "value", showcase = span("showcase"),
    style = "width: 275px; resize: both"
  )
)
Screenshot 2024-02-26 at 6 06 31 PM

cpsievert avatar Feb 27 '24 00:02 cpsievert

When value boxes get small, we change from a "left center" layout to a "top right" layout.

This isn't quite what's happening. Each of the layouts has its own "small width" design.

  • "left center" moves the showcase above and centers its contents
  • "top right" doesn't actually change, showcase stays above and right-aligned
  • "bottom" also doesn't change, showcase below and centered

image

I could be talked into having the "left center" showcase be left-aligned in small value box widths, but there is a consistency in "left center", "top right", "bottom".

gadenbuie avatar Feb 27 '24 14:02 gadenbuie