Как импортировать оформленную стилями компонент-кнопку и применить к ней дополнительные стили в React?

Есть общий компонет - кнопка со своими стилями. По задумке будет использоваться много раз в разных частях сайта. Стили кнопки включают в себя, естественно, лишь визуальные вещи.

Как мне сделать к ней, например, float: left, в месте куда вставляю?

Например, я вставляю эту кнопку в каком либо компоненте, импортируя её:

<Button className={style.myButton} buttonText='Нажми меня' />

...И последующее применение стилей классу myButton не работают.

Как решить проблему?


Ответы (1 шт):

Автор решения: Денис Беспалов

Проблему решил с помощью препроцессора Sass. Убрал импорт компонента. Создал обычную кнопку и присвоил класс myButton. Создал миксин со стилями кнопки и импортирую этот миксин в class myButton и везде, где нужна кнопка именно с таким оформлением.

→ Ссылка