fix: change panning cursor to col-resize (#2071)
* change panning cursor to col-resize * revert to grabby, and support grabbing
This commit is contained in:
parent
a00432c1c3
commit
6004c4be3e
@ -5,7 +5,7 @@ import { AxisBottom } from './AxisBottom'
|
|||||||
import { Brush } from './Brush'
|
import { Brush } from './Brush'
|
||||||
import { Line } from './Line'
|
import { Line } from './Line'
|
||||||
import { ChartEntry, LiquidityChartRangeInputProps } from './types'
|
import { ChartEntry, LiquidityChartRangeInputProps } from './types'
|
||||||
import Zoom from './Zoom'
|
import Zoom, { ZoomOverlay } from './Zoom'
|
||||||
|
|
||||||
export const xAccessor = (d: ChartEntry) => d.price0
|
export const xAccessor = (d: ChartEntry) => d.price0
|
||||||
export const yAccessor = (d: ChartEntry) => d.activeLiquidity
|
export const yAccessor = (d: ChartEntry) => d.activeLiquidity
|
||||||
@ -117,7 +117,7 @@ export function Chart({
|
|||||||
<AxisBottom xScale={xScale} innerHeight={innerHeight} />
|
<AxisBottom xScale={xScale} innerHeight={innerHeight} />
|
||||||
</g>
|
</g>
|
||||||
|
|
||||||
<rect width={innerWidth} height={height} fill="transparent" ref={zoomRef} cursor="grab" />
|
<ZoomOverlay width={innerWidth} height={height} ref={zoomRef} />
|
||||||
|
|
||||||
<Brush
|
<Brush
|
||||||
id={id}
|
id={id}
|
||||||
|
@ -26,6 +26,15 @@ const Button = styled(ButtonGray)`
|
|||||||
padding: 4px;
|
padding: 4px;
|
||||||
`
|
`
|
||||||
|
|
||||||
|
export const ZoomOverlay = styled.rect`
|
||||||
|
fill: transparent;
|
||||||
|
cursor: grab;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
cursor: grabbing;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
export default function Zoom({
|
export default function Zoom({
|
||||||
svg,
|
svg,
|
||||||
xScale,
|
xScale,
|
||||||
|
Loading…
Reference in New Issue
Block a user