Comanda composes pentru fișiere în CSS modules în React
Comanda composes poate fi aplicată și pentru
reutilizarea stilurilor dintr-un fișier
în altul.
Să revenim la aplicația buttons,
pe care am făcut-o în lecțiile anterioare.
Să presupunem că vrem să adăugăm tuturor
butoanelor aceleași umbre, stil de cursor
și font îngroșat. Să fie aceste stiluri
plasate în fișierul App.module.css.
Să deschidem acest fișier și să adăugăm la
început o nouă clasă beauty cu aceste
stiluri:
.beauty {
box-shadow: rgba(50, 50, 50, 0.2) 0 5px 5px 0;
font-weight: bold;
cursor: pointer;
}
Să o aplicăm pentru stilizarea butoanelor.
Pentru aceasta să deschidem Buttons.module.css și
să facem modificări în clasa common-btn.
Vom adăuga linia cu comanda composes,
unde vom indica numele clasei beauty,
pe care vrem să o aplicăm și fișierul
App.module.css, în care se află
această clasă:
.common-btn {
composes: beauty from "../App.module.css";
font-size: 16px;
border-radius: 3px;
}
Luați codul aplicației dvs. din sarcina lecției anterioare și faceți o umbră la câmpurile dvs. de introducere utilizând metoda dată în această lecție.