Fixed some icons

main
Boris Sekachev 5 years ago
parent 4c10fc90f6
commit 02faec0797

@ -21,18 +21,24 @@ interface Props {
function DrawPolygonControl(props: Props): JSX.Element { function DrawPolygonControl(props: Props): JSX.Element {
const { canvasInstance, isDrawing } = props; const { canvasInstance, isDrawing } = props;
const dynamcPopoverPros = isDrawing ? { const dynamcPopoverPros = isDrawing ?
overlayStyle: { {
display: 'none', overlayStyle: {
}, display: 'none',
} : {}; },
} :
const dynamicIconProps = isDrawing ? { {};
className: 'cvat-active-canvas-control',
onClick: (): void => { const dynamicIconProps = isDrawing ?
canvasInstance.draw({ enabled: false }); {
}, className: 'cvat-draw-cuboid-control cvat-active-canvas-control',
} : {}; onClick: (): void => {
canvasInstance.draw({ enabled: false });
},
} :
{
className: 'cvat-draw-cuboid-control',
};
return ( return (
<Popover <Popover
@ -41,7 +47,7 @@ function DrawPolygonControl(props: Props): JSX.Element {
placement='right' placement='right'
content={<DrawShapePopoverContainer shapeType={ShapeType.CUBOID} />} content={<DrawShapePopoverContainer shapeType={ShapeType.CUBOID} />}
> >
<Icon className='cvat-draw-cuboid-control' {...dynamicIconProps} component={CubeIcon} /> <Icon {...dynamicIconProps} component={CubeIcon} />
</Popover> </Popover>
); );
} }

@ -20,18 +20,24 @@ interface Props {
function DrawPointsControl(props: Props): JSX.Element { function DrawPointsControl(props: Props): JSX.Element {
const { canvasInstance, isDrawing } = props; const { canvasInstance, isDrawing } = props;
const dynamcPopoverPros = isDrawing ? { const dynamcPopoverPros = isDrawing ?
overlayStyle: { {
display: 'none', overlayStyle: {
}, display: 'none',
} : {}; },
} :
const dynamicIconProps = isDrawing ? { {};
className: 'cvat-active-canvas-control',
onClick: (): void => { const dynamicIconProps = isDrawing ?
canvasInstance.draw({ enabled: false }); {
}, className: 'cvat-draw-points-control cvat-active-canvas-control',
} : {}; onClick: (): void => {
canvasInstance.draw({ enabled: false });
},
} :
{
className: 'cvat-draw-points-control',
};
return ( return (
<Popover <Popover
@ -40,7 +46,7 @@ function DrawPointsControl(props: Props): JSX.Element {
placement='right' placement='right'
content={<DrawShapePopoverContainer shapeType={ShapeType.POINTS} />} content={<DrawShapePopoverContainer shapeType={ShapeType.POINTS} />}
> >
<Icon className='cvat-draw-points-control' {...dynamicIconProps} component={PointIcon} /> <Icon {...dynamicIconProps} component={PointIcon} />
</Popover> </Popover>
); );
} }

@ -20,18 +20,24 @@ interface Props {
function DrawPolygonControl(props: Props): JSX.Element { function DrawPolygonControl(props: Props): JSX.Element {
const { canvasInstance, isDrawing } = props; const { canvasInstance, isDrawing } = props;
const dynamcPopoverPros = isDrawing ? { const dynamcPopoverPros = isDrawing ?
overlayStyle: { {
display: 'none', overlayStyle: {
}, display: 'none',
} : {}; },
} :
const dynamicIconProps = isDrawing ? { {};
className: 'cvat-active-canvas-control',
onClick: (): void => { const dynamicIconProps = isDrawing ?
canvasInstance.draw({ enabled: false }); {
}, className: 'cvat-draw-polygon-control cvat-active-canvas-control',
} : {}; onClick: (): void => {
canvasInstance.draw({ enabled: false });
},
} :
{
className: 'cvat-draw-polygon-control',
};
return ( return (
<Popover <Popover
@ -40,7 +46,7 @@ function DrawPolygonControl(props: Props): JSX.Element {
placement='right' placement='right'
content={<DrawShapePopoverContainer shapeType={ShapeType.POLYGON} />} content={<DrawShapePopoverContainer shapeType={ShapeType.POLYGON} />}
> >
<Icon className='cvat-draw-polygon-control' {...dynamicIconProps} component={PolygonIcon} /> <Icon {...dynamicIconProps} component={PolygonIcon} />
</Popover> </Popover>
); );
} }

@ -20,18 +20,24 @@ interface Props {
function DrawPolylineControl(props: Props): JSX.Element { function DrawPolylineControl(props: Props): JSX.Element {
const { canvasInstance, isDrawing } = props; const { canvasInstance, isDrawing } = props;
const dynamcPopoverPros = isDrawing ? { const dynamcPopoverPros = isDrawing ?
overlayStyle: { {
display: 'none', overlayStyle: {
}, display: 'none',
} : {}; },
} :
const dynamicIconProps = isDrawing ? { {};
className: 'cvat-active-canvas-control',
onClick: (): void => { const dynamicIconProps = isDrawing ?
canvasInstance.draw({ enabled: false }); {
}, className: 'cvat-draw-polyline-control cvat-active-canvas-control',
} : {}; onClick: (): void => {
canvasInstance.draw({ enabled: false });
},
} :
{
className: 'cvat-draw-polyline-control',
};
return ( return (
<Popover <Popover
@ -40,7 +46,7 @@ function DrawPolylineControl(props: Props): JSX.Element {
placement='right' placement='right'
content={<DrawShapePopoverContainer shapeType={ShapeType.POLYLINE} />} content={<DrawShapePopoverContainer shapeType={ShapeType.POLYLINE} />}
> >
<Icon className='cvat-draw-polyline-control' {...dynamicIconProps} component={PolylineIcon} /> <Icon {...dynamicIconProps} component={PolylineIcon} />
</Popover> </Popover>
); );
} }

@ -20,18 +20,24 @@ interface Props {
function DrawRectangleControl(props: Props): JSX.Element { function DrawRectangleControl(props: Props): JSX.Element {
const { canvasInstance, isDrawing } = props; const { canvasInstance, isDrawing } = props;
const dynamcPopoverPros = isDrawing ? { const dynamcPopoverPros = isDrawing ?
overlayStyle: { {
display: 'none', overlayStyle: {
}, display: 'none',
} : {}; },
} :
const dynamicIconProps = isDrawing ? { {};
className: 'cvat-active-canvas-control',
onClick: (): void => { const dynamicIconProps = isDrawing ?
canvasInstance.draw({ enabled: false }); {
}, className: 'cvat-draw-rectangle-control cvat-active-canvas-control',
} : {}; onClick: (): void => {
canvasInstance.draw({ enabled: false });
},
} :
{
className: 'cvat-draw-rectangle-control',
};
return ( return (
<Popover <Popover
@ -40,7 +46,7 @@ function DrawRectangleControl(props: Props): JSX.Element {
placement='right' placement='right'
content={<DrawShapePopoverContainer shapeType={ShapeType.RECTANGLE} />} content={<DrawShapePopoverContainer shapeType={ShapeType.RECTANGLE} />}
> >
<Icon className='cvat-draw-rectangle-control' {...dynamicIconProps} component={RectangleIcon} /> <Icon {...dynamicIconProps} component={RectangleIcon} />
</Popover> </Popover>
); );
} }

Loading…
Cancel
Save