Move poke__type css class into PokemonCard component

develop
Jason Zhu 2023-05-07 15:50:47 +10:00
parent b56eae4e40
commit 5068a6f728
2 changed files with 6 additions and 4 deletions

View File

@ -54,8 +54,8 @@ export interface PokemonTypesProps {
const PokemonTypes = ({ types }: PokemonTypesProps) => { const PokemonTypes = ({ types }: PokemonTypesProps) => {
return ( return (
// TODO: fix static typed poke__type css // css is set in consumer
<div className="poke__type"> <>
{types.map(type => ( {types.map(type => (
<Tooltip title={type} key={type} TransitionComponent={Zoom} arrow> <Tooltip title={type} key={type} TransitionComponent={Zoom} arrow>
<div className={`poke__type__bg ${type}`}> <div className={`poke__type__bg ${type}`}>
@ -63,7 +63,7 @@ const PokemonTypes = ({ types }: PokemonTypesProps) => {
</div> </div>
</Tooltip> </Tooltip>
))} ))}
</div> </>
); );
}; };

View File

@ -67,7 +67,9 @@ export default function PokemonCard({
</div> </div>
<div className="poke__name"> <div className="poke__name">
<h3>{name}</h3> <h3>{name}</h3>
<PokemonTypes types={types} /> <div className="poke__type">
<PokemonTypes types={types} />
</div>
</div> </div>
</div> </div>
); );