Reaktda CSS modullary üçin faýllar üçin compses buýrugy

composes buýrugyny bir faýldaky stilleri beýleki faýlda gaýtadan ulanmak üçin hem ulanyp bolýar.

Öňki sapaklarda ýasan buttons programmamyza dolanalym. Diňeýle, biz ähli düwmälere deň kölege, kursoryň görnüşini we ýogyn şrifti goşmak isleýäris. Bu stilleri App.module.css faýlynda ýerleşdirýändigimizi hasap edeliň. Geliň bu faýly açalyň we başyna bu stiller bilen täze beauty klasyny goşalyň:

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

Geliň ony düwmeleri bezemek üçin ulanalýň. Bunun üçin Buttons.module.css faýlyny açalyň we common-btn klasyna üýtgeşmeler girizeliň. Biz composes buýrugy bilen setir goşarys, ýerde biz ulanmak isleýän beauty klassyň adyndan we bu klassyň ýerleşýän App.module.css faýlyndan gelýändigini görkezeris:

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