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.

Sign up for GitHub

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

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in 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