Делаю карточку. Вот это компонент
import React from "react";
import styles from "./searchCard.module.scss";
import Textfield from "../../Textfield/Textfield";
import SubmitButton from "../../Button/Submit/SubmitButton";
const SearchCard = () => {
return (
<div className={styles.card__wrapper}>
<h1 className={styles.card__title}>Найдём номера под ваши пожелания</h1>
<form сlassName={styles.card__form}>
<Textfield role='dropdown' size='sm' placeholder='ДД.ММ.ГГГГ' />
<Textfield role='dropdown' size='sm' placeholder='ДД.ММ.ГГГГ' />
<Textfield role='dropdown' size='lg' placeholder='Сколько гостей' />
<SubmitButton
size='Xlarge'
selector='contained'
text='Подобрать номер'
/>
</form>
</div>
);
};
export default SearchCard;
В итоге вижу, что стили к элементу FORM не применились, ко всем остальным применяются.
Вот что я вижу в ChromeDevtools
Вопрос? Почему там classname когда у всех остальных элементов нормальные классы?