Tweak spoiler code

Refs #13, #14, flarum/core#2053.

extensions/markdown/extend.php

@@ -18,6 +18,9 @@ return [
     (new Extend\Formatter)
         ->configure(function (Configurator $config) {
             $config->Litedown;
-            $config->tags['ispoiler']->template = '<span class="spoiler" data-s9e-livepreview-ignore-attrs="style" onclick="removeAttribute(\'style\'); removeAttribute(\'class\')" style="background:#444;color:transparent"><xsl:apply-templates/></span>';
+
+            // Overwrite the default inline spoiler so that it is compatible
+            // with more styling for children in an external stylesheet.
+            $config->tags['ispoiler']->template = '<span class="spoiler" data-s9e-livepreview-ignore-attrs="class" onclick="removeAttribute(\'class\')"><xsl:apply-templates/></span>';
         })
 ];

extensions/markdown/less/forum.less

@@ -6,14 +6,22 @@
  */
 
 span.spoiler {
+  // Style the inline spoiler itself: a dark block, invisible font
   background: #444;
   color: transparent;
-  cursor: default;
+
+  // Try to generically hide all possible children
   * {
+    // Links and other interactive elements would give their presence
+    // away when hovering
     pointer-events: none;
-    padding: 0;
+
+    // Children can have special text or background colors
+    background: transparent;
     color: transparent;
   }
+
+  // Hide images visually
   img {
     visibility: hidden;
   }