EuiTextAlign and EuiTextFontFamily components

[snide]

Two new components for text manipulation. Similar to EuiTextColor these props can also be passed directly onto EuiText itself for an all in one solution.

[cjcenizal]

Looks good. How about we combine these two components into a single EuiTextFontFormat component, which has fontFamily and align props? This seems like it will be a bit easier to consume and scale.

[uboness]

Looks good. How about we combine these two components into a single EuiTextFontFormat component, which has fontFamily and align props? This seems like it will be a bit easier to consume and scale.

or... EuiTextFormat that will take care of anything text formatting that we'd like to expose... so we can scale with it in the future as well (if more formatting needs will come up)

[snide]

@cjcenizal @uboness EuiText already is that all in one consumer (which accepts props for color, textAlign and fontFamily, and I think would be applicable for the majority of usages (aka: places with a single line of text) you would need.

Example:

<EuiText fontFamily="code" color="danger" textAlign="right">
  <p>Hey, I'm some red monospaced text on the right side</p>
</EuiText>

We still need a separate component (either separate or an all in one component) for situations where you need to nest styling.

<EuiText>
  <EuiTextAlign textAlign="center">
    <h3>I'm a centered title</h3>
  </EuiTextAlign>
  <EuiTextColor color="danger">
    <p>Hello, I'm red!</p>
  </EuiTextColor>
</EuiText>

I'm not opposed to wrapping color, family and alignment into an EuiTextStyle component if that's what we want so it would be something like this instead...

<EuiText>
  <EuiTextStyle textAlign="center">
    <h3>I'm a centered title</h3>
  </EuiTextStyle>
  <EuiTextStyle color="danger">
    <p>Hello, I'm red!</p>
  </EuiTextStyle>
</EuiText>

Lemme know if that works more with what you're thinking and I'll adjust the PR.

[snide]

@cjcenizal and I chatted about this one quickly and decided to go with the last example making all text style related concerns under a single component separate from EuiText which handles formatting. I'll refactor and get this PR back up to speed.

<EuiText>
  <EuiTextStyle textAlign="center">
    <h3>I'm a centered title</h3>
  </EuiTextStyle>
  <EuiTextStyle color="danger">
    <p>Hello, I'm red!</p>
  </EuiTextStyle>
</EuiText>

[snide]

Closing in favor of #683