sandbox/background-move/src/components/background.tsx

24 lines
564 B
TypeScript

import react from 'react';
import '../theme/background.css';
const Background: react.FC<{
shift: { x: number; y: number };
zoom: number;
}> = (props: { shift: { x: number; y: number }; zoom: number }) => {
console.log(`--- Rendering background, props: ${JSON.stringify(props)} ---`);
return (
<div
className='background'
style={{
transform: `translate(${-props.shift.x}px, ${-props.shift.y}px) scale(${props.zoom})`,
}}
>
<img src='/assets/background.jpg' alt='' />
</div>
);
};
export default Background;