---
title: "knitr dark mode - ggplot"
format:
  html:
    theme:
      light: united
      dark: slate
    keep-md: true
execute:
  echo: false
  warning: false
_quarto:
  tests:
    html:
      ensureHtmlElements:
        -
          - 'body.quarto-light'
          - 'div.cell div.light-content'
          - 'div.cell div.dark-content'
          - 'div.cell div.cell-code pre.code-with-copy'
        - []
---

```{r}
#| echo: false
#| warning: false
library(ggplot2)

ggplot_theme <- function(bgcolor, fgcolor) {
  theme_minimal(base_size = 11) %+%
  theme(
    panel.border = element_blank(),
    panel.grid.major.y = element_blank(),
    panel.grid.minor.y = element_blank(),
    panel.grid.major.x = element_blank(),
    panel.grid.minor.x = element_blank(),
    text = element_text(colour = fgcolor),
    axis.text = element_text(colour = fgcolor),
    rect = element_rect(colour = bgcolor, fill = bgcolor),
    plot.background = element_rect(fill = bgcolor, colour = NA),
    axis.line = element_line(colour = fgcolor),
    axis.ticks = element_line(colour = fgcolor)
  )
}

united_theme <- ggplot_theme("#ffffff", "#333333")
slate_theme <- ggplot_theme("#282B30", "#aaaaaa")

colour_scale <- scale_colour_manual(values = c("darkorange", "purple", "cyan4"))
```

### no crossref, no caption

```{r}
#| renderings: [light, dark]
theme_set(united_theme)
ggplot(mtcars, aes(mpg, wt)) +
  geom_point(aes(colour = factor(cyl))) + colour_scale
theme_set(slate_theme)
ggplot(mtcars, aes(mpg, wt)) +
  geom_point(aes(colour = factor(cyl))) + colour_scale
```

### with crossref but no caption

::: {#fig-ggplot}
```{r}
#| echo: true
#| renderings:
#|   - dark
#|   - light
theme_set(slate_theme)
ggplot(mtcars, aes(mpg, disp)) +
  geom_point(aes(colour = factor(cyl))) + colour_scale
theme_set(united_theme)
ggplot(mtcars, aes(mpg, disp)) +
  geom_point(aes(colour = factor(cyl))) + colour_scale
```
:::

### with caption but no crossref

<div>

```{r}
#| renderings: [dark]
theme_set(slate_theme)
ggplot(mtcars, aes(mpg, disp)) +
  geom_point(aes(colour = factor(cyl))) + colour_scale
```

ggplot - dark only

</div>

### with crossref and caption

::: {#fig-ggplot-mpg-hp}
```{r}
#| renderings: [light, dark]
theme_set(united_theme)
ggplot(mtcars, aes(mpg, hp)) +
  geom_point(aes(colour = factor(cyl))) + colour_scale
theme_set(slate_theme)
ggplot(mtcars, aes(mpg, hp)) +
  geom_point(aes(colour = factor(cyl))) + colour_scale
```

mtcars - mpg vs hp
:::

Here's a [link](https://example.com).

{{< lipsum 3 >}}