quarto presentation multi-column toc

1.9k Views Asked by At

Wondering how to get multi-column toc in presentation. The code of Test1.qmd is given below:

---
title: "Test"
author: "A B c"
format:
  revealjs: 
    toc: true
    toc_float: true
    toc-depth: 2
    toc-location: body
    toc-title: "Contents"
    css: styles.css
---

# Intro1

## Intro11

AS


# Intro2

## Intro21

AS

Output

1

There are 1 best solutions below

0
On

I'm not aware of existing YAML multi-column TOC.
To achieve the desired result you could place CSS code below, inside your styles.css:

.reveal ul {
    display: flex;
    justify-content: space-evenly;  /* space-around */
}

Just for the record, one can put content in side by side columns.
Run again .qmd:

---
title: "Test"
author: "M Yaseen"
format:
  revealjs: 
    toc: true
    toc_float: true
    toc-depth: 2
    toc-location: body
    toc-title: "Contents"
    css: styles.css
---

# Intro 1

## Intro 1.1

:::: {.columns}

::: {.column width="40%"}
Content in left column
:::

::: {.column width="60%"}
Content in right column
:::

::::


# Intro 2

## Intro 2.1

Content...


# Intro 3

## Intro 3.1

Content...  


# Intro 4

## Intro 4.1

Content...

Output:
enter image description here