|
|
|
|
|
function getClassName(genre) { |
|
const classMap = { |
|
"children": "children-color", |
|
"fantasy": "fantasy-color", |
|
"history_biography": "history_biography-color", |
|
"graphic_comics": "comics-color", |
|
"romance": "romance-color", |
|
"poetry": "poetry-color", |
|
"ya": "YA-color", |
|
"crime": "crime-color" |
|
}; |
|
return classMap[genre.toLowerCase().trim()] || "default_color"; |
|
} |
|
|
|
|
|
export const GenreTag = (props) => { |
|
return ( |
|
<div className={getClassName(props.genre) + " book-card__info-section__genre-section-container" + " flex-center"}> |
|
<span className='book-card__info-section__genre-section-conteiner-text'>#{props.genre}</span> |
|
</div> |
|
) |
|
} |