Click me
- Foo
- Bar
- Baz
- Qux
function logSomething(something) {
console.log('Something', something);
}
<details>
<summary>Click me</summary>
### Heading
1. Foo
2. Bar
* Baz
* Qux
### Some Javascript
```js
function logSomething(something) {
console.log('Something', something);
}
```
</details>
To have a collapsible section expanded by default, simply include the 'open' attribute within the <details>
tag:
Hello
World!<details open>
<summary>Hello</summary>
World!
</details>
You can modify the appearance of the clickable text by adding styling inside the <summary>
tags:
Wow, so fancy
WOW, SO BOLD<details>
<summary><i>Wow, so fancy</i></summary>
<b>WOW, SO BOLD</b>
</details>
NB: When including headings within collapsible sections, remember to add a new line after the <summary>
tag.
Section A
Section A.B
Section A.B.C
Section A.B.C.D
Done!<details>
<summary>Section A</summary>
<details>
<summary>Section A.B</summary>
<details>
<summary>Section A.B.C</summary>
<details>
<summary>Section A.B.C.D</summary>
Done!
</details>
</details>
</details>
</details>
- If certain markdown or styling, such as
# My Title
, fails to render in the collapsible section, try adding a line break after the</summary>
tag. - If your section fails to render, it might be malformed. Consider copying the functional examples provided here and building from there!
Using this code in my project README.md on GitHub
I get what it should be:
Setup and fine tuning
For advanced sutup you can edit `config/config.yml` selfexplanatory configuration file. This file by default is located in `config` subfolder of program file location.1. Main configuration file
But when I use the same code on GitHub Pages with classic minima skin I get line break between marker and summary tip the same as moshiurse wrote above.
![image](https://private-user-images.githubusercontent.com/14954512/326351090-7c40c7b5-17fd-42a1-9c58-e32582a474e1.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjE2Mzg3NDEsIm5iZiI6MTcyMTYzODQ0MSwicGF0aCI6Ii8xNDk1NDUxMi8zMjYzNTEwOTAtN2M0MGM3YjUtMTdmZC00MmExLTljNTgtZTMyNTgyYTQ3NGUxLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MjIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzIyVDA4NTQwMVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWZhYWRmYjczYjQ0ZjMzODY0MjhlZDE5YzZiNjczZGRkYTM4ZjZhY2Y2NWYxY2EwOWY3Nzk2MGQzZGUyMzA0NTUmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.gA0XWH3deagWcFmxzjwhHLLSilB3FAuoKn4qoM4hImo)
Are any thoughts how to fix this?