Kommandot composes för filer i CSS modules i React

Kommandot composes kan även användas för återanvändning av stilar från en fil i en annan.

Låt oss återgå till applikationen buttons, som vi gjorde i tidigare lektioner. Antag att vi vill lägga till samma skuggor, markörstil och fetstil för alla knappar. Låt dessa stilar vara placerade i filen App.module.css. Låt oss öppna den här filen och lägga till en ny klass beauty i början med dessa stilar:

.beauty { 
	box-shadow: rgba(50, 50, 50, 0.2) 0 5px 5px 0;
	font-weight: bold;
	cursor: pointer;
}

Låt oss använda den för att styla knapparna. För att göra detta, öppna Buttons.module.css och gör ändringar i klassen common-btn. Vi kommer att lägga till en rad med kommandot composes, där vi anger klassnamnet beauty, som vi vill använda, och filen App.module.css, där denna klass finns:

.common-btn {
	composes: beauty from "../App.module.css"; 
	font-size: 16px;
	border-radius: 3px;
}

Ta koden från din applikation från uppgiften i förra lektionen och skapa en skugga till dina inmatningsfält genom att använda metoden som beskrivs i denna lektion.