From 4793277f154e5c79f98d970611b2f13aa65ae769 Mon Sep 17 00:00:00 2001
From: rhenck <richard.henck@iqb.hu-berlin.de>
Date: Thu, 8 Jul 2021 14:28:25 +0200
Subject: [PATCH] [editor] Fix faulty drag and drop behaviour of canvas
 elements

The Material drag and drop stuff does not play well with the
implementation of elements being styled dynamically via CSS. The extra
div element pulls them apart avaoiding problems.
---
 .../page-view/canvas/canvas-drag-overlay.component.ts     | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/projects/editor/src/app/components/unit-view/page-view/canvas/canvas-drag-overlay.component.ts b/projects/editor/src/app/components/unit-view/page-view/canvas/canvas-drag-overlay.component.ts
index ea81fc4d8..3874a1225 100644
--- a/projects/editor/src/app/components/unit-view/page-view/canvas/canvas-drag-overlay.component.ts
+++ b/projects/editor/src/app/components/unit-view/page-view/canvas/canvas-drag-overlay.component.ts
@@ -11,9 +11,11 @@ import * as ComponentUtils from '../../../../../../../common/component-utils';
 @Component({
   selector: 'app-canvas-drag-overlay',
   template: `
-    <div cdkDrag [cdkDragData]="this.element" (click)="click($event)"
-         [ngStyle]="style">
-      <ng-template #elementContainer></ng-template>
+<!--    Needs extra div because styling can interfere with drag and drop-->
+    <div cdkDrag [cdkDragData]="this.element" (click)="click($event)">
+      <div [ngStyle]="style">
+        <ng-template #elementContainer></ng-template>
+      </div>
     </div>
     `,
   styles: [
-- 
GitLab