Make it easier to select shortlinks.

r2/r2/public/static/css/reddit.css

@@ -4175,7 +4175,18 @@ dd { margin-left: 20px;  }
 .linkinfo .upvotes {font-size: 80%; color: orangered;}
 .linkinfo .downvotes {font-size: 80%; color: #5f99cf; }
 .linkinfo .shortlink {font-size: 80%; margin-top: 3px; }
-.linkinfo .shortlink a {font-size: 120%; font-family: monospace}
+
+.linkinfo .shortlink input {
+    border: 1px solid gray;
+    font-family: monospace;
+    font-size: 140%;
+    padding: 3px 2px;
+    width: 175px;
+}
+
+.linkinfo .shortlink input:hover {
+    cursor: text;
+}
 
 .linkinfo table {margin-top: 5px;}
 

r2/r2/public/static/js/reddit.js

@@ -1350,6 +1350,11 @@ $(function() {
             $("#moresearchinfo").slideUp();
             event.preventDefault();
         });
+        
+        /* Select shortlink text on click */
+        $("#shortlink-text").click(function() {
+            $(this).select();
+        });
     });
 
 function show_friend(account_fullname) {

r2/r2/templates/linkinfobar.html

@@ -59,7 +59,7 @@
   <div class="shortlink">
     shortlink:
     &#32;
-    <a href="http://${thing.a.shortlink}">${thing.a.shortlink}</a>
+    <input type="text" value="http://${thing.a.shortlink}" readonly="readonly" id="shortlink-text" />
   </div>
 %endif