feat(ui): highlight delete targets on hover
This commit is contained in:
@@ -2,6 +2,7 @@
|
||||
@import "./messaging/prompt-input.css";
|
||||
@import "./messaging/message-section.css";
|
||||
@import "./messaging/message-block-list.css";
|
||||
@import "./messaging/delete-overlays.css";
|
||||
@import "./messaging/message-timeline.css";
|
||||
@import "./messaging/tool-call.css";
|
||||
@import "./messaging/log-view.css";
|
||||
@@ -110,4 +111,3 @@
|
||||
.reasoning-label {
|
||||
font-weight: var(--font-weight-medium);
|
||||
}
|
||||
|
||||
|
||||
37
packages/ui/src/styles/messaging/delete-overlays.css
Normal file
37
packages/ui/src/styles/messaging/delete-overlays.css
Normal file
@@ -0,0 +1,37 @@
|
||||
/* Hover overlays for destructive actions (delete part / delete message). */
|
||||
|
||||
.message-stream-block[data-delete-message-hover="true"] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.message-stream-block[data-delete-message-hover="true"]::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: -2px;
|
||||
background: var(--status-error-bg);
|
||||
box-shadow: inset 0 0 0 1px var(--status-error-fg);
|
||||
border-radius: 10px;
|
||||
pointer-events: none;
|
||||
/* Overlay must sit above the message cards (they have opaque backgrounds). */
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.message-part-shell {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.delete-hover-scope[data-delete-part-hover="true"] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.delete-hover-scope[data-delete-part-hover="true"]::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: -2px;
|
||||
background: var(--status-error-bg);
|
||||
box-shadow: inset 0 0 0 1px var(--status-error-fg);
|
||||
border-radius: 10px;
|
||||
pointer-events: none;
|
||||
/* Overlay must sit above the part card background. */
|
||||
z-index: 10;
|
||||
}
|
||||
Reference in New Issue
Block a user