Create inset focus ring for clipped components
Problem
Some components are nested within elements that have overflow hidden and the focus ring gets clipped or is barely visible.
Examples
![CleanShot_2020-12-23_at_09.35.29](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
![CleanShot_2020-12-23_at_10.02.18](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Solution
Create an inset focus ring that can be used for these items. In all cases this shouldn’t impact reading text.