mirror of
https://github.com/mathuo/dockview
synced 2025-02-10 10:25:46 +00:00
Merge pull request #463 from mathuo/451-provide-drop-target-dropzone-quadrant-class
feat: drop target classnames
This commit is contained in:
commit
cae8f3664e
@ -22,26 +22,26 @@
|
|||||||
will-change: transform;
|
will-change: transform;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
|
||||||
&.dv-overlay-top {
|
&.dv-droptarget-top {
|
||||||
&.dv-overlay-small-vertical {
|
&.dv-droptarget-small-vertical {
|
||||||
border-top: 1px solid var(--dv-drag-over-border-color);
|
border-top: 1px solid var(--dv-drag-over-border-color);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.dv-overlay-bottom {
|
&.dv-droptarget-bottom {
|
||||||
&.dv-overlay-small-vertical {
|
&.dv-droptarget-small-vertical {
|
||||||
border-bottom: 1px solid var(--dv-drag-over-border-color);
|
border-bottom: 1px solid var(--dv-drag-over-border-color);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.dv-overlay-left {
|
&.dv-droptarget-left {
|
||||||
&.dv-overlay-small-horizontal {
|
&.dv-droptarget-small-horizontal {
|
||||||
border-left: 1px solid var(--dv-drag-over-border-color);
|
border-left: 1px solid var(--dv-drag-over-border-color);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.dv-overlay-right {
|
&.dv-droptarget-right {
|
||||||
&.dv-overlay-small-horizontal {
|
&.dv-droptarget-small-horizontal {
|
||||||
border-right: 1px solid var(--dv-drag-over-border-color);
|
border-right: 1px solid var(--dv-drag-over-border-color);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -279,16 +279,25 @@ export class Droptarget extends CompositeDisposable {
|
|||||||
|
|
||||||
this.overlayElement.style.transform = transform;
|
this.overlayElement.style.transform = transform;
|
||||||
|
|
||||||
toggleClass(this.overlayElement, 'dv-overlay-small-vertical', isSmallY);
|
|
||||||
toggleClass(
|
toggleClass(
|
||||||
this.overlayElement,
|
this.overlayElement,
|
||||||
'dv-overlay-small-horizontal',
|
'dv-droptarget-small-vertical',
|
||||||
|
isSmallY
|
||||||
|
);
|
||||||
|
toggleClass(
|
||||||
|
this.overlayElement,
|
||||||
|
'dv-droptarget-small-horizontal',
|
||||||
isSmallX
|
isSmallX
|
||||||
);
|
);
|
||||||
toggleClass(this.overlayElement, 'dv-overlay-left', isLeft);
|
toggleClass(this.overlayElement, 'dv-droptarget-left', isLeft);
|
||||||
toggleClass(this.overlayElement, 'dv-overlay-right', isRight);
|
toggleClass(this.overlayElement, 'dv-droptarget-right', isRight);
|
||||||
toggleClass(this.overlayElement, 'dv-overlay-top', isTop);
|
toggleClass(this.overlayElement, 'dv-droptarget-top', isTop);
|
||||||
toggleClass(this.overlayElement, 'dv-overlay-bottom', isBottom);
|
toggleClass(this.overlayElement, 'dv-droptarget-bottom', isBottom);
|
||||||
|
toggleClass(
|
||||||
|
this.overlayElement,
|
||||||
|
'dv-droptarget-center',
|
||||||
|
quadrant === 'center'
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
private calculateQuadrant(
|
private calculateQuadrant(
|
||||||
|
Loading…
Reference in New Issue
Block a user