mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
Fix drag-n-drop indication
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
parent
835d6566b4
commit
63730358b6
@ -20,7 +20,7 @@
|
||||
*/
|
||||
|
||||
.notice {
|
||||
@apply p-8 flex flex-col gap-2 mb-14 rounded-lg;
|
||||
@apply p-8 flex flex-col gap-2 mb-14 mt-3 rounded-lg;
|
||||
background-color: var(--noticeBackground);
|
||||
border: 1px solid var(--boxShadow);
|
||||
color: var(--textColorTertiary);
|
||||
|
||||
@ -8,7 +8,7 @@ import { cssNames } from "../../utils";
|
||||
interface Props extends HTMLAttributes<HTMLDivElement> {
|
||||
children?: ReactNode;
|
||||
index: number;
|
||||
innerRef?: React.LegacyRef<HTMLDivElement>;
|
||||
innerRef?: React.Ref<HTMLDivElement>;
|
||||
}
|
||||
|
||||
export function HotbarCell({ innerRef, children, className, ...rest }: Props) {
|
||||
|
||||
@ -21,10 +21,7 @@
|
||||
|
||||
.DropFileInput {
|
||||
&.droppable {
|
||||
box-shadow: 0 0 0 5px $primary; // fixme: might not work sometimes
|
||||
|
||||
> * {
|
||||
pointer-events: none;
|
||||
}
|
||||
box-shadow: inset 0 0 0 6px $primary;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
}
|
||||
@ -39,15 +39,21 @@ export interface DropFileMeta<T extends HTMLElement = any> {
|
||||
@observer
|
||||
export class DropFileInput<T extends HTMLElement = any> extends React.Component<DropFileInputProps> {
|
||||
@observable dropAreaActive = false;
|
||||
dragCounter = 0; // Counter preventing firing onDragLeave() too early (https://stackoverflow.com/questions/7110353/html5-dragleave-fired-when-hovering-a-child-element)
|
||||
|
||||
@autobind()
|
||||
onDragEnter() {
|
||||
this.dragCounter++;
|
||||
this.dropAreaActive = true;
|
||||
}
|
||||
|
||||
@autobind()
|
||||
onDragLeave() {
|
||||
this.dropAreaActive = false;
|
||||
this.dragCounter--;
|
||||
|
||||
if (this.dragCounter == 0) {
|
||||
this.dropAreaActive = false;
|
||||
}
|
||||
}
|
||||
|
||||
@autobind()
|
||||
|
||||
Loading…
Reference in New Issue
Block a user