Skip to content

🎨 Palette: λΉ„λ™μž‘ μš”μ†Œμ˜ 툴팁 μ ‘κ·Όμ„± κ°œμ„  #572

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
seonghobae wants to merge 2 commits into from
Closed

🎨 Palette: λΉ„λ™μž‘ μš”μ†Œμ˜ 툴팁 μ ‘κ·Όμ„± κ°œμ„  #572

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
980b882
🎨 Palette: λΉ„λ™μž‘ μš”μ†Œμ˜ 툴팁 μ ‘κ·Όμ„± κ°œμ„ 
seonghobae Aug 20, 2026
6765014
Merge branch 'develop' into palette/tooltip-accessibility-10818403279…
opencode-agent[bot] Aug 20, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions .jules/palette.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,3 +115,6 @@
## $(date +%Y-%m-%d) - Prevent accidental data loss in inline editors
**Learning:** Forms that take a long time to fill out (like a WBS editor) are prone to accidental closure by users pressing `Escape` or clicking cancel. This causes immediate data loss without any warning, resulting in frustration.
**Action:** When working on editors that can be dismissed, track whether the user has modified any fields compared to their initial state. If there are changes, intercept the close action and present a confirmation dialog (`window.confirm`) to ensure they really want to discard their edits. Bypass this for intentional saves or explicit data overrides.
## 2026-08-20 - Make Tooltips on Non-Interactive Elements Accessible
**Learning:** Tooltips (title) on static elements like summary cards are inaccessible to keyboard and screen reader users.
**Action:** When adding tooltips to non-interactive elements, make them focusable with tabindex="0", provide semantic meaning with a role like role="note", and ensure there is a clear :focus-visible style.
6 changes: 3 additions & 3 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,18 +29,18 @@ <h1>ScopeWeave Planner</h1>
<span>기쀀일</span>
<input data-testid="base-date-input" id="base-date" type="date" />
</label>
<div class="meta-value-card" title="ν”„λ‘œμ νŠΈμ˜ μž‘μ—… κΈ°κ°„(일수) ν•©κ³„μž…λ‹ˆλ‹€.">
<div class="meta-value-card" title="ν”„λ‘œμ νŠΈμ˜ μž‘μ—… κΈ°κ°„(일수) ν•©κ³„μž…λ‹ˆλ‹€." tabindex="0" role="note">
<span class="meta-label">μ „μ²΄μΌμˆ˜</span>
<strong data-testid="summary-total-days" id="summary-total-days">0일</strong>
</div>
</div>

<div class="meta-grid meta-grid-secondary">
<div class="meta-value-card accent-card plan-card" title="κΈ°κ°„(일수) κ°€μ€‘μΉ˜κ°€ 반영된 ν”„λ‘œμ νŠΈ 전체 κ³„νš 진척λ₯ μž…λ‹ˆλ‹€.">
<div class="meta-value-card accent-card plan-card" title="κΈ°κ°„(일수) κ°€μ€‘μΉ˜κ°€ 반영된 ν”„λ‘œμ νŠΈ 전체 κ³„νš 진척λ₯ μž…λ‹ˆλ‹€." tabindex="0" role="note">
<span class="meta-label">κ³„νšμ§„μ²™λ₯ (λˆ„μ )</span>
<strong data-testid="summary-planned-progress" id="summary-planned-progress">0.00%</strong>
</div>
<div class="meta-value-card accent-card actual-card" title="κΈ°κ°„(일수) κ°€μ€‘μΉ˜κ°€ 반영된 ν”„λ‘œμ νŠΈ 전체 싀적 진척λ₯ μž…λ‹ˆλ‹€.">
<div class="meta-value-card accent-card actual-card" title="κΈ°κ°„(일수) κ°€μ€‘μΉ˜κ°€ 반영된 ν”„λ‘œμ νŠΈ 전체 싀적 진척λ₯ μž…λ‹ˆλ‹€." tabindex="0" role="note">
<span class="meta-label">싀적진척λ₯ (λˆ„μ )</span>
<strong data-testid="summary-actual-progress" id="summary-actual-progress">0.00%</strong>
</div>
Expand Down
34 changes: 34 additions & 0 deletions patch.diff
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
--- index.html
+++ index.html
@@ -31,7 +31,7 @@
</label>
- <div class="meta-value-card" title="ν”„λ‘œμ νŠΈμ˜ μž‘μ—… κΈ°κ°„(일수) ν•©κ³„μž…λ‹ˆλ‹€.">
+ <div class="meta-value-card" title="ν”„λ‘œμ νŠΈμ˜ μž‘μ—… κΈ°κ°„(일수) ν•©κ³„μž…λ‹ˆλ‹€." tabindex="0" role="note">
<span class="meta-label">μ „μ²΄μΌμˆ˜</span>
<strong data-testid="summary-total-days" id="summary-total-days">0일</strong>
</div>
</div>

