Improve Boolean control focus state

2025-04-04 12:21:05 +08:00 · 2020-06-22 19:52:09 -04:00 · 2020-06-22 19:52:09 -04:00 · 9f8fa39e28
commit 9f8fa39e28
parent 34964488b0
1 changed files with 8 additions and 0 deletions
--- a/lib/components/src/controls/Boolean.tsx
+++ b/lib/components/src/controls/Boolean.tsx
@ -24,6 +24,14 @@ const Label = styled.label(({ theme }) => ({
    border: 'none',
    background: 'transparent',
    cursor: 'pointer',
+
+    '&:focus': {
+      outline: 'none',
+
+      '& ~ span': {
+        boxShadow: `${theme.color.secondary} 0 0 0 1px inset !important`,
+      },
+    },
  },

  span: {