diff options
| author | James Edwards-Jones <jamedjo@gmail.com> | 2017-09-13 10:28:52 +0000 |
|---|---|---|
| committer | James Edwards-Jones <jedwardsjones@gitlab.com> | 2017-09-15 16:15:59 +0100 |
| commit | f72144fd925433e7771c466238b5ddcf84aecc15 (patch) | |
| tree | aa09aed8ffdd5fc80f35681aab071c9b2023004a | |
| parent | 9c9b1774cbdc2a6cdfbbf8cd33e87e62294e729a (diff) | |
| download | gitlab-ce-jej/demonstrate-details-summary.tar.gz | |
Demonstrate <details> and <summary> tags in doc/user/markdown.mdjej/demonstrate-details-summary
| -rw-r--r-- | doc/user/markdown.md | 24 |
1 files changed, 24 insertions, 0 deletions
diff --git a/doc/user/markdown.md b/doc/user/markdown.md index b42b8f0a525..454988b9b80 100644 --- a/doc/user/markdown.md +++ b/doc/user/markdown.md @@ -596,6 +596,30 @@ See the documentation for HTML::Pipeline's [SanitizationFilter](http://www.rubyd <dd>Does *not* work **very** well. Use HTML <em>tags</em>.</dd> </dl> +#### Details and Summary + +Content can be collapsed using HTML's [`<details>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details) and [`<summary>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/summary) tags. This is especially useful for collapsing long logs so they take up less screen space. + +<p> +<details> +<summary>Click me to collapse/fold.</summary> +These details will remain hidden until expanded. + +<pre><code>PASTE LOGS HERE</code></pre> +</details> +</p> + +**Note:** Unfortunately Markdown is not supported inside these tags, as described by the [markdown specification](https://daringfireball.net/projects/markdown/syntax#html). You can work around this by using HTML, for example you can use `<pre><code>` tags instead of [code fences](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/doc/user/markdown.md#code-and-syntax-highlighting). + +```html +<details> +<summary>Click me to collapse/fold.</summary> +These details will remain hidden until expanded. + +<pre><code>PASTE LOGS HERE</code></pre> +</details> +``` + ### Horizontal Rule ``` |