From 1be0c26573b65f18d048249c7648f7f6eb89fdec Mon Sep 17 00:00:00 2001
From: rhenck <richard.henck@iqb.hu-berlin.de>
Date: Fri, 3 Dec 2021 12:48:35 +0100
Subject: [PATCH] Improve drop list item margins
---
projects/common/ui-elements/drop-list/drop-list.component.ts | 5 ++++-
1 file changed, 4 insertions(+), 1 deletion(-)
diff --git a/projects/common/ui-elements/drop-list/drop-list.component.ts b/projects/common/ui-elements/drop-list/drop-list.component.ts
index 1d8daba50..86e257258 100644
--- a/projects/common/ui-elements/drop-list/drop-list.component.ts
+++ b/projects/common/ui-elements/drop-list/drop-list.component.ts
@@ -35,6 +35,8 @@ import { DragNDropValueObject } from '../../models/uI-element';
(cdkDropListDropped)="drop($event)">
<ng-container *ngFor="let value of $any(elementModel.value)">
<div class="item" *ngIf="!value.imgSrcValue" cdkDrag
+ [ngClass]="{ 'vertical-orientation' : elementModel.orientation === 'vertical',
+ 'horizontal-orientation' : elementModel.orientation === 'horizontal'}"
[style.background-color]="elementModel.itemBackgroundColor"
(cdkDragStarted)=dragStart() (cdkDragEnded)="dragEnd()">
<div *cdkDragPreview
@@ -64,7 +66,8 @@ import { DragNDropValueObject } from '../../models/uI-element';
'.item {border-radius: 10px; padding: 10px;}',
'.item {cursor: grab}',
'.item:active {cursor: grabbing}',
- '.item:not(:last-child) {margin-bottom: 5px;}',
+ '.vertical-orientation.item:not(:last-child) {margin-bottom: 5px;}',
+ '.horizontal-orientation.item:not(:last-child) {margin-right: 5px}',
'.error-message {font-size: 75%; margin-top: 10px;}',
'.cdk-drag-preview {padding: 8px 20px; border-radius: 10px}',
'.drag-placeholder {background-color: lightgrey; border: dotted 3px #999; padding: 10px;}',
--
GitLab