edit: workaround for <details> not showing the toggle

edit/edit.css

@@ -473,6 +473,13 @@ body[data-match-highlight="selection"] .CodeMirror-selection-highlight-scrollbar
 #lint {
   overflow-y: auto;
   overflow-x: hidden;}
+#lint > summary {
+  /* workaround for overflow:auto to show the toggle triangle */
+  position: absolute;
+}
+#lint > div {
+  margin-top: 4em;
+}
 #lint table {
   font-size: 100%;
   border-spacing: 0;

edit/edit.js

@@ -61,6 +61,15 @@ Promise.all([
   } else {
     initWithSectionStyle({style});
   }
+
+  // workaround part2 for the <details> not showing its toggle icon: hide <summary> on scroll
+  $('#lint').addEventListener('scroll', function () {
+    const newOpacity = this.scrollTop === 0 ? '' : '0';
+    const style = this.firstElementChild.style;
+    if (style.opacity !== newOpacity) {
+      style.opacity = newOpacity;
+    }
+  }, {passive: true});
 });
 
 // make querySelectorAll enumeration code readable