UX: Style improvements in query edit & result view

assets/javascripts/discourse/controllers/admin-plugins-explorer.js.es6

@@ -102,6 +102,7 @@ export default Ember.Controller.extend({
       this.setProperties({
         asc: null,
         order: null,
+        showResults: false,
         selectedQueryId: null,
         sortBy: ['last_run_at:desc']
       });
@@ -163,6 +164,7 @@ export default Ember.Controller.extend({
       const self = this;
       const query = this.get('selectedItem');
       this.set('loading', true);
+      this.set('showResults', false);
       this.store.destroyRecord('query', query).then(function() {
         query.set('destroyed', true);
       }).catch(popupAjaxError).finally(function() {
@@ -174,6 +176,7 @@ export default Ember.Controller.extend({
       const self = this;
       const query = this.get('selectedItem');
       this.set('loading', true);
+      this.set('showResults', true);
       query.save().then(function() {
         query.set('destroyed', false);
       }).catch(popupAjaxError).finally(function() {

assets/javascripts/discourse/templates/explorer-query-result.hbs

@@ -1,18 +1,22 @@
 <div class="result-info">
-  {{i18n "explorer.download"}}
   {{d-button action="downloadResultJson" icon="download" label="explorer.download_json"}}
   {{d-button action="downloadResultCsv" icon="download" label="explorer.download_csv"}}
-  <div class="result-about">
-    {{duration}}
-  </div>
 </div>
 
+<div class="result-about">
+  {{duration}}
+</div>
+
+<br>
+
 {{~#if hasExplain}}
-  <pre><code>
+  <pre class="result-explain"><code>
     {{~content.explain}}
   </code></pre>
 {{~/if}}
 
+<br>
+
 <table>
   <thead>
   <tr class="headers">

assets/stylesheets/explorer.scss

@@ -298,6 +298,18 @@
   }
 }
 
+.result-info {
+  float: left;
+}
+.result-about {
+  color: $primary-high;
+  float: right;
+}
+.result-explain {
+  padding-top: 1em;
+  margin-bottom: 0px;
+}
+
 .explorer-pad-bottom {
   margin-bottom: 200px;
 }

config/locales/client.en.yml

@@ -48,7 +48,6 @@ en:
       edit: "Edit"
       delete: "Delete"
       recover: "Undelete Query"
-      download: "Download Results"
       download_json: "JSON"
       download_csv: "CSV"
       others_dirty: "A query has unsaved changes that will be lost if you navigate away."