Tarea

Ahora procederemos a crear el componente Alert, que renderizará todos los elementos pasados como hijos y aplicará algunos estilos específicos. La tarea es:

1. Crear el componente Alert que contenga el elemento div en su interior.
2. El elemento div debe tener el nombre de clase alert.
3. El elemento div debe tener la prop children como contenido.
4. El elemento div debe tener el siguiente CSS.

padding: 20px;
border-radius: 10px;
background-color: lightgreen;
color: darkmagenta;

1. Para crear un elemento div en el componente, utilizar <div>...</div>.
2. Para pasar props.children como contenido de texto, encerrarlo entre {...} y establecer props.children. Resultado: <div>{props.children}</div>.
3. Para añadir un nombre de clase al elemento div, utilizar el atributo className y establecerlo en alert. Resultado: className="alert".
4. Para importar el archivo con los estilos en el archivo index.js, utilizar la sentencia import y proporcionar la ruta correcta al archivo. Resultado: import './index.css'.
5. Para aplicar estilos al elemento div, utilizar el selector de nombre de clase .alert e insertar los estilos de la tarea.