Line numbers for code blocks

[SES-CE]

Hi,

Is it possible to have line numbers in my code blocks using distill?

I'd like to have line numbers for code blocks so I can reference the code in my article made using distill but I have been unable to get them shown in the output successfully.

Searching the web I found an answer for a general output with 'html_output' as in this post.

Using the code from the post it does not directly transfer to a 'distill::distill_article:' output.

---
title: "Untitled"
author: "Unauthored"
date: "1/1/2020"
output:
    distill::distill_article:
    highlight: tango
    
---

```{css, echo = FALSE}
.sourceCode { overflow: visible; }
```


```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```


## Line numbers

```{r, attr.source='.numberLines'}
if (TRUE) {
  x <- 1:10
  x + 1
}
```

[cderv]

This is an issue with downlit r-lib/downlit#133 which is used by distill to highlight code block by default
https://rstudio.github.io/distill/basics.html#syntax-highlighting

Theoretically, it should be possible to make that works by deactivating downlit

---
title: "Untitled"
author: "Unauthored"
date: "1/1/2020"
output:
    distill::distill_article:
      highlight: tango
      highlight_downlit: false
---

```{css, echo = FALSE}
.sourceCode { overflow: visible; }
```


```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```


## Line numbers

```{r, attr.source='.numberLines'}
if (TRUE) {
  x <- 1:10
  x + 1
}
```

However, it seems there is some CSS issues.

This should be fixed in distill and the former in downlit

Thank you for the report !

[cderv]

The styling should be fixed when highlight_downlit = FALSE and line numbering activated.

Thanks for the report

[SES-CE]

Thanks a lot!