quarto-dev / quarto-dev/quarto-cli

Change size of value valuebox

Open
#8,441 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

dashboards enhancement themes
Dominant language
JavaScript
Stars
6k
Forks
458
Avg merge
1d 9h
Merged PRs (30d)
41

Description

Bug description

I would like to change the size of the value displayed in a valuebox in a dashboard using Quarto. I tried to use a size argument but this doesn't change. You can see in the example below that the value is out of boundaries. I also asked this on Stack Overflow: [Change size of value valuebox in dashboard Quarto](https://stackoverflow.com/questions/77880573/change-size-of-value-valuebox-in-dashboard-quarto)

Steps to reproduce
---
title: "How to change the value size of a valuebox"
format: dashboard
---

# {.sidebar}

Example code

# Tab

## Row {height="20%"}

```{r}
#| content: valuebox
#| title: "Example"

list(
  icon = "people",
  color = "primary",
  value = 123456789
)
``` 
```{r}
#| content: valuebox
#| title: "Example"

list(
  icon = "people",
  color = "primary",
  value = 123456789
)

## Row {height="80%"}
Expected behavior

No response

Actual behavior

Here is the output of the script above:

As you can see the value is out of the valuebox which is not what we want of course.

Your environment
  • RStudio 2023.06.0+421
  • macOS Sonoma 14.2.1
Quarto check output

quarto check
Quarto 1.4.537
[✓] Checking versions of quarto binary dependencies...
Pandoc version 3.1.11: OK
Dart Sass version 1.69.5: OK
Deno version 1.37.2: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
Version: 1.4.537
Path: /Applications/quarto/bin

[✓] Checking tools....................OK
TinyTeX: v2022.12.12
Chromium: 869685

[✓] Checking LaTeX....................OK
Using: TinyTex
Path: /Users/quinten/Library/TinyTeX/bin/universal-darwin
Version: 2022

[✓] Checking basic markdown render....OK

[✓] Checking Python 3 installation....OK
Version: 3.9.17 (Conda)
Path: /Users/quinten/opt/miniconda3/bin/python
Jupyter: 4.9.1
Kernels: julia-1.8, python3

[✓] Checking Jupyter engine render....OK

[✓] Checking R installation...........OK
Version: 4.2.3
Path: /Library/Frameworks/R.framework/Resources
LibPaths:
- /Library/Frameworks/R.framework/Versions/4.2/Resources/library
knitr: 1.45
rmarkdown: 2.25

[✓] Checking Knitr engine render......OK

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by rendering the reproducible Quarto dashboard example from the issue and inspect how the dashboard valuebox is rendered. The fix is complete when the long displayed value stays within the valuebox and its size can be changed as requested.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, r
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.