diff --git a/projects/editor/src/app/components/canvas/dynamic-section-helper-grid.component.ts b/projects/editor/src/app/components/canvas/dynamic-section-helper-grid.component.ts index 177d7e531f6dd664a195313636895226c80c5219..e556a6e5d8fd3d97b7826f84fae06345af4d7f59 100644 --- a/projects/editor/src/app/components/canvas/dynamic-section-helper-grid.component.ts +++ b/projects/editor/src/app/components/canvas/dynamic-section-helper-grid.component.ts @@ -1,6 +1,6 @@ import { CdkDragDrop } from '@angular/cdk/drag-drop'; import { - Component, ElementRef, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges + Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core'; import { UIElement, UIElementType } from 'common/models/elements/element'; import { Section } from 'common/models/section'; @@ -29,9 +29,9 @@ import { UnitService } from '../../services/unit.service'; <ng-content></ng-content> `, styles: [ - '.grid-placeholder {border: 5px solid aliceblue; color: lightblue; text-align: center;}' + '.grid-placeholder {border: 5px solid aliceblue; color: lightblue; text-align: center; z-index: -100;}' ] - }) +}) export class DynamicSectionHelperGridComponent implements OnInit, OnChanges { @Input() autoColumnSize!: boolean; @Input() autoRowSize!: boolean; diff --git a/projects/editor/src/app/components/canvas/section-dynamic.component.ts b/projects/editor/src/app/components/canvas/section-dynamic.component.ts index 0022ba61a1f523b7bc1175a6fa449a66f9841422..ef7e5e8a710bb176d74d50e32d37aa5d234c9bad 100644 --- a/projects/editor/src/app/components/canvas/section-dynamic.component.ts +++ b/projects/editor/src/app/components/canvas/section-dynamic.component.ts @@ -25,12 +25,14 @@ import { DynamicSectionHelperGridComponent } from './dynamic-section-helper-grid [gridRowSizes]="section.gridRowSizes" [section]="section" [sectionIndex]="sectionIndex" + [style.isolation]="'isolate'" (transferElement)="transferElement.emit($event)"> <!-- Angular content projection is used in the helper grid component, where the following is the content.--> <aspect-dynamic-canvas-overlay *ngFor="let element of section.elements" #elementComponent + [style.z-index]="element.position.zIndex" [element]="$any(element)" [style.margin-left]="[element.position.marginLeft] | measure" [style.margin-right]="[element.position.marginRight] | measure"