En la imagen 1, cuando el usuario hace clic en "Aplicar cupón", una ventana se desliza desde la izquierda justo encima de la página web (ver imagen 2). ¿Cómo lograr esto? Y en la imagen 2, podemos ver un color azul transparente en la página web justo al lado de la ventana que se desliza desde la izquierda. ¿Cómo lograrlo?
Míralo. Haga clic aquí y vea el código de demostración. Si esto le ayuda, márquelo como respuesta;
import { useState } from 'react' import "./styles.css"; import Sidebar from './component/sidebar' export default function App() { const [toggle, setToggle] = useState(false); const handleToggle = () => { setToggle(pre => !pre) } return ( <div className="App"> <button onClick={handleToggle} >Click Me</button> {toggle && <Sidebar close={() => setToggle(false)} />} </div> ); }