---
title: "Real-time theming with bslib and thematic"
runtime: shiny
output: 
  html_document:
    code_folding: show
    theme:
      color-contrast-warnings: false
      bg: "#202123"
      fg: "#B8BCC2"
      primary: "#EA80FC"
      secondary: "#00DAC6"
      base_font:
        google: Prompt
      heading_font:
        google: Proza Libre
---

```{r setup, include=FALSE}
bslib::bs_themer()
if (requireNamespace("thematic")) 
  thematic::thematic_rmd(font = "auto")
```

## R Markdown

This is an R Markdown document themed with [`{bslib}` package](https://rstudio.github.io/bslib/). `{bslib}` makes it easy to customize the main colors and fonts of a `html_document`, [`flexdashboard::flex_dashboard`](https://flexdashboard-pkg.netlify.app/articles/articles/theme.html), [shiny::fluidPage()](https://shiny.rstudio.com/reference/shiny/latest/fluidPage.html), or more generally any website that uses [Bootstrap](https://getbootstrap.com/) for styling. The `theme` parameter in the yaml front-matter of this Rmd document describes a [`bslib::bs_theme()`](https://rstudio.github.io/bslib/reference/bs_theme.html) object, which provides access to 100s of [theming options](https://rstudio.github.io/bslib/articles/bs4-variables.html) (via its `...` argument) in addition to the main options demonstrated here (e.g., `bg`, `fg`, `primary`, etc).

This document also uses [`runtime: shiny`](https://shiny.rstudio.com/articles/interactive-docs.html) to call [`bslib::bs_themer()`](https://rstudio.github.io/bslib/reference/run_with_themer.html) which overlays a "real-time" theming widget for interactively customizing main theme settings.

## Themed Plots {.tabset .tabset-pills}

When running this document with [`{thematic}`](https://rstudio.github.io/thematic/) installed, the `thematic::thematic_rmd(font = "auto")` effectively translates `theme` (CSS) settings to new global theming defaults for `{ggplot2}`, `{lattice}`, and `{base}` R graphics:

### ggplot2

```{r, message = FALSE}
library(ggplot2)

renderPlot({
  ggplot(mpg, aes(displ, hwy)) +
    geom_point() + geom_smooth()
})
```

### lattice

```{r}
renderPlot({
  lattice::show.settings()
})
```

### base

```{r}
renderPlot({
  plot(pressure, col = thematic::thematic_get_option("accent"))
})
```