Ребята, сердечко это svg которое я экспортрую в реакте: import

Question

Ребята, сердечко это svg которое я экспортрую в реакте: import

likeSVG from '../assets/heart.svg'; а затем вот так вставляю: <img className='postItem__like-svg' src={likeSVG} alt="" />. Нужно в общем сделать сердечко серым через css вроде не получается. Как красивенько сделать сохраняя деструктуризацию?

#frontend #javascript #programming #react.js #russian

0

04.03.2022

18 ответов

29 просмотров

Vasyl Vasyliev

в коде SVG прописать color=currentColor

0

04.03.2022

21th Автор вопроса

ну такое себе, не работает, мне потом ещё надо будет менять цвет сердца

0

04.03.2022

Vasyl Vasyliev

21th
ну такое себе, не работает, мне потом ещё надо буд...

там где color="green" поставить color="currentColor". Тогда цвет будет наследоваться из css и не надо будет писать дикие селекторы типа .heart svg path{fill:...; stroke:...} Будет элегантно .heart{color:red;}

0

04.03.2022

21th Автор вопроса

Vasyl Vasyliev
там где color="green" поставить color="currentColo...

я вообще вставляю svg вот так: <img className='postItem__like-svg' src={likeSVG} alt="" />. На сколько я понял лучше сделать компонент возвращающий svg?

0

04.03.2022

Vasyl Vasyliev

21th
я вообще вставляю svg вот так: <img className='pos...

В идеале - создать спрайт, куда засунуть этот svg как symbol, а потом создать компонент, вытягивающий нужную картинку из спрайта через <use href="#symbolId">

0

04.03.2022

21th Автор вопроса

Vasyl Vasyliev
В идеале - создать спрайт, куда засунуть этот svg ...

да похуй, уже компонент сделал, всё нормально работает

0

04.03.2022

Евгений 🎃

Хороший стол, кстати.

0

04.03.2022

Иван Музыка

Крутой стол

0

04.03.2022

Justy

Как иронично const Heart = () => { return ( <svg... ) } а потом в стилях можнно будет в svg обращаться только отформатировать надо, что бы под стиль реакта было, а то не заработает

0

04.03.2022

ᅠOrest

img svg { fill: #fff; }

0

04.03.2022

21th Автор вопроса

Justy
Как иронично const Heart = () => { return ( ...

да, я так же сделал

0

04.03.2022

Anton

Через css можно, вот так например, если очень нужно: filter: invert(57%) sepia(6%) saturate(11%) hue-rotate(352deg) brightness(92%) contrast(87%); Будет серая)

0

04.03.2022

kkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk

Что это за милашка из Самары

0

04.03.2022

Китикет Базёнка

тебе 5 минут вернуть?

0

04.03.2022

21th Автор вопроса

Китикет Базёнка
тебе 5 минут вернуть?