Skip to content
Submitted over 2 years ago

Interactive comments created with react + styled-components

imNotAli•230
@AliNaderii
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Interactive comments section
  • HTML
  • CSS
  • JS
3intermediate

Design comparison

SolutionDesign

Solution retrospective

Hello everyone :) Can anybody tell me how I should work with SVG icons? I can't figure out how to give them effects, like changing their color on hover. I'd appreciate it if you could help me.

PS: Would be happy to know what you think of my work :)

Community feedback

  • Ali Beyit•60
    @AliDayi97Posted over 2 years ago

    Import them like this example

    import { ReactComponent as DeleteIcon } from "./..";

    And use like typical react component and you can style them by changing fill property via css, it is like this with tailwind css

    <DeleteIcon className="fill-[#ED6368] hover:opacity-50" />
    Marked as helpful
    1
    imNotAli•230
    @AliNaderiiPosted over 2 years ago

    @AliDayi97 Thanks a lot for your help

    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord