vrr/CodeNomad
2
0
Fork 0
mirror of https://github.com/NeuralNomadsAI/CodeNomad.git synced 2026-07-09 16:00:52 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

ui: emphasize command palette button

Browse source
This commit is contained in:
Shantur Rathore 2026-02-20 00:24:24 +00:00
parent 77103b7292
commit 0e5695a903
3 changed files with 14 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

4
packages/ui/src/components/instance/instance-shell2.tsx
View file

@ -625,7 +625,7 @@ const InstanceShell2: Component<InstanceShellProps> = (props) => {
<div class="flex flex-wrap items-center justify-center gap-1">
<button
type="button"
class="connection-status-button px-2 py-0.5 text-xs"
class="connection-status-button command-palette-button px-2 py-0.5 text-xs"
onClick={handleCommandPaletteClick}
aria-label={t("instanceShell.commandPalette.openAriaLabel")}
style={{ flex: "0 0 auto", width: "auto" }}
@ -721,7 +721,7 @@ const InstanceShell2: Component<InstanceShellProps> = (props) => {
<div class="session-toolbar-center flex items-center justify-center gap-2 min-w-[160px]">
<button
type="button"
class="connection-status-button px-2 py-0.5 text-xs"
class="connection-status-button command-palette-button px-2 py-0.5 text-xs"
onClick={handleCommandPaletteClick}
aria-label={t("instanceShell.commandPalette.openAriaLabel")}
style={{ flex: "0 0 auto", width: "auto" }}

2
packages/ui/src/components/message-list-header.tsx
View file

@ -51,7 +51,7 @@ export default function MessageListHeader(props: MessageListHeaderProps) {
<div class="connection-status-shortcut-action">
<button
type="button"
class="connection-status-button"
class="connection-status-button command-palette-button"
onClick={props.onCommandPalette}
aria-label={t("messageListHeader.commandPalette.ariaLabel")}
>

11
packages/ui/src/styles/messaging/message-section.css
View file

@ -130,6 +130,17 @@
color: var(--text-primary);
}
/* Make the command palette trigger stand out in the header. */
.connection-status-button.command-palette-button {
border-color: var(--accent-primary);
background-color: var(--surface-secondary);
}
.connection-status-button.command-palette-button:hover {
border-color: var(--accent-primary);
background-color: var(--surface-hover);
}
.connection-status-button:hover {
background-color: var(--surface-hover);
}