Details

In Docusaurus werden html-details hübsch dargestellt. Hier ein Beispiel:

<details>
    <summary>
        Mehr zu meinen **Sommerferien** 🍹
    </summary>
    ☀️⛰️🏖️🏝️
</details>

http://localhost:3000

Mehr zu meinen Sommerferien 🍹

☀️⛰️🏖️🏝️

Um die Details mit weniger Aufwand zu erstellen, können auch :::details-Blöcke verwendet werden:

:::details[Mehr zu meinen **Sommerferien** 🍹]
☀️⛰️🏖️🏝️
:::

mit demselben Resultat:

http://localhost:3000

Mehr zu meinen Sommerferien 🍹

☀️⛰️🏖️🏝️

Installation

Code

• src/plugins/remark-details

docusaurus.config.ts

import detailsPlugin from './src/plugins/remark-details/plugin';
const BEFORE_DEFAULT_REMARK_PLUGINS = [
    /* ... */
    detailsPlugin
];