Styling improved for array-item.

src/Squidex/Squidex.csproj

@@ -23,6 +23,7 @@
 
     <Compile Remove="Assets\**" />
     <Content Remove="Assets\**" />
+    <Content Remove="package-lock.json" />
 
     <None Remove="Assets\**" />
   </ItemGroup>

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();

src/Squidex/app/features/content/shared/array-item.component.html

@@ -1,21 +1,25 @@
-<div class="item" [class.invalid]="isInvalid | async">
+<div class="card item" [class.invalid]="isInvalid | async">
-    <div class="header drag-handle">
+    <div class="card-header drag-handle">
-        <i class="icon-drag2 mr-1"></i>
+        <span class="pull-left">
-
+            <i class="icon-drag2 mr-1"></i>
-        <span class="header-text text-decent">Item #{{index + 1}}</span>
+    
+            <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">
+    <div class="card-body">
-        <sqx-field-editor
+        <div class="form-group" *ngFor="let fieldControl of fieldControls">
-            [form]="form"
+            <sqx-field-editor
-            [field]="fieldControl.field"
+                [form]="form"
-            [language]="language"
+                [field]="fieldControl.field"
-            [languages]="languages"
+                [language]="language"
-            [control]="fieldControl.control">
+                [languages]="languages"
-        </sqx-field-editor>
+                [control]="fieldControl.control">
+            </sqx-field-editor>
+        </div>
     </div>
 </div>

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 {
+    &-header {
-        @include absolute(.5rem, .5rem, auto, auto);
+        line-height: 2.2rem;
     }
 }
 
-.header {
+.remove {
-    margin-bottom: .25rem;
+    @include absolute(.5rem, .5rem, auto, auto);
 }
 
 .invalid {