From d65eb2ffcd1f6a08e7c8589b51e07983998cf0cc Mon Sep 17 00:00:00 2001
From: Sebastian Stehle <sebastian@squidex.io>
Date: Fri, 16 Nov 2018 21:38:48 +0100
Subject: [PATCH] Styling improved for array-item.

---
 src/Squidex/Squidex.csproj                    |  1 +
 src/Squidex/WebStartup.cs                     |  3 ++
 .../content/shared/array-item.component.html  | 32 +++++++++++--------
 .../content/shared/array-item.component.scss  | 13 +++-----
 4 files changed, 27 insertions(+), 22 deletions(-)

diff --git a/src/Squidex/Squidex.csproj b/src/Squidex/Squidex.csproj
index 95b637214..93f9dad74 100644
--- a/src/Squidex/Squidex.csproj
+++ b/src/Squidex/Squidex.csproj
@@ -23,6 +23,7 @@
 
     <Compile Remove="Assets\**" />
     <Content Remove="Assets\**" />
+    <Content Remove="package-lock.json" />
 
     <None Remove="Assets\**" />
   </ItemGroup>
diff --git a/src/Squidex/WebStartup.cs b/src/Squidex/WebStartup.cs
index ff233f5f7..034293428 100644
--- a/src/Squidex/WebStartup.cs
+++ b/src/Squidex/WebStartup.cs
@@ -5,6 +5,7 @@
 //  All rights reserved. Licensed under the MIT license.
 // ==========================================================================
 
+using Ben.Diagnostics;
 using Microsoft.AspNetCore.Builder;
 using Microsoft.Extensions.Configuration;
 using Microsoft.Extensions.DependencyInjection;
@@ -41,6 +42,8 @@ namespace Squidex
         {
             app.ApplicationServices.LogConfiguration();
 
+            app.UseBlockingDetection();
+
             app.UseMyHealthCheck();
             app.UseMyRobotsTxt();
             app.UseMyTracking();
diff --git a/src/Squidex/app/features/content/shared/array-item.component.html b/src/Squidex/app/features/content/shared/array-item.component.html
index 8c03b7c9d..337033cfa 100644
--- a/src/Squidex/app/features/content/shared/array-item.component.html
+++ b/src/Squidex/app/features/content/shared/array-item.component.html
@@ -1,21 +1,25 @@
-<div class="item" [class.invalid]="isInvalid | async">
-    <div class="header drag-handle">
-        <i class="icon-drag2 mr-1"></i>
-
-        <span class="header-text text-decent">Item #{{index + 1}}</span>
+<div class="card item" [class.invalid]="isInvalid | async">
+    <div class="card-header drag-handle">
+        <span class="pull-left">
+            <i class="icon-drag2 mr-1"></i>
+    
+            <span class="header-text text-decent">Item #{{index + 1}}</span>
+        </span>
 
-        <button type="button" class="btn btn-link btn-danger item-remove" (click)="removing.emit(); $event.preventDefault()">
+        <button type="button" class="btn btn-link btn-danger float-right" (click)="removing.emit(); $event.preventDefault()">
             <i class="icon-bin2"></i>
         </button>
     </div>
     
-    <div class="form-group" *ngFor="let fieldControl of fieldControls">
-        <sqx-field-editor
-            [form]="form"
-            [field]="fieldControl.field"
-            [language]="language"
-            [languages]="languages"
-            [control]="fieldControl.control">
-        </sqx-field-editor>
+    <div class="card-body">
+        <div class="form-group" *ngFor="let fieldControl of fieldControls">
+            <sqx-field-editor
+                [form]="form"
+                [field]="fieldControl.field"
+                [language]="language"
+                [languages]="languages"
+                [control]="fieldControl.control">
+            </sqx-field-editor>
+        </div>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/Squidex/app/features/content/shared/array-item.component.scss b/src/Squidex/app/features/content/shared/array-item.component.scss
index 5fa17c0f2..959c8356a 100644
--- a/src/Squidex/app/features/content/shared/array-item.component.scss
+++ b/src/Squidex/app/features/content/shared/array-item.component.scss
@@ -1,22 +1,19 @@
 @import '_vars';
 @import '_mixins';
 
-.item {
+.card {
     & {
-        background: $panel-light-background;
         border: 1px solid darken($color-border, 5%);
         border-left-width: 4px;
-        padding: 1rem;
-        position: relative;
     }
 
-    &-remove {
-        @include absolute(.5rem, .5rem, auto, auto);
+    &-header {
+        line-height: 2.2rem;
     }
 }
 
-.header {
-    margin-bottom: .25rem;
+.remove {
+    @include absolute(.5rem, .5rem, auto, auto);
 }
 
 .invalid {