Skip to content
New issue

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

#

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

Already on GitHub? # to your account

Jump to bottom

Small value_box() doesn't align showcase properly #994

Open
cpsievert opened this issue Feb 27, 2024 · 1 comment · May be fixed by #995
Open

Small value_box() doesn't align showcase properly #994

cpsievert opened this issue Feb 27, 2024 · 1 comment · May be fixed by #995
Assignees
@cpsievert

Comments

@cpsievert
Copy link
Collaborator

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 cpsievert self-assigned this Feb 27, 2024
cpsievert added a commit that referenced this issue Feb 27, 2024
@cpsievert
Close #994. Align the showcase properly when the value box is small
ebcff64
@cpsievert cpsievert linked a pull request Feb 27, 2024 that will close this issue
Open
@gadenbuie
Copy link
Member

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".

# for free to join this conversation on GitHub. Already have an account? # to comment
Assignees

@cpsievert cpsievert

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Align the showcase properly when the value box is small rstudio/bslib
2 participants
@cpsievert @gadenbuie