Change height of Value Box in flexdashboard with runtime: shiny

Viewed 557

I want a Value Box to adjust to the specified height and width of the section. There is no problem with the width, however it is taller than specified. Also I want only a specific Value Box to change size, so the rest of the Value Boxes remain the same.

Here is my code:

---
title: "Dashboard_F"

output:
 flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
social: [ "twitter", "facebook", "menu"]
source_code: embed
css: www/styles.css

runtime: shiny
---

Column {data-width=275}
----------------------------------
### 2019 {data-height=50}
``` {r}
renderValueBox({
  valueBox(currency(sum(as.numeric(data()$`TOTAL (2019)`),na.rm=T),digits = 0),caption = "Total" ,color = "blue",icon="fa-money-bill")
})
```

I have tried changing the height by using css

```{css my-content, echo = FALSE}
.value-box {
    height: 5%;
}
```

This works but only for the box, it doesn´t adjust the icon or the caption, using font-size doesn´t seem to have any effect. Additionaly it affects all of the Value Boxes in the dashboard.

Is there any way to solve this? I would really aprecciate any help, thanks! :)

0 Answers
Related