From 9f16de253354a0c064b0f54ed0479bf11c230d06 Mon Sep 17 00:00:00 2001
From: Peter Steinberger <steipete@gmail.com>
Date: Tue, 3 Feb 2026 21:53:50 -0800
Subject: [PATCH] style: update chat new-messages button

---
 CHANGELOG.md                 |  1 +
 ui/src/styles/components.css | 10 ++++++++++
 ui/src/ui/views/chat.ts      |  2 +-
 3 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 452b77e9d..aea516b6b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,7 @@ Docs: https://docs.openclaw.ai
 ### Fixes
 
 - Telegram: honor session model overrides in inline model selection. (#8193) Thanks @gildo.
+- Web UI: apply button styling to the new-messages indicator.
 
 ## 2026.2.2-3
 
diff --git a/ui/src/styles/components.css b/ui/src/styles/components.css
index 718e3daed..2ef6185c7 100644
--- a/ui/src/styles/components.css
+++ b/ui/src/styles/components.css
@@ -1001,6 +1001,16 @@
   line-height: 1;
 }
 
+/* New messages indicator */
+.chat-new-messages {
+  align-self: center;
+  margin: 8px auto 0;
+  border-radius: 999px;
+  padding: 6px 12px;
+  font-size: 12px;
+  line-height: 1;
+}
+
 /* Chat lines */
 .chat-line {
   display: flex;
diff --git a/ui/src/ui/views/chat.ts b/ui/src/ui/views/chat.ts
index 0291a41e6..8c36b5911 100644
--- a/ui/src/ui/views/chat.ts
+++ b/ui/src/ui/views/chat.ts
@@ -347,7 +347,7 @@ export function renderChat(props: ChatProps) {
         props.showNewMessages
           ? html`
             <button
-              class="chat-new-messages"
+              class="btn chat-new-messages"
               type="button"
               @click=${props.onScrollToBottom}
             >