I am using RMarkdown and xaringan to create presentations (introduction to R).
I used CSS to edit the looks of the input and output R code chunks on the slides. In doing so, I added "Input" and "Output" titles to the corresponding R code boxes. Here's a MWE with the CSS code embedded in the .Rmd file:
---
title: "-"
output:
xaringan::moon_reader:
css: default
seal: false
---
```{css, echo=FALSE}
.tiny {
font-size: 75%;
}
/* Code line in both boxes */
.remark-code * {
background: #f0f0f0;
}
/* Input box */
.hljs-default .hljs {
padding: 20px;
background: #f0f0f0;
border-radius: 10px;
}
/* Output box */
.remark-code {
padding: 20px;
background: #f0f0f0;
border-radius: 10px;
display: block;
}
```
.pull-left[
.tiny[*Input*]
```{r add, eval=FALSE}
2 + 3
```
]
.pull-right[
.tiny[*Output*]
```{r, ref.label="add", echo=FALSE}
```
]
And here's how it looks:
Not bad, except that I would like to remove the white space between the line with "Input" and "Output" and the top of each code box. How can I do this?
Thanks,
Bruce