Skip to content

allow toc to overflow#128

Open
atusy wants to merge 2 commits into
rstudio:mainfrom
atusy:automatic-overflow-toc
Open

allow toc to overflow#128
atusy wants to merge 2 commits into
rstudio:mainfrom
atusy:automatic-overflow-toc

Conversation

@atusy

@atusy atusy commented Sep 23, 2021

Copy link
Copy Markdown
Contributor

Current implementation hides TOC when it has too many items.

This PR let TOC be scrollable.

@cderv

cderv commented Sep 23, 2021

Copy link
Copy Markdown
Collaborator

Hi @atusy !

you're quick - this is just new feature I am experimenting while working on revealjs. Glad to know someone is watching 😄

Indeed, pandoc implementation of toc is not great for too many title. I wasn't sure yet how to deal with this.

I don't know if just adding an overflow is great, because you would get a big scrollable bar on the screen and it is really not nice.

---
title: "Untitled"
output: 
  revealjs::revealjs_presentation: 
    toc: true
---

```{r, echo=FALSE, results='asis'}
for (i in 1:20) {
  cat("# Title ", i)
  cat("\n")
}
```

image

So I think we should find another solution for that. Either doing columns or vertical slide.
Or offer another mechanism than Pandoc own TOC if we really want this feature.

Note that correctly putting content on slide is left to the user on any slide. If you are writing to much content, it will not be shown on screen, and we don't want to make all the slides scrollable

---
title: "Untitled"
output: 
  revealjs::revealjs_presentation: default
---

# Content too long 

```{r, echo=FALSE, results='asis'}
for (i in 1:15) {
  cat("Sentence", i, "\n")
  cat("\n")
}
```

image

Same happens some time with code chunk + plot or table.

For now, the user has to know what fits on the screen and adjust the style or split the slide if not ok.

Probably the same should be possible for TOC but Pandoc does not offer this.

Anyway, I think I need more time to decide what to do with this. I really don't like the vertical scroll bar. I prefer user to reduce the font size.

---
title: "Untitled"
output: 
  revealjs::revealjs_presentation: 
    toc: true
    keep_md: true
---

```{r, echo=FALSE, results='asis'}
for (i in 1:20) {
  cat("# Title ", i)
  cat("\n")
}
```

```{css, echo = FALSE}
.reveal #TOC {
  font-size: 70%
}
```

image

Or split in columns even using CSS

---
title: "Untitled"
output: 
  revealjs::revealjs_presentation: 
    toc: true
toc-title: "Table Of Content"
---

```{r, echo=FALSE, results='asis'}
for (i in 1:20) {
  cat("# Title ", i)
  cat("\n")
}
```

```{css, echo = FALSE}
.reveal #TOC ul {
  column-count: 2;
  column-gap: 10rem;
  height: 100%
}
```

image

Even if it means CSS customization, I find this better.

What do you think ?

Overall, I need more time to think about this. We are just starting working on this, and we will spend time on design and good default.

Thanks for the contribution anyway.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants