fix(formcontrol): fixed form control select dark theme icon

[evwilkin]

Closes #5215

Previously we were hard coding the incorrect icon in for --pf-c-form-control__select--BackgroundUrl in dark theme, but the icon does not change - only the color needs to change. This PR uses the same pf-bg-svg SASS function in dark theme but passes in the third argument ($svg-color) to override the color.

Note: The color looks correct now, but I'm unclear of if there's a better variable to use (or new one to create) for this usage.

[patternfly-build]

Preview: https://patternfly-pr-5242.surge.sh

A11y report: https://patternfly-pr-5242-a11y.surge.sh

[mcoker]

Looks perfect to me! FWIW, this is what creates that background.

patternfly/src/patternfly/sass-utilities/functions.scss

Lines 18 to 22 in 5eee883

	@function pf-bg-svg($svg-coordinates, $viewBox: "512", $svg-color: "currentColor") {
	$color: str-slice(#{$svg-color}, 2);
	@return url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 #{$viewBox} 512'%3E%3Cpath fill='%23#{$color}' d='#{$svg-coordinates}'/%3E%3C/svg%3E");
	}

It's set to try and use currentColor (whatever the text color is) by default, but that's not working. currentColor will not work with a background-image as far as I can tell, so that default doesn't make sense. Also we're forcing %23 (#) at the beginning of the fill attribute, so if no color is passed, it creates fill="%23urrentColor 🤦‍♂️ Might be a fun one to try and fix but hopefully we can get away from these background images on form elements entirely.

[patternfly-build]

🎉 This PR is included in version 4.221.3 🎉

The release is available on:

• GitHub release
• npm package (@latest dist-tag)

Your semantic-release bot 📦🚀