Switch reverse_directions link to use a button

This makes it keyboard selectable, and also preserves the event
handler.

Refs #3637

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index 1f80a9b5b520c08029d9965e273b92b731ec1429..2682af00a40853cea4a3419c4bedd0329e73a3a7 100644 (file)
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -1288,10 +1288,6 @@ tr.turn:hover {
       vertical-align: middle;
     }
   }
-
-  a.reverse_directions {
-    cursor: pointer;
-  }
 }
 
 /* Rules for user images */

diff --git a/app/views/layouts/_search.html.erb b/app/views/layouts/_search.html.erb
index 24e25076f4494fdffb8fdde8f4d1f1c654078a06..922cd4b240d65a402ec053883df2f513d0ad9580 100644 (file)
--- a/app/views/layouts/_search.html.erb
+++ b/app/views/layouts/_search.html.erb
@@ -47,7 +47,7 @@
     </div>
     <div class="row gx-2 m-1">
       <div class="col offset-1">
-        <a class="reverse_directions"><%= t("site.search.reverse_directions_text") %></a>
+        <button class="btn btn-sm btn-link reverse_directions"><%= t("site.search.reverse_directions_text") %></a>
       </div>
     </div>