diff --git a/src/features/selection-rewrite/popover.tsx b/src/features/selection-rewrite/popover.tsx index 4360a8ce..4fe0c85d 100644 --- a/src/features/selection-rewrite/popover.tsx +++ b/src/features/selection-rewrite/popover.tsx @@ -405,7 +405,7 @@ function SelectionRewritePopoverView({ buttonRef={applyButtonRef} icon="check" label="Apply" - className={`clickable-icon codex-panel-ui__icon-button codex-panel-selection-rewrite__icon-button mod-cta${ + className={`clickable-icon codex-panel-ui__icon-button codex-panel-selection-rewrite__icon-button${ hasReplacement ? "" : " is-hidden" }`} disabled={generating || !hasReplacement} diff --git a/src/styles/10-shared-ui.css b/src/styles/10-shared-ui.css index c07a2afd..88d0a724 100644 --- a/src/styles/10-shared-ui.css +++ b/src/styles/10-shared-ui.css @@ -26,7 +26,7 @@ color: var(--icon-color); font: inherit; line-height: var(--line-height-tight); - cursor: pointer; + cursor: default; user-select: none; } diff --git a/src/styles/20-chat-toolbar.css b/src/styles/20-chat-toolbar.css index 693a329c..9b476f14 100644 --- a/src/styles/20-chat-toolbar.css +++ b/src/styles/20-chat-toolbar.css @@ -68,7 +68,7 @@ font-size: var(--codex-panel-toolbar-text-size); line-height: var(--codex-panel-toolbar-line-height); text-align: left; - cursor: pointer; + cursor: default; user-select: none; } @@ -115,7 +115,7 @@ font-size: var(--codex-panel-toolbar-text-size); line-height: var(--codex-panel-toolbar-line-height); text-align: left; - cursor: pointer; + cursor: default; transform: none; user-select: none; } diff --git a/src/styles/21-chat-status-diagnostics.css b/src/styles/21-chat-status-diagnostics.css index 1adf620b..131c8ce3 100644 --- a/src/styles/21-chat-status-diagnostics.css +++ b/src/styles/21-chat-status-diagnostics.css @@ -1,5 +1,5 @@ .codex-panel__status-dot { - cursor: pointer; + cursor: default; flex: 0 0 auto; margin-left: auto; } @@ -86,7 +86,6 @@ overflow: auto; margin-top: var(--codex-panel-item-gap); padding: var(--codex-panel-item-gap) 0 0; - border-top: var(--codex-panel-divider); background: transparent; } diff --git a/src/styles/22-chat-thread-list.css b/src/styles/22-chat-thread-list.css index b80fae1c..4bf12a6c 100644 --- a/src/styles/22-chat-thread-list.css +++ b/src/styles/22-chat-thread-list.css @@ -15,6 +15,7 @@ gap: var(--codex-panel-panel-gap); align-items: center; min-width: 0; + padding-inline-end: var(--size-4-2); border-radius: var(--radius-s); } diff --git a/src/styles/30-chat-layout.css b/src/styles/30-chat-layout.css index 5da2159e..7d3a7088 100644 --- a/src/styles/30-chat-layout.css +++ b/src/styles/30-chat-layout.css @@ -88,7 +88,13 @@ .codex-panel__approval-details summary, .codex-panel__output summary, .codex-panel-diff-file summary { - cursor: pointer; + cursor: default; +} + +.codex-panel__approval-details summary:hover, +.codex-panel__output summary:hover, +.codex-panel-diff-file summary:hover { + color: var(--nav-item-color-hover, var(--text-normal)); } .codex-panel__config-list { diff --git a/src/styles/31-chat-messages.css b/src/styles/31-chat-messages.css index 0f6c8c85..dbcabeb9 100644 --- a/src/styles/31-chat-messages.css +++ b/src/styles/31-chat-messages.css @@ -128,11 +128,15 @@ } .codex-panel__activity-group > summary { - cursor: pointer; + cursor: default; color: var(--text-muted); font-size: var(--font-ui-small); } +.codex-panel__activity-group > summary:hover { + color: var(--nav-item-color-hover, var(--text-normal)); +} + .codex-panel__activity-group[open] { padding-bottom: var(--codex-panel-panel-gap); } @@ -196,11 +200,15 @@ } .codex-panel__message-collapse-details > summary { - cursor: pointer; + cursor: default; color: var(--text-muted); font-size: var(--font-ui-smaller); } +.codex-panel__message-collapse-details > summary:hover { + color: var(--nav-item-color-hover, var(--text-normal)); +} + .codex-panel__edited-files, .codex-panel__referenced-thread, .codex-panel__mentioned-files, @@ -237,7 +245,13 @@ .codex-panel__edited-files-details > summary, .codex-panel__mentioned-files-details > summary, .codex-panel__auto-reviews > summary { - cursor: pointer; + cursor: default; +} + +.codex-panel__edited-files-details > summary:hover, +.codex-panel__mentioned-files-details > summary:hover, +.codex-panel__auto-reviews > summary:hover { + color: var(--nav-item-color-hover, var(--text-normal)); } .codex-panel__open-turn-diff { @@ -253,11 +267,12 @@ color: var(--text-muted); font-size: var(--font-ui-smaller); line-height: var(--line-height-tight); - cursor: pointer; + cursor: default; } .codex-panel__open-turn-diff:hover { background: transparent; + color: var(--nav-item-color-hover, var(--text-normal)); } .codex-panel__open-turn-diff:focus-visible { @@ -309,7 +324,7 @@ } .codex-panel__wikilink { - cursor: pointer; + cursor: default; } .codex-panel__work-message { @@ -434,13 +449,18 @@ align-items: center; min-width: 0; color: var(--text-muted); - cursor: pointer; + cursor: default; } .codex-panel__tool-result--plain .codex-panel__tool-result-header { cursor: text; } +.codex-panel__tool-result-details > .codex-panel__tool-result-header:hover, +.codex-panel__tool-result-details > .codex-panel__tool-result-header:hover .codex-panel__message-role { + color: var(--nav-item-color-hover, var(--text-normal)); +} + .codex-panel__tool-result-header .codex-panel__message-role { margin-bottom: 0; } diff --git a/src/styles/32-chat-user-input.css b/src/styles/32-chat-user-input.css index 0d27811c..45a4bd58 100644 --- a/src/styles/32-chat-user-input.css +++ b/src/styles/32-chat-user-input.css @@ -33,7 +33,12 @@ color: var(--text-muted); font-size: var(--font-ui-small); line-height: var(--line-height-tight); - cursor: pointer; + cursor: default; +} + +.codex-panel__user-input-option:hover { + color: var(--nav-item-color-hover, var(--text-normal)); + background: var(--background-modifier-hover); } .codex-panel__user-input-radio { diff --git a/src/styles/34-chat-turn-diff-view.css b/src/styles/34-chat-turn-diff-view.css index 11de91a7..8b16884c 100644 --- a/src/styles/34-chat-turn-diff-view.css +++ b/src/styles/34-chat-turn-diff-view.css @@ -41,7 +41,11 @@ } .codex-panel-chat-turn-diff__files > summary { - cursor: pointer; + cursor: default; +} + +.codex-panel-chat-turn-diff__files > summary:hover { + color: var(--nav-item-color-hover, var(--text-normal)); } .codex-panel-chat-turn-diff__files ul { diff --git a/src/styles/40-threads-view.css b/src/styles/40-threads-view.css index 123d8f3d..50b6aa83 100644 --- a/src/styles/40-threads-view.css +++ b/src/styles/40-threads-view.css @@ -56,7 +56,8 @@ background: transparent; color: var(--nav-item-color, var(--text-muted)); text-align: start; - cursor: pointer; + --codex-panel-threads-row-title-color: currentcolor; + cursor: default; user-select: none; } @@ -71,6 +72,7 @@ .codex-panel-threads__row:hover, .codex-panel-threads__row:focus-within { + --codex-panel-threads-row-title-color: var(--nav-item-color-hover, var(--text-normal)); background: var(--background-modifier-hover); } @@ -85,9 +87,9 @@ background: var(--nav-item-background-active, var(--background-modifier-active)); } -.codex-panel-threads__row:hover .codex-panel-threads__row-title, -.codex-panel-threads__row:focus-within .codex-panel-threads__row-title { - color: var(--nav-item-color-hover, var(--text-normal)); +.codex-panel-threads__row:has(.codex-panel-threads__actions:hover), +.codex-panel-threads__row:has(.codex-panel-threads__actions :focus) { + --codex-panel-threads-row-title-color: currentcolor; } .codex-panel-threads__row--selected .codex-panel-threads__row-title { @@ -151,6 +153,7 @@ .codex-panel-threads__row-title { display: block; + color: var(--codex-panel-threads-row-title-color); font-size: var(--font-ui-small); font-weight: var(--nav-item-weight, var(--font-normal)); line-height: var(--line-height-tight); diff --git a/src/styles/50-selection-rewrite.css b/src/styles/50-selection-rewrite.css index f5623ddf..5c44a6b5 100644 --- a/src/styles/50-selection-rewrite.css +++ b/src/styles/50-selection-rewrite.css @@ -108,6 +108,14 @@ font-size: var(--font-ui-small); } +.codex-panel-selection-rewrite__debug > summary { + cursor: default; +} + +.codex-panel-selection-rewrite__debug > summary:hover { + color: var(--nav-item-color-hover, var(--text-normal)); +} + .codex-panel-selection-rewrite__debug.is-hidden { display: none; } diff --git a/tests/styles.test.ts b/tests/styles.test.ts index 8a0a3788..8faa2a96 100644 --- a/tests/styles.test.ts +++ b/tests/styles.test.ts @@ -48,13 +48,21 @@ describe("chat toolbar CSS", () => { expect(selectedToolbarHover).not.toContain("nav-item-background-active-hover"); expect(selectedThreadHover).not.toContain("nav-item-background-active-hover"); }); + + it("keeps chat thread row actions inset from the row edge", () => { + const threadRow = /\.codex-panel__thread-row \{(?[^}]+)\}/.exec(styles)?.groups?.["body"] ?? ""; + + expect(threadRow).toContain("padding-inline-end: var(--size-4-2)"); + }); }); describe("chat message CSS", () => { - it("uses a pointer cursor for the inline turn diff action", () => { + it("uses hover color instead of a pointer cursor for the inline turn diff action", () => { const openTurnDiff = /\.codex-panel__open-turn-diff \{(?[^}]+)\}/.exec(styles)?.groups?.["body"] ?? ""; + const openTurnDiffHover = /\.codex-panel__open-turn-diff:hover \{(?[^}]+)\}/.exec(styles)?.groups?.["body"] ?? ""; - expect(openTurnDiff).toContain("cursor: pointer"); + expect(openTurnDiff).toContain("cursor: default"); + expect(openTurnDiffHover).toContain("color: var(--nav-item-color-hover, var(--text-normal))"); }); }); @@ -105,4 +113,18 @@ describe("threads view CSS", () => { expect(selectedRowHover).toContain("background: var(--nav-item-background-active, var(--background-modifier-active))"); expect(selectedRowHover).not.toContain("nav-item-background-active-hover"); }); + + it("does not hover-highlight row titles while thread actions are hovered or focused", () => { + const rowHover = + /\.codex-panel-threads__row:hover,\n\.codex-panel-threads__row:focus-within \{(?[^}]+)\}/.exec(styles)?.groups?.["body"] ?? ""; + const actionHover = + /\.codex-panel-threads__row:has\(\.codex-panel-threads__actions:hover\),\n\.codex-panel-threads__row:has\(\.codex-panel-threads__actions :focus\) \{(?[^}]+)\}/.exec( + styles, + )?.groups?.["body"] ?? ""; + const title = /(?:^|\n\n)\.codex-panel-threads__row-title \{(?[^}]+)\}/.exec(styles)?.groups?.["body"] ?? ""; + + expect(rowHover).toContain("--codex-panel-threads-row-title-color: var(--nav-item-color-hover, var(--text-normal))"); + expect(actionHover).toContain("--codex-panel-threads-row-title-color: currentcolor"); + expect(title).toContain("color: var(--codex-panel-threads-row-title-color)"); + }); });