From feeea211273c46403ce6f90e4d4973b1fcbaa93a Mon Sep 17 00:00:00 2001
From: Logan Yang <logancyang@gmail.com>
Date: Mon, 22 Sep 2025 14:22:52 -0700
Subject: [PATCH] Drop user and bot icons to save space and add shade to user
 message (#1837)

---
 .../chat-components/ChatSingleMessage.tsx           | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/chat-components/ChatSingleMessage.tsx b/src/components/chat-components/ChatSingleMessage.tsx
index 0dba41ba..c4de425f 100644
--- a/src/components/chat-components/ChatSingleMessage.tsx
+++ b/src/components/chat-components/ChatSingleMessage.tsx
@@ -10,7 +10,6 @@ import { processInlineCitations } from "@/LLMProviders/chainRunner/utils/citatio
 import { useSettingsValue } from "@/settings/model";
 import { ChatMessage } from "@/types/message";
 import { cleanMessageForCopy, insertIntoEditor } from "@/utils";
-import { Bot, User } from "lucide-react";
 import { App, Component, MarkdownRenderer, MarkdownView, TFile } from "obsidian";
 import React, { useCallback, useEffect, useRef, useState } from "react";
 import ReactDOM, { Root } from "react-dom/client";
@@ -644,14 +643,16 @@ const ChatSingleMessage: React.FC<ChatSingleMessageProps> = ({
     <div className="tw-my-1 tw-flex tw-w-full tw-flex-col">
       <div
         className={cn(
-          "tw-group tw-mx-2 tw-flex tw-gap-2 tw-rounded-md tw-p-2",
+          "tw-group tw-mx-2 tw-rounded-md tw-p-2",
           message.sender === USER_SENDER && "tw-border tw-border-solid tw-border-border"
         )}
+        style={
+          message.sender === USER_SENDER
+            ? { backgroundColor: "var(--background-modifier-hover)" }
+            : undefined
+        }
       >
-        <div className="tw-w-6 tw-shrink-0">
-          {message.sender === USER_SENDER ? <User /> : <Bot />}
-        </div>
-        <div className="tw-flex tw-max-w-full tw-grow tw-flex-col tw-gap-2 tw-overflow-hidden">
+        <div className="tw-flex tw-max-w-full tw-flex-col tw-gap-2 tw-overflow-hidden">
           {!isEditing && <MessageContext context={message.context} />}
           <div className="message-content">{renderMessageContent()}</div>