передача реквизитов как classNames в next.js

Я пытаюсь изменить цвет заголовка каждой страницы моего приложения в зависимости от текущей страницы. Как я пытаюсь этого добиться:

<Header className="headerBitcoin"></Header>

Я хочу, чтобы компонент заголовка присутствовал на всех 4 страницах, а затем просто изменил className на другую опору, чтобы изменить фон, но не что-либо еще.
И сам компонент заголовка

import styles from "../../styles/Home.module.css";
export default function Header(props) {
  return (
    <div >
      <div className={props.className}>aaaaa</div>
      <div className={styles.row}>
        <div className={styles.tab}>a</div>
        <div className={styles.tab}>a</div>
        <div className={styles.tab}>a</div>
        <div className={styles.tab}>a</div>
      </div>{" "}
    </div>
  );
}

В настоящий момент стили для вкладок и строки работают, но стиль заголовка не применяется.
Я проверил консоль и обнаружил, что заголовок получает имя класса headerBitcoin, переданное ему, однако строка под ним имеет имя класса "Home_row__88lPM"
Я впервые работаю с next.js, и я знаю, что я делаю что-то не так, потому что это работает в React. Любая помощь будет оценена.

Где у вас определены ваши headerBitcoin стили?   —  person imstupidpleasehelp    schedule 27.02.2021

У меня они были в моем modules.css, я понял свою ошибку и поместил css в свой глобальный css, теперь он работает. Пожалуйста, превратите свой комментарий в ответ, я дам вам репутацию, которую вы за это заслуживаете.   —  person imstupidpleasehelp    schedule 27.02.2021