fix: 프로필 수정 필드 테두리 제거#608
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
1 Skipped Deployment
|
Walkthrough
Estimated code review effort: 1 (Trivial) | ~3 minutes Suggested reviewers: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 82ee0c7db0
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| className={clsx( | ||
| "w-full rounded-lg border p-3 pr-12 text-primary placeholder:text-primary-200 focus:border-primary focus:outline-none", | ||
| error ? "border-red-500" : "border-gray-300", | ||
| "w-full rounded-lg bg-k-50 p-3 pr-12 text-primary placeholder:text-primary-200 focus:outline-none", |
There was a problem hiding this comment.
When the nickname field has no validation error, this removes the only focus affordance: the default border is gone and focus:outline-none suppresses the browser outline without adding a replacement focus-visible ring/border. Keyboard users on the profile edit screen will not be able to see that the text input is focused unless it is already in the error state.
Useful? React with 👍 / 👎.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/web/src/app/my/modify/_ui/ModifyContent/_ui/InputFiled/index.tsx`:
- Around line 30-31: Update the input field class list in ModifyContent’s
InputFiled component to add a keyboard-visible focus indicator using
focus-visible:ring-* or focus-visible:outline-*, while preserving the existing
styling and focus:outline-none behavior.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: b0574094-6494-4116-9101-9366e3927261
📒 Files selected for processing (2)
apps/web/src/app/my/modify/_ui/ModifyContent/_ui/InputFiled/index.tsxapps/web/src/app/my/modify/_ui/ModifyContent/_ui/ReadOnlyField/index.tsx
| "w-full rounded-lg bg-k-50 p-3 pr-12 text-primary placeholder:text-primary-200 focus:outline-none", | ||
| error && "border border-red-500", |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟠 Major | ⚡ Quick win
🧩 Analysis chain
🏁 Script executed:
sed -n '1,120p' apps/web/src/app/my/modify/_ui/ModifyContent/_ui/InputFiled/index.tsxRepository: solid-connection/solid-connect-web
Length of output: 1500
1. 포커스 표시를 추가해주세요.
focus:outline-none으로 기본 포커스 표시를 없앴는데 대체 focus-visible:ring-* 또는 focus-visible:outline-*가 없어 키보드 사용자가 현재 입력 필드를 놓치기 쉽습니다. 기본 디자인은 유지하되 포커스 상태만 명확히 보여주세요.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@apps/web/src/app/my/modify/_ui/ModifyContent/_ui/InputFiled/index.tsx` around
lines 30 - 31, Update the input field class list in ModifyContent’s InputFiled
component to add a keyboard-visible focus indicator using focus-visible:ring-*
or focus-visible:outline-*, while preserving the existing styling and
focus:outline-none behavior.
1 participant
작업 내용
k-50배경을 유지하고, 입력 오류 시 빨간 테두리는 유지했습니다.검증
pnpm --filter @solid-connect/web run ci:checkpnpm --filter @solid-connect/web run build참고
e3658b63을 최신main위에 단독 체리픽했습니다.main대비 커밋 1개, 관련 파일 2개만 포함합니다.