Move querypanel searchbar on top. Fixes #1440

geosolutions-it · Feb 13, 2017 · 2102163 · 2102163
1 parent 2275490
commit 2102163
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 26 deletions.
diff --git a/web/client/components/data/query/QueryBuilder.jsx b/web/client/components/data/query/QueryBuilder.jsx
@@ -114,23 +114,6 @@ const QueryBuilder = React.createClass({
     render() {
         return this.props.attributes.length > 0 ? (
             <div id="queryFormPanel">
-                <div className="querypanel">
-                    <GroupField
-                        attributes={this.props.attributes}
-                        groupLevels={this.props.groupLevels}
-                        filterFields={this.props.filterFields}
-                        groupFields={this.props.groupFields}
-                        removeButtonIcon={this.props.removeButtonIcon}
-                        addButtonIcon={this.props.addButtonIcon}
-                        attributePanelExpanded={this.props.attributePanelExpanded}
-                        actions={this.props.attributeFilterActions}/>
-                    <SpatialFilter
-                        useMapProjection={this.props.useMapProjection}
-                        spatialField={this.props.spatialField}
-                        spatialPanelExpanded={this.props.spatialPanelExpanded}
-                        showDetailsPanel={this.props.showDetailsPanel}
-                        actions={this.props.spatialFilterActions}/>
-                </div>
                 <QueryToolbar
                     params={this.props.params}
                     filterFields={this.props.filterFields}
@@ -148,6 +131,23 @@ const QueryBuilder = React.createClass({
                     sortOptions={this.props.sortOptions}
                     hits={this.props.hits}
                     />
+                <div className="querypanel">
+                    <GroupField
+                        attributes={this.props.attributes}
+                        groupLevels={this.props.groupLevels}
+                        filterFields={this.props.filterFields}
+                        groupFields={this.props.groupFields}
+                        removeButtonIcon={this.props.removeButtonIcon}
+                        addButtonIcon={this.props.addButtonIcon}
+                        attributePanelExpanded={this.props.attributePanelExpanded}
+                        actions={this.props.attributeFilterActions}/>
+                    <SpatialFilter
+                        useMapProjection={this.props.useMapProjection}
+                        spatialField={this.props.spatialField}
+                        spatialPanelExpanded={this.props.spatialPanelExpanded}
+                        showDetailsPanel={this.props.showDetailsPanel}
+                        actions={this.props.spatialFilterActions}/>
+                </div>
             </div>
         ) : (<div style={{margin: "0 auto", width: "60px"}}><Spinner spinnerName="three-bounce"/></div>);
     }

diff --git a/web/client/components/data/query/QueryToolbar.jsx b/web/client/components/data/query/QueryToolbar.jsx
@@ -66,8 +66,8 @@ const QueryToolbar = React.createClass({
             (!fieldsWithValues && !this.props.spatialField.geometry);
 
         return (
-            <div>
-                <ButtonToolbar className="queryFormToolbar">
+            <div className="container-fluid">
+                <ButtonToolbar className="queryFormToolbar row-fluid pull-right">
                     <Button disabled={queryDisabled} id="query" onClick={this.search}>
                         <Glyphicon glyph="glyphicon glyphicon-search"/>
                         <span style={{paddingLeft: "2px"}}><strong><I18N.Message msgId={"queryform.query"}/></strong></span>

diff --git a/web/client/components/data/query/queryform.css b/web/client/components/data/query/queryform.css
@@ -114,15 +114,8 @@
 }
 
 .querypanel{
-    height: 660px;
     max-height: 660px;
     overflow-x: hidden;
     overflow-y: auto;
     border: none;
-    min-width: 700px;
-}
-
-.queryFormToolbar{
-    float: right;
-    padding-top: 15px;
 }