clipboard-landing-page-master

Community feedback

• 

  Antoine C•1,210

  @mattari97Posted over 2 years ago

  Hi Oduh Precious. Congratulations on completing this challenge.

  To change the color of an svg using classes, you need to remove the hardcoded colors in the .svg file and replace it with "currentColor". This way you can manage the color of the svg with the CSS color property like it was text.

  Hope this is helpfull. Have a good day/night. Peace ✌️

  1
• 

  oduh precious•170

  @preciousoduhPosted over 2 years ago

  Oh I see thank youuu. Please how do I remove the hard coded color?

  0

  ---

  

  Antoine C•1,210

  @mattari97Posted over 2 years ago

  @themusssee hey, open your editor (vscode, sublime text, atom, etc...) then navigate to you project and open the .svg file in there. You will see that it is just some text and more precisely an html component.

  Search for colors in this text ; they look like this #333333 and change them to currentColor.

  Hope it helps.

  Peace

  Marked as helpful

  0

  

  oduh precious•170

  @preciousoduhPosted over 2 years ago

  @AntoineC-dev okay thank you very much!!!! Hope you have a great day/night

  1

  

  Antoine C•1,210

  @mattari97Posted over 2 years ago

  @themusssee no problem.

  I forgot to mention that for this solution to work you need to replace the <img src="my-svg.svg" /> with the svg itself (the text i talked about in the previous comment). This is called using an inline svg in your html.

  0
• 

  oduh precious•170

  @preciousoduhPosted over 2 years ago

  Oh thank you very much, hope you have a good day/night

  0
• 

  Martin•240

  @TheMrBombasticPosted over 2 years ago

  You can use background-color on pictures, but to see this they have to be transparent. Or you can chane the image, css does this with a background image command:

  .svg{
  width: 200px;
  height: 100px; (your picture dimensions)
  backgroundpicture: url(images/image1.svg);}
  
  .svg:hover{
  backgroundpicture: url(images/image2.svg)}
  

  this should work:)

  0