spring cleaning

.angular-cli.json

@@ -26,13 +26,13 @@
       "removed-styles": [
         "../node_modules/materialize-css/dist/css/materialize.css",
         "../node_modules/select2/dist/css/select2.css",
+        "../node_modules/bootstrap/dist/css/bootstrap.css",
         "mirage.assets/vendor/jquery.layout/jquery.layout.css"
       ],
       "styles": [
-        "styles.css",
-        "../node_modules/bootstrap/dist/css/bootstrap.css",
         "../node_modules/font-awesome/css/font-awesome.css",
         "../node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
+        "styles.scss",
         "mirage.assets/styles/app.component.scss",
         "mirage.assets/styles/autocomplete.scss",
         "mirage.assets/styles/docsidebar.scss",
@@ -56,12 +56,12 @@
         "mirage.assets/vendor/jquery.layout/jquery-ui.js",
         "mirage.assets/vendor/jquery.layout/jquery.layout.js",
         "mirage.assets/vendor/jquery.simulate.js",
-        "mirage.assets/vendor/urlsafe-base64.bundle.js"
-      ],
-      "scripts": [
+        "mirage.assets/vendor/urlsafe-base64.bundle.js",
         "../node_modules/jquery/dist/jquery.js",
         "../node_modules/bootstrap/dist/js/bootstrap.bundle.js"
       ],
+      "scripts": [
+      ],
       "environmentSource": "environments/environment.ts",
       "environments": {
         "dev": "environments/environment.ts",

src/app/app.component.css

@@ -0,0 +1,5 @@
+.banner {
+    background: #eee;
+    padding: 22px;
+    margin-bottom: 50px;
+}

src/app/app.component.html

@@ -1,11 +1,11 @@
-<main role="main">
-  <div class="jumbotron">
-    <h1 class="display-4">ES Query Editor</h1>
-    <p class="lead">Elastic Search Query Editor</p>
-  </div>
-  <div class="container">
-    <div class="row">
-      <div class="col">      
+<div class="banner">
+  <h1>ES Query Editor</h1>
+  <p>Elastic Search Query Editor</p>
+</div>
+
+<div class="flex-grid">
+    <div class="flex-cell-50">
+
         <query-blocks
             *ngIf="mapping"
             [types]="types"
@@ -14,10 +14,12 @@ <h1 class="display-4">ES Query Editor</h1>
             [mapping]="mapping"
             [result]="result">
         </query-blocks>
-      </div>
-      <div class="col">
+
+    </div>
+    <div class="flex-cell-50">
+
         <pre *ngIf="result.resultQuery.parsed"> {{ result.resultQuery.parsed | json }} </pre>
-      </div>
+
     </div>
-  </div>
-</main>
+</div>
+

src/app/app.module.ts

@@ -5,11 +5,9 @@ import { FormsModule }   from '@angular/forms';
 
 import { AppComponent } from './app.component';
 import { QueryBlocksComponent } from "./queryBlocks/queryBlocks.component";
-import { BoolqueryComponent } from "./queryBlocks/boolquery/boolquery.component";
-import { TypesComponent } from "./queryBlocks/types/types.component";
+import { CompoundQueryComponent } from "./queryBlocks/compoundQuery/compoundQuery.component";
+
 import { SinglequeryComponent } from "./queryBlocks/singlequery/singlequery.component";
-import { EditableComponent } from './queryBlocks/editable/editable.component';
-import { select2Component } from './queryBlocks/select2/select2.component';
 import { MatchQuery } from './queryBlocks/singlequery/queries/match.query';
 import { Match_phraseQuery } from './queryBlocks/singlequery/queries/match_phrase.query';
 import { Match_phase_prefixQuery } from './queryBlocks/singlequery/queries/match_phase_prefix.query';
@@ -49,13 +47,9 @@ import { MatSelectModule , MatButtonModule } from '@angular/material';
   declarations: [
     AppComponent,
   	QueryBlocksComponent, 
-  	BoolqueryComponent,
-  	TypesComponent,
+  	CompoundQueryComponent,
     SortBlockComponent,
   	SinglequeryComponent, 
-  	EditableComponent,
-  	select2Component,
-  	EditableComponent,
   	SinglequeryComponent,
   	MatchQuery,
   	Match_phraseQuery,