move toggle source, remove link to top

Author: antoinem

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

@@ -82,9 +82,6 @@
                                   gsub( /^\w+\./m, '')).
                                   gsub(/(.*)[-=]>/, '\1→') %>
                           </span>
-                          <%- if i == 0 and method.token_stream then -%>
-                            <span class="method-click-advice">toggle source</span>
-                          <%- end -%>
                         </div>
                       <%- end -%>
                     <%- elsif method.has_call_seq? then -%>
@@ -93,11 +90,8 @@
                       </div>
                     <%- else -%>
                       <div class="method-heading">
-                        <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>
-                        <%- end -%>
+                        <span class="method-name"><%= h method.name %></span>
+                        <span class="method-args"><%= h method.param_seq %></span>
                       </div>
                     <%- end -%>
                   </div>
@@ -115,6 +109,7 @@
                         </div>
                       <%- end -%> 
                       <%- if method.token_stream then -%>
+                        <button class="toggle-source">toggle source</button>
                         <div class="method-source-code" id="<%= method.html_name %>-source">
                           <pre><%= method.markup_code %></pre>
                         </div>

lib/rdoc/generator/template/rorvswild/css/rdoc.css

@@ -208,14 +208,15 @@ details > summary::after {
   content: '+';
   font-size: 0.833em;
   font-weight: bold;
-  width: 22px;
-  height: 22px;
-  line-height: 20px;
+  width: 2em;
+  height: 2em;
+  line-height: 2em;
   border-radius: 50%;
   text-align: center;
   box-shadow: 0 0 0 1px var(--color-border) inset;
   transition: transform 0.2s ease;
   display: inline-block;
+  flex-shrink: 0;
   cursor: pointer;
   position: relative;
   top: 2px;
@@ -707,26 +708,29 @@ em {
   font-size: 1rem;
   font-weight: bold;
   color: var(--color-text);
-  cursor: pointer;
 }
 
 .method-heading span { background-color: var(--color-code-background); }
 
 .method-heading :any-link { color: inherit; }
 
-.method-heading .method-click-advice {
-  background-color: transparent;
-  position: absolute;
-  color: var(--color-text-light);
-  right: 0;
-  font-size: 0.694rem;
+.toggle-source {
+  margin-top: 0.5rem;
+  font-size: 0.833rem;
   font-weight: 400;
-  visibility: hidden;
-  padding-right: 0;
-  line-height: 1.5rem;
+  line-height: 1rem;
+  background: var(--color-code-background);
+  box-shadow: 0 0 0 1px var(--color-border);
+  color: var(--color-text);
+  border-radius: 2px;
+  border: none;
+  cursor: pointer;
 }
 
-.method-header:hover .method-click-advice { visibility: visible; }
+.toggle-source:hover {
+  box-shadow: 0 0 0 1px var(--color-text-light);
+  color: var(--color-title);
+}
 
 .method-description,
 .aliases {

lib/rdoc/generator/template/rorvswild/js/darkfish.js

@@ -34,7 +34,7 @@ function showSource( e ) {
 };
 
 function hookSourceViews() {
-  document.querySelectorAll('.method-heading').forEach(function (codeObject) {
+  document.querySelectorAll('.toggle-source').forEach(function (codeObject) {
     codeObject.addEventListener('click', showSource);
   });
 };

lib/rdoc/markup/to_html.rb

@@ -308,8 +308,7 @@ def accept_heading heading
             end
     @res << to_html(heading.text)
     unless @options.pipe then
-      @res << "<span><a href=\"##{label}\">&para;</a>"
-      @res << " <a href=\"#top\">&uarr;</a></span>"
+      @res << "<span><a href=\"##{label}\">&para;</a></span>"
     end
     @res << "</h#{level}>\n"
   end