diff --git a/.changeset/calm-dolphins-shave.md b/.changeset/calm-dolphins-shave.md new file mode 100644 index 0000000..23138fa --- /dev/null +++ b/.changeset/calm-dolphins-shave.md @@ -0,0 +1,5 @@ +--- +'@sopt-makers/ui': patch +--- + +Chip에 disabled 스타일 적용 diff --git a/packages/ui/Chip/style.css.ts b/packages/ui/Chip/style.css.ts index ec328f1..42cb494 100644 --- a/packages/ui/Chip/style.css.ts +++ b/packages/ui/Chip/style.css.ts @@ -10,16 +10,16 @@ const active = { }; export const root = style({ - display: 'flex', - justifyContent: 'center', - alignItems: 'center', - gap: 4, - boxShadow: `0 0 0 1px ${theme.colors.gray700} inset`, - borderRadius: 9999, - color: theme.colors.gray300, - backgroundColor: theme.colors.gray800, - cursor: 'pointer', - borderStyle: 'none', + 'display': 'flex', + 'justifyContent': 'center', + 'alignItems': 'center', + 'gap': 4, + 'boxShadow': `0 0 0 1px ${theme.colors.gray700} inset`, + 'borderRadius': 9999, + 'color': theme.colors.gray300, + 'backgroundColor': theme.colors.gray800, + 'cursor': 'pointer', + 'borderStyle': 'none', ':hover': { color: theme.colors.white, @@ -27,6 +27,10 @@ export const root = style({ }, ':active': active, + + ':disabled': { + pointerEvents: 'none', + }, }); export const activeStyle = style(active);