Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Feature/new ux bad drop (#440)

Browse Source
This commit is contained in:
Hetu Nandu 2020-08-27 11:33:25 +05:30 committed by GitHub
parent f0a05e8a3f
commit d53dfede0e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 15 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
app/client/src/components/editorComponents/Dropzone.tsx
View File

@ -11,14 +11,26 @@ const SPRING_CONFIG = {
friction: 0, friction: 0,
tension: 999, tension: 999,
}; };
const DropZoneWrapper = styled.div<{ width: number; height: number }>` const DropZoneWrapper = styled.div<{
width: number;
height: number;
candrop: boolean;
}>`
width: ${props => props.width}px; width: ${props => props.width}px;
height: ${[props => props.height]}px; height: ${[props => props.height]}px;
position: absolute; position: absolute;
background: ${IntentColors.success}; background: ${props => (props.candrop ? IntentColors.success : "#333")};
${props =>
!props.candrop
? `
background-image: linear-gradient(45deg, #EB2121 8.33%, #33322A 8.33%, #33322A 50%, #EB2121 50%, #EB2121 58.33%, #33322A 58.33%, #33322A 100%);
background-size: 16.97px 16.97px;
`
: ""}
border: 1px dashed ${props => props.theme.colors.textAnchor}; border: 1px dashed ${props => props.theme.colors.textAnchor};
will-change: transform; will-change: transform;
opacity: 0.6; opacity: 0.6;
transition: visibility 0s 2s, opacity 2s linear;
z-index: 1; z-index: 1;
`; `;
@ -105,6 +117,7 @@ export const DropZone = forwardRef(
ref={ref} ref={ref}
width={props.width * props.parentColumnWidth} width={props.width * props.parentColumnWidth}
height={props.height * props.parentRowHeight} height={props.height * props.parentRowHeight}
candrop={props.canDrop}
style={{ style={{
transform: interpolate( transform: interpolate(
[X, Y], [X, Y],