Fixed Pose

fixedPose.js

import React, { useState } from "react";
import posed from "react-pose";
import "./App.css";


const Box = posed.div({
    regular: { width: '10vw', height: '10vh', flip: true },
    fullscreen: { width: "100vw", height: '100vh', flip: true }
});


export default function App() {
    const [fullscreen, setFullscreen] = useState(false);
    const toggle = () => setFullscreen(!fullscreen);
    const pose = fullscreen ? 'fullscreen' : 'regular';

    return <Box className="box" pose={pose} onClick={toggle} />;
}