diff --git a/assets/javascripts/discourse/templates/components/explorer-schema.hbs b/assets/javascripts/discourse/templates/components/explorer-schema.hbs
index a74ad71..82104f4 100644
--- a/assets/javascripts/discourse/templates/components/explorer-schema.hbs
+++ b/assets/javascripts/discourse/templates/components/explorer-schema.hbs
@@ -1,9 +1,15 @@
-{{text-field value=filter placeholderKey="explorer.schema.filter"}}
-{{conditional-loading-spinner condition=loading}}
-
-
- {{#each tables as |table|}}
- {{explorer-schema-onetable table=table}}
- {{/each}}
-
+{{#if hideSchema}}
+ {{d-button action="expandSchema" icon="chevron-left" class="no-text unhide"}}
+{{/if}}
+
+ {{text-field value=filter placeholderKey="explorer.schema.filter"}}
+ {{d-button action="collapseSchema" icon="chevron-right" class="no-text btn-small"}}
+ {{conditional-loading-spinner condition=loading}}
+
+
+ {{#each tables as |table|}}
+ {{explorer-schema-onetable table=table}}
+ {{/each}}
+
+
diff --git a/assets/javascripts/discourse/views/admin-plugins-explorer.js.es6 b/assets/javascripts/discourse/views/admin-plugins-explorer.js.es6
index f009a7a..aaf83cb 100644
--- a/assets/javascripts/discourse/views/admin-plugins-explorer.js.es6
+++ b/assets/javascripts/discourse/views/admin-plugins-explorer.js.es6
@@ -1,5 +1,11 @@
export default Ember.View.extend({
+
+ _onHideSchema: function() {
+ Em.Logger.log('resizing');
+ this.appEvents.trigger('ace:resize');
+ }.observes('controller.hideSchema'),
+
_bindGrippie: function() {
const $editPane = this.$().find('.query-editor');
if (!$editPane.length) {
diff --git a/assets/stylesheets/explorer.scss b/assets/stylesheets/explorer.scss
index 748d1e9..f681248 100644
--- a/assets/stylesheets/explorer.scss
+++ b/assets/stylesheets/explorer.scss
@@ -6,8 +6,28 @@
border: 1px solid dark-light-diff($primary, $secondary, 80%, -20%);
margin-bottom: 15px;
.editor-panel {
- float: left;
width: 65%;
+ }
+ .right-panel {
+ width: 35%;
+ }
+ &.no-schema {
+ .editor-panel {
+ width: 100%;
+ }
+ .right-panel {
+ width: 0;
+ button.unhide {
+ position: absolute;
+ margin-left: -31px;
+ z-index: 1;
+ }
+ }
+ }
+
+
+ .editor-panel {
+ float: left;
.ace-wrapper {
position: relative;
height: 400px;
@@ -23,7 +43,6 @@
}
.right-panel {
float: right;
- width: calc(35% - 0px);
.schema {
border-left: 1px solid dark-light-diff($primary, $secondary, 80%, -20%);
height: 400px;
@@ -32,6 +51,12 @@
color: dark-light-diff($primary, $secondary, 20%, -20%);
font-size: 11px;
+ input {
+ padding: 4px;
+ margin: 3px;
+ // 100% - padding + margin * 2 - border - button - buttonborder
+ width: calc(100% - 14px - 1px - 22px - 2px);
+ }
.schema-table-name {
font-weight: bold;
border-bottom: 1px solid dark-light-diff($primary, $secondary, 80%, -20%);
@@ -127,11 +152,6 @@
display: block;
margin: auto;
}
-.schema input {
- padding: 4px;
- margin: 3px;
- width: calc(100% - 7px - 7px - 1px);
-}
.query-params {
border: 1px solid dark-light-diff($primary, $secondary, 60%, -20%);