HTML <details> Tag

Should we support details/summary in the syntax? This is what it looks like (works best in chrome)

Example source: http://www.w3schools.com/tags/tag_summary.asp

Copyright 1999-2011.

- by Refsnes Data. All Rights Reserved.

All content and graphics on this web site are the property of the company Refsnes Data.

<details>
<summary>Copyright 1999-2011.</summary>
<p> - by Refsnes Data. All Rights Reserved.</p>
<p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
</details>

If this is a generic extension, maybe it could look like this.
Multiline summaries could be supported by [[[ ... ]]]

!summary[ Copyright 1999-2011. ]
(((
 - by Refsnes Data. All Rights Reserved.

All content and graphics on this web site are the property of the company Refsnes Data.
)))

Or maybe there is a way to make it look neater but in core syntax.

Nice, but I’m still for:

@@@summary[ Copyright 1999-2011. ]
– by Refsnes Data. All Rights Reserved.

All content and graphics on this web site are the property of the company Refsnes Data.
@@@

Or !!! instead of @@@ if you must :wink:

lol, well I guess the real battle is in the generic directive specs. So many issues can be solved just by solving that.

Well at least we got some ideas for this.

We’ll start adding custom directives support in remarkable soon. It will be really nice if we could summarize generic syntax. Now i still see clear syntax only for “blocks”.

@vitaly Nice. The proposed custom directives syntax is in the first post of this topic.

@mb21 Problem is that it’s too “programmish”. That’s only my personal opinion. In block syntax our opinions differ only in ancor names - not a problem. But inline syntax… i don’t like it. It will be very uncommon for non-tech users.

And i don’t see feedback from jgm & other people who participate in final decisions about specs.

1 Like

@vitaly I replied in the other thread since this discussion belongs there.

Is this discussion still valid? The spec provides a way to render markdown inside of the details and summary tags. See http://spec.commonmark.org/0.27/#html-blocks.

I find the raw markdown for this syntax to be a very readable and intuitive solution:

<details><summary>Title</summary>

**Markdown content:**

 - More markdown
 - More markdown
 - More markdown
</details>
Title

Markdown content:

  • More markdown
  • More markdown
  • More markdown
1 Like

Personally, unless the syntax in question is a major improvement over HTML’s, I don’t want it.

3 Likes

How’s this?

>-> Summary
> Details
> More details

Result:

Summary

Details
More details


There’s even a reasonable-looking fallback in existing CommonMark: a block quote containing a symbolic triangle ->, followed by the summary and details.

→ Summary
Details
More details

have another variation/proposition:

{+ Summary of the un/foldable text, likely log or long list

- this is a list item
- one more

    [timestamp] log
    [timestamp] with
    [timestamp] many
    [timestamp] lines

}

I’d like to use <details> elements extensively in web pages produced from Markdown. Is anybody interested in continuing the discussion in this thread? I haven’t found activity on this topic elsewhere.

The OP referenced the explanation of the <summary> tag on w3schools. That page doesn’t mention the following constraints of HTML5:

In particular, paragraph elements are not permitted in a summary in HTML5. I don’t think they need to be allowed in Markdown either.

As mentioned by @deckar01, HTML blocks with <details> and <summary> tags are “very readable and intuitive”, However, they clearly aren’t concise enough for casual use in plain text or emails. The requirement to use English words in the markup also seems inconsistent with the overall aims of Markdown.

The markup proposed by @aoudad above uses >-> for the summary line, and > for the rest of the details content. That seems sufficiently concise and suggestive, and I think it would be a major improvement over the use of HTML. It should be possible to enhance the proposal to allow the summary text to be on more than one line, and to allow the usual markup for headings in the summary. Perhaps some variation on >-> could concisely add the open attribute to the <details> element?

A potential use of details and summary elements in HTML5 is to make entire sections of a web document collapsible, with nesting according to the heading levels. It could be a significant drawback if the Markdown for such a document required prefixing all lines in each section with a number of >'s. The following variant of the proposal would avoid that issue:

  • A summary with phrasing content:
    |>
    Summary
    
    Details
    <|
    

The summary text markup can be more than one line, and it is terminated by a blank line. The summary text is allowed to be empty.

The details markup continues to the first <| (on a line by itself, followed by a blank line) at the same nesting level.

  • A summary with a heading:
    |> 
    # Heading
    
    Details
    <|
    

The pipe character | is used for tables in various extensions of Markdown, but it seems that the above examples would not be confused with valid markup for tables (assuming they are surrounded by blank lines). Summary text that doesn’t contain | might be allowed on the same line as the |>, to enhance the conciseness and suggestiveness of the markup.

1 Like