fix(ui): align log search input styling with EventFeed, render ellipsis
All checks were successful
All checks were successful
JSX attribute strings don't process JS escape sequences — "Search logs\u2026" rendered the literal "\u2026" in the placeholder. Replaced with the actual ellipsis character. Also aligned .logSearchInput (Application Log search) with EventFeed's internal search input: --bg-surface background, --border border, mono font family, 28px height. Previously used --bg-body + --border-subtle + body font, which looked visibly different next to the Timeline panel. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -920,7 +920,7 @@ export default function AgentHealth() {
|
||||
<input
|
||||
type="text"
|
||||
className={logStyles.logSearchInput}
|
||||
placeholder="Search logs\u2026"
|
||||
placeholder="Search logs…"
|
||||
value={logSearch}
|
||||
onChange={(e) => setLogSearch(e.target.value)}
|
||||
aria-label="Search logs"
|
||||
|
||||
@@ -426,7 +426,7 @@ export default function AgentInstance() {
|
||||
<input
|
||||
type="text"
|
||||
className={logStyles.logSearchInput}
|
||||
placeholder="Search logs\u2026"
|
||||
placeholder="Search logs…"
|
||||
value={logSearch}
|
||||
onChange={(e) => setLogSearch(e.target.value)}
|
||||
aria-label="Search logs"
|
||||
|
||||
@@ -53,14 +53,16 @@
|
||||
|
||||
.logSearchInput {
|
||||
width: 100%;
|
||||
padding: 5px 28px 5px 10px;
|
||||
border: 1px solid var(--border-subtle);
|
||||
height: 28px;
|
||||
padding: 0 26px 0 8px;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--bg-body);
|
||||
background: var(--bg-surface);
|
||||
color: var(--text-primary);
|
||||
font-size: 12px;
|
||||
font-family: var(--font-body);
|
||||
font-family: var(--font-mono);
|
||||
outline: none;
|
||||
transition: border-color .15s;
|
||||
}
|
||||
|
||||
.logSearchInput:focus {
|
||||
|
||||
Reference in New Issue
Block a user