shinyWidgets icon indicating copy to clipboard operation
shinyWidgets copied to clipboard

Button width not working in dashboard sidebar

Open rjake opened this issue 3 months ago • 0 comments

Perhaps a continuation of the rendering issue in #683, the buttons are not filling the whole space when inside the sidebar. It seems that .quarto-dashboard .sidebar label is superseding it. I can set this value manually but it would be nice for it to work out of the box. If this is a quarto issue, I can put this in their repo. Thanks!

image

---
title: "Test"
format: dashboard
---

# Sidebar {.sidebar}
```{r}
shiny::shinyOptions(bootstrapTheme = bslib::bs_theme(version = 5))

button_options <- c("The", "Sizes", "Are", "Different")

shinyWidgets::radioGroupButtons(
  inputId = "test-radio",
  label = NULL,
  choices = button_options,
  direction = "vertical",
  justified = TRUE,
  width = "100%"
)

```

# Page 1
## Row {height="250px"}
```{r}
shinyWidgets::radioGroupButtons(
  inputId = "test-radio",
  label = NULL,
  choices = button_options,
  direction = "vertical",
  justified = TRUE,
  width = "100%"
)
```


Within the CSS, these values seem to work:

  • width: 100%
  • width: inherit
  • width: -webkit-fill-available
.quarto-dashboard .sidebar label {
    width: 100%;
}

rjake avatar Apr 22 '24 21:04 rjake