Issue 372 - Icon color not updating with theme color

[igloo12]

Addresses Issue #372

• Breaking change? (if so, please describe the impact and migration path for existing application instances)

What changes did you make? (Give an overview)
Updated the icon svgs to use the theme
Is there anything you'd like reviewers to focus on?

How Has This Been Tested? (put an "x" (case-sensitive!) next to an item)

• No need to
• Manually (please, describe, if necessary)
• Unit checks
• Integration checks
• Covered by existing automation

Checklist (put an "x" (case-sensitive!) next to all the items, otherwise the build will fail)

• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation (e.g. ENVIRONMENT VARIABLES)
• My changes generate no new warnings (e.g. Sonar is happy)
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• Any dependent changes have been merged

Check out Contributing and Code of Conduct

A picture of a cute animal (not mandatory but encouraged)

[github-actions]

Hi igloo12! 👋

Welcome, and thank you for opening your first PR in the repo!

Please wait for triaging by our maintainers.

Please take a look at our contributing guide.

[Nilumilak]

I think it would be better to connect global theme to the colors instead of making the svg transparent

[igloo12]

I think it would be better to connect global theme to the colors instead of making the svg transparent

Isn't that what the styled() method does? I copied it from the edit icon. The styled() sets the fill color of the svg.

[Nilumilak]

I think it would be better to connect global theme to the colors instead of making the svg transparent

Isn't that what the styled() method does? I copied it from the edit icon. The styled() sets the fill color of the svg.

edit icon uses the global theme for filling the svg

fill={theme.icons.editIcon.normal}

[igloo12]

I think it would be better to connect global theme to the colors instead of making the svg transparent

Isn't that what the styled() method does? I copied it from the edit icon. The styled() sets the fill color of the svg.

edit icon uses the global theme for filling the svg

fill={theme.icons.editIcon.normal}

I saw this, but I think it is being overwritten here in Button.styled.ts

  & svg {
    margin-right: 4px;
    fill: ${({ theme, disabled, buttonType }) =>
      disabled
        ? theme.button[buttonType].color.disabled
        : theme.button[buttonType].color.normal};
  }

Setting it to red has no effect.

[Haarolean]

What's happening here, why is the shape changed?

[Haarolean]

the color should be different for two themes, how is this supposed to work after the changes you've introduced?

[kapybro]

Further user feedback is requested. Please reply within 7 days or we might close the issue.

[kapybro]

No feedback received within 7 days. Auto closing.