[EuiButtonGroup] Better differentiate the current selection
- Dominant language
- TypeScript
- Stars
- 6.4k
- Forks
- 911
- Avg merge
- 2d 11h
- Merged PRs (30d)
- 65
Description
**Is your feature request related to a problem? Please describe.**
[internal feedback] I cannot tell with confidence which value is actually selected by looking at this unless I click and make the selection. But I just want to know what's selected, not change it.
**Describe the solution you'd like**
Can I suggest to make the selected item have more differentiation, perhaps an outline in addition to darker colouring. (this is one example to highlight).
### Proposed redesign
-----
**Additional context**
This is particularly problematic when only two options are presented (see below):

For reference, we apply margin around the currently active option in the `compressed` version of this input. Perhaps we can apply a similar style to the default size `EuiButtonGroup`, as well.

Contributor guide
Assessment
This issue has not been assessed yet.