Refactor svgFill to pass a custom color

[chrisvanmook]

The svgFill method should be refactored to accept a color code only. Also note that the color prop for the Icon component will have to start using this method.

See discussion in #574

[jasperswart]

I will pick this up

[robinpiets]

Maybe we can also change this in the Paragraph component? It has a similar issue.

[jonkoops]

@robinpiets Could you give an example?

[robinpiets]

Now Paragraph uses TypographyStyle, and color is defined like this:

${({ color }) =>
    color &&
    css`
      color: ${themeColor(color)};
    `}

We can change this to pass a string, so we can use it like this:
<Paragraph color={themeColor("tint", "level3")}>...
or
<Paragraph color="#bbb">...

[jonkoops]

Makes sense, I'd like to see that as well. Although I wonder why this prop exists in the first place since it's just a text element. Should we remove it instead?

[robinpiets]

Yeah, it's a strange prop. Shall I make a new PR to change it into this:

${({ color }) =>
  color &&
  css`
      color: ${color};
  `}

[jonkoops]

Sounds good, but let's deprecate the property at the same time. People should just style it in the color they need using styled(Paragraph).

[robinpiets]

I will fix the Paragraph color prop in a separate PR