how can i get styles for mapped object elements?

If you are using CSS modules you have to import the file like so:

import styles from "./Village.module.css";

Then you have to actually use your classnames from your css file so:

<Card.Header className={styles[className] } ><h5>{label}</h5></Card.Header>

styles[className] is using the className from your array and tries to find it in your .module.css file. Make sure in your .module.css file you have the 3 classes defined e.g.:

.Private{
    color: red;
}
.Public{
    color: green;
}
.Academia{
    color: blue;
}

Then it works here at my project.

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top