Changing components stacking.

This commit is contained in:
Eric van der Vlist 2022-09-24 00:29:42 +02:00
parent 548d4a43cb
commit 2831f901a7
4 changed files with 10 additions and 13 deletions

View File

@ -47,10 +47,10 @@ const Map: react.FC<{}> = (props: {}) => {
<CurrentLocation />
<Tracks />
</Whiteboard>
</Slippy>
<Layer>
<TiledMap />
</Layer>
</Slippy>
</IonApp>
</IonContent>
<IonHeader className='ion-no-border' translucent={true}>

View File

@ -12,7 +12,7 @@ const Whiteboard: React.FC<WhiteboardProps> = (props: WhiteboardProps) => {
);
return (
<svg width={window.innerWidth} height={window.innerHeight}>
<svg width={window.innerWidth} height={window.innerHeight} className="whiteboard">
<g
transform={`scale(${whiteBoardState.scale}) translate(${whiteBoardState.translation.x},${whiteBoardState.translation.y})`}
>

View File

@ -28,15 +28,7 @@ const Slippy: react.FC<SlippyProps> = (props: SlippyProps) => {
<SingleTouchHandler>
<DoubleTouchHandler>
<WheelHandler>
<div
style={{
position: 'fixed',
width: window.innerWidth + 'px',
height: window.innerHeight + 'px',
}}
>
{props.children}
</div>
</WheelHandler>
</DoubleTouchHandler>
</SingleTouchHandler>

View File

@ -13,6 +13,11 @@ ion-button.get-location {
margin-left: calc(50% - 20px);
}
.whiteboard {
position: fixed;
z-index: 1;
}
.input-file {
width: 0.1px;
height: 0.1px;