<div class="meta-grid meta-grid-secondary">
- <div class="meta-value-card accent-card plan-card" title="κΈ°κ°„(일수) κ°€μ€‘μΉ˜κ°€ 반영된 ν”„λ‘œμ νŠΈ 전체 κ³„νš 진척λ₯ μž…λ‹ˆλ‹€.">
+ <div class="meta-value-card accent-card plan-card" title="κΈ°κ°„(일수) κ°€μ€‘μΉ˜κ°€ 반영된 ν”„λ‘œμ νŠΈ 전체 κ³„νš 진척λ₯ μž…λ‹ˆλ‹€." tabindex="0" role="note">
<span class="meta-label">κ³„νšμ§„μ²™λ₯ (λˆ„μ )</span>
<strong data-testid="summary-planned-progress" id="summary-planned-progress">0.00%</strong>
</div>
- <div class="meta-value-card accent-card actual-card" title="κΈ°κ°„(일수) κ°€μ€‘μΉ˜κ°€ 반영된 ν”„λ‘œμ νŠΈ 전체 싀적 진척λ₯ μž…λ‹ˆλ‹€.">
+ <div class="meta-value-card accent-card actual-card" title="κΈ°κ°„(일수) κ°€μ€‘μΉ˜κ°€ 반영된 ν”„λ‘œμ νŠΈ 전체 싀적 진척λ₯ μž…λ‹ˆλ‹€." tabindex="0" role="note">
<span class="meta-label">싀적진척λ₯ (λˆ„μ )</span>
<strong data-testid="summary-actual-progress" id="summary-actual-progress">0.00%</strong>
</div>
--- styles.css
+++ styles.css
@@ -361,7 +361,8 @@
.secondary-button:focus-visible,
input:focus-visible,
select:focus-visible,
-.gantt-bar:focus-visible {
+.gantt-bar:focus-visible,
+.meta-value-card:focus-visible {
outline: 3px solid rgba(37, 99, 235, 0.5);
outline-offset: 2px;
}
Comment on lines +1 to +34

@devin-ai-integration devin-ai-integration Bot Aug 20, 2026

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟑 Raw patch file committed into the repository

A raw diff file (patch.diff at patch.diff:1-34) describing this PR's own edits was accidentally committed alongside the real source changes, so the repo now tracks a throwaway patch script instead of just the edited files.
Impact: The repository ships a stray patch file that adds noise and can go stale, misleading anyone who reads it as if it were meaningful source.

Anti-pattern flagged in .jules/palette.md

patch.diff contains the unified diff that was applied to index.html and styles.css to produce this change. The accumulated learning in .jules/palette.md (2026-06-21 "Avoid indirect string replacements") explicitly states that using separate patch/script files to mutate source is an anti-pattern and that source files should be modified directly. This artifact should be deleted from the PR.

Prompt for agents 
The file patch.diff is the raw unified diff used to apply this PR's edits to index.html and styles.css. It is a leftover artifact and should not be committed (see .jules/palette.md 2026-06-21 'Avoid indirect string replacements'). Remove patch.diff from the PR.
Open in Devin Review

Was this helpful? React with πŸ‘ or πŸ‘Ž to provide feedback.

3 changes: 2 additions & 1 deletion styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -360,7 +360,8 @@ button {
.secondary-button:focus-visible,
input:focus-visible,
select:focus-visible,
.gantt-bar:focus-visible {
.gantt-bar:focus-visible,
.meta-value-card:focus-visible {
outline: 3px solid rgba(37, 99, 235, 0.5);
outline-offset: 2px;
}
Expand Down
Loading
Loading