@luxurypluxury

Почему не работает fill на иконке?

Не работает fill на двух иконках с трех, третья норм работает.
Вот как я меняю fill:
svg {
        path {
            fill: $secondary;
        }
    }


Вот иконка которая не меняется:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<mask id="mask0_801_5685" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="4" y="14" width="16" height="8">
<path fill-rule="evenodd" clip-rule="evenodd" d="M4 14.4961H19.8399V21.8701H4V14.4961Z" fill="#FFFFFF"/>
</mask>
<g mask="url(#mask0_801_5685)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.9209 15.9961C7.65988 15.9961 5.49988 16.7281 5.49988 18.1731C5.49988 19.6311 7.65988 20.3701 11.9209 20.3701C16.1809 20.3701 18.3399 19.6381 18.3399 18.1931C18.3399 16.7351 16.1809 15.9961 11.9209 15.9961ZM11.9209 21.8701C9.96188 21.8701 3.99988 21.8701 3.99988 18.1731C3.99988 14.8771 8.52088 14.4961 11.9209 14.4961C13.8799 14.4961 19.8399 14.4961 19.8399 18.1931C19.8399 21.4891 15.3199 21.8701 11.9209 21.8701Z" fill="#404156"/>
</g>
<mask id="mask1_801_5685" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="6" y="2" width="12" height="11">
<path fill-rule="evenodd" clip-rule="evenodd" d="M6.60986 2.00012H17.2299V12.6187H6.60986V2.00012Z" fill="#FFFFFF"/>
</mask>
<g mask="url(#mask1_801_5685)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.9209 3.42769C9.77989 3.42769 8.03789 5.16869 8.03789 7.30969C8.03089 9.4437 9.75989 11.1837 11.8919 11.1917L11.9209 11.9057V11.1917C14.0609 11.1917 15.8019 9.44969 15.8019 7.30969C15.8019 5.16869 14.0609 3.42769 11.9209 3.42769ZM11.9209 12.6187H11.8889C8.9669 12.6097 6.59989 10.2267 6.60989 7.30669C6.60989 4.3817 8.99189 1.99969 11.9209 1.99969C14.8489 1.99969 17.2299 4.38169 17.2299 7.30969C17.2299 10.2377 14.8489 12.6187 11.9209 12.6187Z" fill="#404156"/>
</g>
</svg>


Вот которая меняется:
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_961_12179)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M11 14.4375C12.8985 14.4375 14.4375 12.8985 14.4375 11C14.4375 9.10152 12.8985 7.5625 11 7.5625C9.10152 7.5625 7.5625 9.10152 7.5625 11C7.5625 12.8985 9.10152 14.4375 11 14.4375ZM11 16.5C14.0376 16.5 16.5 14.0376 16.5 11C16.5 7.96243 14.0376 5.5 11 5.5C7.96243 5.5 5.5 7.96243 5.5 11C5.5 14.0376 7.96243 16.5 11 16.5Z" fill="#24292E"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M11 0C11.5695 0 12.0312 0.461706 12.0312 1.03125V3.09375C12.0312 3.66329 11.5695 4.125 11 4.125C10.4305 4.125 9.96875 3.66329 9.96875 3.09375V1.03125C9.96875 0.461706 10.4305 0 11 0ZM11 17.875C11.5695 17.875 12.0312 18.3367 12.0312 18.9062V20.9688C12.0312 21.5383 11.5695 22 11 22C10.4305 22 9.96875 21.5383 9.96875 20.9688V18.9062C9.96875 18.3367 10.4305 17.875 11 17.875Z" fill="#24292E"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M3.22203 3.22203C3.62475 2.8193 4.2777 2.8193 4.68043 3.22203L6.13884 4.68043C6.54157 5.08316 6.54157 5.73611 6.13884 6.13884C5.73611 6.54157 5.08316 6.54157 4.68043 6.13884L3.22203 4.68043C2.8193 4.2777 2.8193 3.62475 3.22203 3.22203ZM15.8616 15.8616C16.2643 15.4588 16.9172 15.4588 17.32 15.8616L18.7784 17.32C19.1811 17.7227 19.1811 18.3756 18.7784 18.7784C18.3756 19.1811 17.7227 19.1811 17.32 18.7784L15.8616 17.32C15.4588 16.9172 15.4588 16.2643 15.8616 15.8616Z" fill="#24292E"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M22 11C22 11.5695 21.5383 12.0313 20.9688 12.0312H18.9062C18.3367 12.0312 17.875 11.5695 17.875 11C17.875 10.4305 18.3367 9.96875 18.9062 9.96875H20.9688C21.5383 9.96875 22 10.4305 22 11ZM4.125 11C4.125 11.5695 3.66329 12.0312 3.09375 12.0312H1.03125C0.461707 12.0312 -2.48955e-08 11.5695 0 11C2.48955e-08 10.4305 0.461707 9.96875 1.03125 9.96875H3.09375C3.66329 9.96875 4.125 10.4305 4.125 11Z" fill="#24292E"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M18.778 3.22203C19.1807 3.62475 19.1807 4.2777 18.778 4.68043L17.3196 6.13884C16.9168 6.54157 16.2639 6.54157 15.8612 6.13884C15.4584 5.73611 15.4584 5.08316 15.8612 4.68043L17.3196 3.22203C17.7223 2.8193 18.3752 2.8193 18.778 3.22203ZM6.13844 15.8616C6.54117 16.2643 6.54117 16.9172 6.13844 17.32L4.68003 18.7784C4.27731 19.1811 3.62435 19.1811 3.22163 18.7784C2.8189 18.3756 2.8189 17.7227 3.22163 17.32L4.68003 15.8616C5.08276 15.4588 5.73571 15.4588 6.13844 15.8616Z" fill="#24292E"/>
</g>
<defs>
<clipPath id="clip0_961_12179">
<rect width="22" height="22" fill="white"/>
</clipPath>
</defs>
</svg>
  • Вопрос задан
  • 146 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы