Unify some button styles

assets/css/devportal.css

@@ -428,29 +428,6 @@ a.button {
   text-decoration: none !important;
 }
 
-.button, #request_button { /* Should be same as btn btn-primary */
-  display: inline-block;
-  font-weight: 400;
-  text-align: center;
-  white-space: nowrap;
-  vertical-align: middle;
-  user-select: none;
-  border: 1px solid transparent;
-  padding: 0.375rem 0.75rem;
-  font-size: 1rem;
-  line-height: 1.5;
-  border-radius: 0.25rem;
-  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
-  color: #fff;
-  background-color: #1db4ff;
-  border-color: #1db4ff;
-}
-.button:hover {
-  background-color: #43bded;
-  -o-transition: .5s;
-  -webkit-transition: .5s;
-  transition: .5s;
-}
 
 /* Code Tabs ---------------------------------------------------------------- */
 
@@ -1041,8 +1018,36 @@ a.current {
   border-bottom: none;
 }
 
+.content a.button {
+  /* should match the bootstrap buttons */
+  display: inline-block;
+  font-weight: 400;
+  text-align: center;
+  vertical-align: middle;
+  text-decoration: none;
+  line-height: 1.5;
+  padding: 9px 16px;
+  transition: 0.5s;
+  box-shadow: inset 0 0 0 1px #d3d0cf;
+  color: #676463;
+  border: 1px solid #676463;
+}
+
+.content a.button::after {
+  content: " ➝";
+  padding-left: 7px;
+  transition: all .2s ease-in-out;
+  display: inline-block;
+  text-decoration: none;
+}
+
+.content a.button:hover::after {
+  padding-left: 14px;
+}
+
 #main_content_wrapper .btn-outline-secondary:hover,
-#main_content_wrapper .btn-outline-secondary:active {
+#main_content_wrapper .btn-outline-secondary:active,
+.button:hover, #request_button:hover {
   /* Undo Bootstrap styling */
   color: #1b1818;
   background-color: inherit;

assets/js/apitool-rest.js

@@ -58,7 +58,7 @@ function generate_table_of_contents() {
         } else {
             commandlist.append("<li><a href='#"+req.slug+"'>"+req.name+"</a></li>");
         }
-    }); 
+    });
 }
 
 function make_commands_clickable() {
@@ -136,7 +136,7 @@ function select_request(request) {
     if (request === undefined) {
         var el = commandlist.children("li:not(.separator)").eq(0);
         request = slugify(el.text());
-        
+
 /*        var keys  = Object.keys(requests);
         var index = keys.indexOf(cmd);
         if (index === -1) return;*/
@@ -145,7 +145,7 @@ function select_request(request) {
     }
     $(el).siblings().removeClass('selected');
     $(el).addClass('selected');
-    
+
     command = requests[request];
 
     if (command.test_only === true) {
@@ -156,15 +156,15 @@ function select_request(request) {
 
     if (command.description) {
         $(description).html(command.description);
-        
+
         if (command.link) {
-            $(description).append(" <a class='button btn btn-primary' href='" + 
+            $(description).append(" <a class='button btn btn-outline-secondary' href='" + 
                 DOC_BASE+command.link+"'>Read more</a>");
         }
-        
+
         $(description).show();
     } else if (command.link) {
-        $(description).html("<a class='link_underline' href='" + DOC_BASE+ 
+        $(description).html("<a class='link_underline' href='" + DOC_BASE+
                 command.link+"'>Read more</a>");
     } else {
         $(description).hide();
@@ -215,7 +215,7 @@ function send_request() {
 
     $(this).addClass('depressed');
     response_body.addClass('obscured');
-    
+
     var original_cmd = requests[slugify(selected_command.text())];
 
     if (original_cmd.hasOwnProperty("body")) {
@@ -274,13 +274,13 @@ $(document).ready(function() {
     } else {
       select_request();
     }
-    
+
     if (urlParams["base_url"]) {
         change_base_url(urlParams["base_url"]);
     }
-    
+
     request_button.click(send_request);
-    
+
 });
 
 var urlParams;

assets/js/apitool-websocket.js

@@ -380,7 +380,7 @@ var urlParams;
     if (command._description) {
       //$(description).html(command._description).show();
       $(description).html(command._description);
-      $(description).append(" <a class='button btn btn-primary' href='"+command._link+"'>Read more</a>");
+      $(description).append(" <a class='button btn btn-outline-secondary' href='"+command._link+"'>Read more</a>");
     } else {
       $(description).hide();
     }

tool/template-rest-api-tool.html

@@ -31,7 +31,7 @@
                     </div>
                     <div id='request_body'></div>
                     <div id='request_options'>
-                        <a class="btn btn-primary api" id='request_button'>Send request</a>
+                        <a class="btn btn-outline-secondary api" id='request_button'>Send request</a>
                     </div>
                 </div>
                 <div id='output' class='io'>

tool/template-websocket-api-tool.html

@@ -57,7 +57,7 @@
                     <p>JSON</p>
                     <div id='request'></div>
                     <div id='request_options'>
-                        <div class="button btn btn-primary api" id='request_button'>Send request</div>
+                        <div class="button btn btn-outline-secondary api" id='request_button'>Send request</div>
                     </div>
                 </div>
                 <div id='output' class='io'>