Fixed EuiSwitch clicking on disabled label

[sulemanof]

Summary

This fixes the regression of EuiSwitch component:

• The switch is clickable even in disabled state if click on label:

• Label displays under the switch button if there is not enough space:

Found in kibana:

Using flex box it looks better:

Checklist

• Checked in dark mode
• Checked in mobile
• Checked in IE11 and Firefox
• Props have proper autodocs
• Added documentation examples
• Added or updated jest tests
• Checked for breaking changes and labeled appropriately
• Checked for accessibility including keyboard-only and screenreader modes
• A changelog entry exists and is marked appropriately

[elasticmachine]

Since this is a community submitted pull request, a Jenkins build has not been kicked off automatically. Can an Elastic organization member please verify the contents of this patch and then kick off a build manually?

[thompsongl]

Thanks for catching and fixing this, @sulemanof

[thompsongl]

This should remain as inline-block. The display property here hasn't changed recently, and there doesn't appear to be any regressions with layout.

The .euiSwitch__label display property should be inline to match previous word wrapping.

[cchaos]

I noticed there's an issue using the <p> tag when placed inside of an EuiText block and have already started a PR to fix this. I'll fix the wrapping as well in that PR, so we can safely, for now, revert this display change.

[sulemanof]

Well. The display change was reverted

[thompsongl]

Thanks, @sulemanof!

@cchaos has text wrapping adjustments in #2585 that should address the same concerns you had with layout