From 61e5d1676c0f2c93f6d89218c85e3851a5dd13b1 Mon Sep 17 00:00:00 2001
From: Sebastian <sebastian@squidex.io>
Date: Sat, 2 Jun 2018 13:52:23 +0200
Subject: [PATCH] Codemirror fixes.

---
 src/Squidex/app/app.ts                                   | 9 ---------
 .../api/pages/graphql/graphql-page.component.scss        | 4 ++++
 .../features/api/pages/graphql/graphql-page.component.ts | 6 +++---
 .../content/pages/content/content-page.component.html    | 6 +++---
 .../content/shared/content-status.component.html         | 4 ++--
 src/Squidex/app/shared/components/asset.component.html   | 8 ++++----
 src/Squidex/app/theme/theme.scss                         | 9 +++++++++
 src/Squidex/package.json                                 | 1 +
 src/Squidex/tsconfig.json                                | 3 +++
 9 files changed, 29 insertions(+), 21 deletions(-)

diff --git a/src/Squidex/app/app.ts b/src/Squidex/app/app.ts
index cefb6fb49..4b7765637 100644
--- a/src/Squidex/app/app.ts
+++ b/src/Squidex/app/app.ts
@@ -7,15 +7,6 @@
 
 import './theme/theme.scss';
 
-// icomoon
-import './theme/icomoon/style.css';
-
-// Pikaday
-import 'pikaday/css/pikaday.css';
-
-// Dragula
-import 'dragula/dist/dragula.css';
-
 import { enableProdMode } from '@angular/core';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 
diff --git a/src/Squidex/app/features/api/pages/graphql/graphql-page.component.scss b/src/Squidex/app/features/api/pages/graphql/graphql-page.component.scss
index 41707fac7..6d3c84b1c 100644
--- a/src/Squidex/app/features/api/pages/graphql/graphql-page.component.scss
+++ b/src/Squidex/app/features/api/pages/graphql/graphql-page.component.scss
@@ -18,4 +18,8 @@
             overflow: hidden;
         }
     }
+
+    .CodeMirror-linenumbers {
+        min-width: 29px;
+    }
 }
\ No newline at end of file
diff --git a/src/Squidex/app/features/api/pages/graphql/graphql-page.component.ts b/src/Squidex/app/features/api/pages/graphql/graphql-page.component.ts
index 629432044..8c59c1a4b 100644
--- a/src/Squidex/app/features/api/pages/graphql/graphql-page.component.ts
+++ b/src/Squidex/app/features/api/pages/graphql/graphql-page.component.ts
@@ -5,7 +5,7 @@
  * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
  */
 
-import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
+import { AfterViewInit, Component, ElementRef, ViewChild } from '@angular/core';
 import { of } from 'rxjs';
 import { catchError } from 'rxjs/operators';
 
@@ -21,7 +21,7 @@ import { AppsState, GraphQlService } from '@app/shared';
     styleUrls: ['./graphql-page.component.scss'],
     templateUrl: './graphql-page.component.html'
 })
