[EuiCallout] Text color is inherited from EuiBottomBar

[pickypg]

While placing an error closest to the relevant buttons, the EuiCallout displaying the error was practically unreadable in dark mode:

This is impacting EUI version 34.0.0 (and earlier; we're on 32.0.4): https://codesandbox.io/s/wonderful-cloud-s3q62?file=/index.js

For anyone running into this issue, it can be worked around:

<EuiTextColor color="default"><p>...</p></EuiTextColor>

[cchaos]

👋 Thanks for the find @pickypg. I think the solution here is to add the color="default" prop to the EuiText wrapper of the children. This will is also the best way to ensure proper contrast in case the callout is placed in any other container with a specific text color.

Relevant code:

eui/src/components/call_out/call_out.tsx

Lines 93 to 97 in 47b4e0c

	if (children && size === 's') {
	optionalChildren = <EuiText size="xs">{children}</EuiText>;
	} else if (children) {
	optionalChildren = <EuiText size="s">{children}</EuiText>;
	}