I've created a icon.js file. It exports 3 SVG components to different files. Like this :
export const MenuIcon = () => {
return (
<svg>
...
</svg>
);
};
export const ArrowLeftIcon = () => {
return (
<svg>
...
</svg>
);
};
export const SearchIcon = () => {
return (
<svg>
...
</svg>
);
};
And I would like to apply the same styles to all three of these components using styled components, not giving them a same className. Is there a solution for that? Thank you :)
I think the following steps could help you.
const StyledSvg = styled.svg` <---the html tag that you want to style
color: palevioletred; <---the css styles that you want to use
`;
return(
<StyledSvg>
...
</StyledSvg>
);
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments