Comando composes para archivos en CSS modules en React
El comando composes también se puede aplicar para
reutilizar estilos de un archivo
en otro.
Volvamos a la aplicación buttons,
que hicimos en lecciones anteriores.
Supongamos que queremos agregar a todos
los botones las mismas sombras, estilo de cursor
y fuente en negrita. Dejemos que estos estilos estén
ubicados en el archivo App.module.css.
Abramos este archivo y agreguemos al
principio una nueva clase beauty con estos
estilos:
.beauty {
box-shadow: rgba(50, 50, 50, 0.2) 0 5px 5px 0;
font-weight: bold;
cursor: pointer;
}
Apliquémoslo para estilizar los botones.
Para ello, abramos Buttons.module.css y
hagamos cambios en la clase common-btn.
Agregaremos una línea con el comando composes,
donde especificaremos el nombre de la clase beauty,
que queremos aplicar y el archivo
App.module.css, donde se encuentra
esta clase:
.common-btn {
composes: beauty from "../App.module.css";
font-size: 16px;
border-radius: 3px;
}
Tome el código de su aplicación de la tarea de la lección anterior y haga alguna sombra a sus inputs usando el método dado en esta lección.
