Skip to content

Commit 02435d7

Browse files
tsahimatsliahclaude
andcommitted
fix(shared): align checkbox/radio label typography with toggle; trim check size
- Labels now match the redesigned Switch: font-medium, antialiased, typo-footnote, text-secondary at rest → text-primary when selected/hover (radio was font-bold/tertiary; checkbox was tertiary). - Reduce the checkbox check glyph from scale-125 to scale-110. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
1 parent 06a35b0 commit 02435d7

2 files changed

Lines changed: 4 additions & 4 deletions

File tree

packages/shared/src/components/fields/Checkbox.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ export const Checkbox = forwardRef(function Checkbox(
5151
return (
5252
<label
5353
className={classNames(
54-
'relative z-1 inline-flex select-none items-center p-1 pr-3 text-text-tertiary typo-footnote',
54+
'relative z-1 inline-flex select-none items-center p-1 pr-3 font-medium text-text-secondary antialiased typo-footnote',
5555
!disabled && 'cursor-pointer',
5656
styles.label,
5757
className,
@@ -87,7 +87,7 @@ export const Checkbox = forwardRef(function Checkbox(
8787
<VIcon
8888
aria-hidden
8989
secondary
90-
className="icon h-full w-full scale-125 opacity-0"
90+
className="icon h-full w-full scale-110 opacity-0"
9191
role="presentation"
9292
style={{ transition: 'opacity 0.1s linear' }}
9393
/>

packages/shared/src/components/fields/RadioItem.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,8 @@ export function RadioItem<T extends string>({
4646
{ [styles.checked]: checked },
4747
disabled
4848
? '!text-text-disabled'
49-
: 'pointer cursor-pointer text-text-tertiary focus-within:text-text-primary hover:text-text-primary',
50-
'relative flex select-none items-center pr-3 font-bold typo-footnote',
49+
: 'pointer cursor-pointer text-text-secondary focus-within:text-text-primary hover:text-text-primary',
50+
'relative flex select-none items-center pr-3 font-medium antialiased typo-footnote',
5151
reverse ? 'flex-row-reverse' : 'flex-row',
5252
className?.content,
5353
)}

0 commit comments

Comments
 (0)