Ich denke, die Idee, dass ein Spoiler nicht sowohl Inline als auch Block sein kann, ist eine Tatsache von CSS, über die der Benutzer nicht informiert werden muss.
Hintergrund: Wie geht HTML damit um?
Betrachten Sie das Fettdrucken. Sie können dies heute in Discourse bbcode schreiben:
A [b]B
C[/b] D
Oder Sie können dies in HTML schreiben:
<!DOCTYPE html>
<html>
<body>
<p>A <strong>B</p>
<p>C</strong> D</p>
</body>
</html>
Es wird genau so gerendert, wie Sie es erwarten würden:
A B
C D
Aber die DOM-Darstellung sieht so aus:
<p>A <strong>B</strong></p>
<strong> </strong>
<p><strong>C</strong> D</p>
Die HTML-Spezifikation sieht etwas Ähnliches für mehrblockige Hyperlinks vor. Wenn Sie dies in HTML schreiben:
<!DOCTYPE html>
<html>
<body>
<p>A <a href="https://example.com.">B</p>
<p>C</a> D</p>
</body>
</html>
Die HTML-Spezifikation sieht vor, dass die DOM-Darstellung wie folgt aussieht, mit drei Hyperlinks:
<body>
<p>A <a href="https://example.com.">B</a>
</p><a href="https://example.com."> </a>
<p><a href="https://example.com.">C</a> D</p>
</body>
Mein Vorschlag: Verknüpfte Spoiler
Man könnte sich vorstellen, mehrabsätzige Inline-Spoiler auf ähnliche Weise zu rendern:
<p>A <spoiler>B</spoiler></p>
<p><spoiler>C</spoiler> D</p>
Aber Spoiler unterscheiden sich von Fettdruck, da Spoiler interaktiv sind. Wenn Sie auf den B-Teil des Spoilers klicken, soll sowohl der B- als auch der C-Teil des Spoilers aufgedeckt werden; es soll sich wie „ein Spoiler“ anfühlen und aussehen.
Ich denke, der Weg, dies zu handhaben, ist die Unterstützung von verknüpften Spoilern in der DOM-Darstellung. Vielleicht hätte <spoiler> ein Attribut wie name, und wenn Sie auf einen Spoiler klicken, würden alle Spoiler mit demselben Namen aufgedeckt. (Sollte dies mit Attributen, Eigenschaften oder einem anderen System zur Verknüpfung der drei Spoiler erfolgen? Ich weiß es nicht, machen Sie es, wie Sie wollen.)
Angenommen, Sie haben Markdown wie diesen:
A B
C
D E
[spoiler]F[/spoiler]
Und Sie wählen B, C und D aus und blenden sie aus.
Der Markdown würde dann so aussehen:
A [spoiler]B
C
D[/spoiler] E
[spoiler]F[/spoiler]
Und die generierte DOM würde so aussehen:
<p>A <inline-spoiler name="x">B</inline-spoiler></p>
<block-spoiler name="x"><p>C</p></block-spoiler>
<p><inline-spoiler name="x">D</inline-spoiler> E</p>
<block-spoiler name="y"><p>F</p></block-spoiler>
In JS würden beim Klicken auf einen der drei Spoiler alle Spoiler mit demselben „name“-Attribut zusammen aufgedeckt.
Aus der Perspektive des Endbenutzers würde es sich also so anfühlen, als ob man Inline- und Block-Spoiler mischen und anpassen könnte.