Merge pull request #452 from mathuo/451-provide-drop-target-dropzone-quadrant-class

feat: provide classnames for droptarget overlays
This commit is contained in:
mathuo 2024-01-17 22:43:50 +00:00 committed by GitHub
commit c49fcd4d9d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 26 additions and 12 deletions

View File

@ -22,20 +22,28 @@
will-change: transform; will-change: transform;
pointer-events: none; pointer-events: none;
&.small-top { &.dv-overlay-top {
border-top: 1px solid var(--dv-drag-over-border-color); &.dv-overlay-small-vertical {
border-top: 1px solid var(--dv-drag-over-border-color);
}
} }
&.small-bottom { &.dv-overlay-bottom {
border-bottom: 1px solid var(--dv-drag-over-border-color); &.dv-overlay-small-vertical {
border-bottom: 1px solid var(--dv-drag-over-border-color);
}
} }
&.small-left { &.dv-overlay-left {
border-left: 1px solid var(--dv-drag-over-border-color); &.dv-overlay-small-horizontal {
border-left: 1px solid var(--dv-drag-over-border-color);
}
} }
&.small-right { &.dv-overlay-right {
border-right: 1px solid var(--dv-drag-over-border-color); &.dv-overlay-small-horizontal {
border-right: 1px solid var(--dv-drag-over-border-color);
}
} }
} }
} }

View File

@ -269,10 +269,16 @@ export class Droptarget extends CompositeDisposable {
this.overlayElement.style.transform = transform; this.overlayElement.style.transform = transform;
toggleClass(this.overlayElement, 'small-right', isSmallX && isRight); toggleClass(this.overlayElement, 'dv-overlay-small-vertical', isSmallY);
toggleClass(this.overlayElement, 'small-left', isSmallX && isLeft); toggleClass(
toggleClass(this.overlayElement, 'small-top', isSmallY && isTop); this.overlayElement,
toggleClass(this.overlayElement, 'small-bottom', isSmallY && isBottom); 'dv-overlay-small-horizontal',
isSmallX
);
toggleClass(this.overlayElement, 'dv-overlay-left', isLeft);
toggleClass(this.overlayElement, 'dv-overlay-right', isRight);
toggleClass(this.overlayElement, 'dv-overlay-top', isTop);
toggleClass(this.overlayElement, 'dv-overlay-bottom', isBottom);
} }
private setState(quadrant: Position): void { private setState(quadrant: Position): void {