-export class GraphQLPageComponent implements OnInit {
+export class GraphQLPageComponent implements AfterViewInit {
     @ViewChild('graphiQLContainer')
     public graphiQLContainer: ElementRef;
 
@@ -31,7 +31,7 @@ export class GraphQLPageComponent implements OnInit {
     ) {
     }
 
-    public ngOnInit() {
+    public ngAfterViewInit() {
         ReactDOM.render(
             React.createElement(GraphiQL, {
                 fetcher: (params: any) => {
diff --git a/src/Squidex/app/features/content/pages/content/content-page.component.html b/src/Squidex/app/features/content/pages/content/content-page.component.html
index c839cd4bc..35ba07fa3 100644
--- a/src/Squidex/app/features/content/pages/content/content-page.component.html
+++ b/src/Squidex/app/features/content/pages/content/content-page.component.html
@@ -31,7 +31,7 @@
                 <sqx-shortcut keys="ctrl+s" (trigger)="saveAndPublish()"></sqx-shortcut>
             </ng-container>
             <ng-template #notNew>
-                <div class="dropdown dropdown-options" *ngIf="content">
+                <div class="dropdown dropdown-options ml-1" *ngIf="content">
                     <button type="button" class="btn btn-outline-secondary" (click)="dropdown.toggle()" [class.active]="dropdown.isOpen | async" #optionsButton>
                         <sqx-content-status 
                             [status]="content.status"
@@ -80,11 +80,11 @@
                 </div>        
 
                 <ng-container *ngIf="content.status !== 'Archived'">
-                    <button type="button" class="btn btn-secondary" (click)="saveAsProposal()" *ngIf="content.status === 'Published'">
+                    <button type="button" class="btn btn-secondary ml-1" (click)="saveAsProposal()" *ngIf="content.status === 'Published'">
                         Save as Draft
                     </button>
                     
-                    <button type="submit" class="btn btn-primary" title="CTRL + S">
+                    <button type="submit" class="btn btn-primary ml-1" title="CTRL + S">
                         Save
                     </button>
 
diff --git a/src/Squidex/app/features/content/shared/content-status.component.html b/src/Squidex/app/features/content/shared/content-status.component.html
index 946265d21..7166be180 100644
--- a/src/Squidex/app/features/content/shared/content-status.component.html
+++ b/src/Squidex/app/features/content/shared/content-status.component.html
@@ -1,5 +1,5 @@
 <span *ngIf="!scheduledTo">
-    <span class="content-status content-status-{{displayStatus | lowercase}}" #statusIcon>
+    <span class="content-status content-status-{{displayStatus | lowercase}} mr-1" #statusIcon>
         <i class="icon-circle"></i>
     </span>
 
@@ -7,7 +7,7 @@
 </span>
 
 <span *ngIf="scheduledTo">
-    <span class="content-status content-status-{{scheduledTo | lowercase}}" #statusIcon>
+    <span class="content-status content-status-{{scheduledTo | lowercase}} mr-1" #statusIcon>
         <i class="icon-clock"></i>
     </span>
 
diff --git a/src/Squidex/app/shared/components/asset.component.html b/src/Squidex/app/shared/components/asset.component.html
index 2e826bb30..1a25cb889 100644
--- a/src/Squidex/app/shared/components/asset.component.html
+++ b/src/Squidex/app/shared/components/asset.component.html
@@ -16,17 +16,17 @@
                 <div class="file-overlay-background"></div>
                 
                 <div class="file-menu">
-                    <a class="file-edit" *ngIf="!isDisabled" (click)="renameDialog.show()">
+                    <a class="file-edit ml-1" *ngIf="!isDisabled" (click)="renameDialog.show()">
                         <i class="icon-pencil"></i>
                     </a>
-                    <a class="file-download" [attr.href]="asset | sqxAssetUrl" target="_blank" (click)="$event.stopPropagation()">
+                    <a class="file-download ml-1" [attr.href]="asset | sqxAssetUrl" target="_blank" (click)="$event.stopPropagation()">
                         <i class="icon-download"></i>
                     </a>
     
-                    <a class="file-delete" (click)="deleting.emit(asset); $event.stopPropagation()" *ngIf="!isDisabled && !removeMode">
+                    <a class="file-delete ml-1" (click)="deleting.emit(asset); $event.stopPropagation()" *ngIf="!isDisabled && !removeMode">
                         <i class="icon-delete"></i>
                     </a>
-                    <a class="file-delete" (click)="removing.emit(asset); $event.stopPropagation()" *ngIf="removeMode">
+                    <a class="file-delete ml-1" (click)="removing.emit(asset); $event.stopPropagation()" *ngIf="removeMode">
                         <i class="icon-close"></i>
                     </a>
                 </div>
diff --git a/src/Squidex/app/theme/theme.scss b/src/Squidex/app/theme/theme.scss
index f2329079c..3dca4d75d 100644
--- a/src/Squidex/app/theme/theme.scss
+++ b/src/Squidex/app/theme/theme.scss
@@ -3,9 +3,18 @@
 // Bootstrap
 @import '~bootstrap/scss/bootstrap.scss';
 
+// Pikaday
+@import '~pikaday/css/pikaday.css';
+
+// Dragula
+@import '~dragula/dist/dragula.css';
+
 // Bootstrap Overrides
 @import '_bootstrap.scss';
 
+// icomoon
+@import './icomoon/style.css';
+
 @import '_common';
 @import '_panels';
 @import '_forms';
diff --git a/src/Squidex/package.json b/src/Squidex/package.json
index b57c27fc2..333ef68f3 100644
--- a/src/Squidex/package.json
+++ b/src/Squidex/package.json
@@ -28,6 +28,7 @@
     "angular2-chartjs": "0.5.1",
     "babel-polyfill": "6.26.0",
     "bootstrap": "4.1.1",
+    "codemirror": "5.38.0",
     "core-js": "2.5.7",
     "dragula": "3.7.2",
     "graphiql": "0.11.11",
diff --git a/src/Squidex/tsconfig.json b/src/Squidex/tsconfig.json
index 76e9a508a..af90295f4 100644
--- a/src/Squidex/tsconfig.json
+++ b/src/Squidex/tsconfig.json
@@ -18,5 +18,8 @@
         "app/*"
       ]
     }
+  },
+  "angularCompilerOptions": { 
+    "preserveWhitespaces": true 
   }
 }
\ No newline at end of file