Use details tag for method toggling

Author: st0012

lib/rdoc/generator/template/darkfish/class.rhtml

@@ -109,7 +109,11 @@
                     gsub(/(.*)[-=]>/, '\1→') %>
             </span>
             <%- if i == 0 and method.token_stream then -%>
-            <span class="method-click-advice">Toggle source</span>
+            <div class="method-controls">
+              <details class="method-click-advice">
+                <summary>Source</summary>
+              </details>
+            </div>
             <%- end -%>
           </div>
           <%-   end -%>
@@ -119,10 +123,14 @@
           </div>
           <%- else -%>
           <div class="method-heading">
-            <span class="method-name"><%= h method.name %></span><span
-              class="method-args"><%= h method.param_seq %></span>
+            <span class="method-name"><%= h method.name %></span>
+            <span class="method-args"><%= h method.param_seq %></span>
             <%- if method.token_stream then -%>
-            <span class="method-click-advice">Toggle source</span>
+            <div class="method-controls">
+              <details class="method-click-advice">
+                <summary>Source</summary>
+              </details>
+            </div>
             <%- end -%>
           </div>
           <%- end -%>

lib/rdoc/generator/template/darkfish/css/rdoc.css

@@ -630,7 +630,6 @@ main .method-click-advice {
   position: absolute;
   top: 2px;
   right: 0px;
-  font-size: 12px;
   padding-right: 20px;
   line-height: 20px;
   color: var(--secondary-color);
@@ -739,6 +738,15 @@ main .attribute-access-type {
     overflow-x: auto;
     white-space: nowrap;
   }
+
+  .method-controls {
+    position: static;
+  }
+
+  main .method-click-advice {
+    position: static;
+    display: inline-block;
+  }
 }
 /* @end */