Fix: In the dark night theme, the message input box is not displayed correctly. #6950 (#6951)

### What problem does this PR solve?

Fix: In the dark night theme, the message input box is not displayed
correctly. #6950

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/components/message-input/index.less

@@ -1,7 +1,6 @@
 .messageInputWrapper {
   margin-right: 20px;
   padding: '0px 0px 10px 0px';
-  background-color: #ffffff;
   border: 1px solid #d9d9d9;
   &:hover {
     border-color: #40a9ff;

web/src/components/message-input/index.tsx

@@ -5,6 +5,7 @@ import {
   useRemoveNextDocument,
   useUploadAndParseDocument,
 } from '@/hooks/document-hooks';
+import { cn } from '@/lib/utils';
 import { getExtension } from '@/utils/document-util';
 import { formatBytes } from '@/utils/file-util';
 import {
@@ -222,7 +223,11 @@ const MessageInput = ({
   }, [conversationId, setFileList]);
 
   return (
-    <Flex gap={1} vertical className={styles.messageInputWrapper}>
+    <Flex
+      gap={1}
+      vertical
+      className={cn(styles.messageInputWrapper, 'dark:bg-black')}
+    >
       <TextArea
         size="large"
         placeholder={t('sendPlaceholder')}

web/src/locales/en.ts

@@ -406,7 +406,7 @@ This auto-tagging feature enhances retrieval by adding another layer of domain-s
       createAssistant: 'Create an Assistant',
       assistantSetting: 'Assistant settings',
       promptEngine: 'Prompt engine',
-      modelSetting: 'Model Setting',
+      modelSetting: 'Model settings',
       chat: 'Chat',
       newChat: 'New chat',
       send: 'Send',
@@ -532,8 +532,7 @@ This auto-tagging feature enhances retrieval by adding another layer of domain-s
       locale: 'Locale',
       selectLanguage: 'Select a language',
       reasoning: 'Reasoning',
-      reasoningTip:
+      reasoningTip: `Whether to enable a reasoning workflow during question answering, as seen in models like Deepseek-R1 or OpenAI o1. When enabled, this allows the model to access external knowledge and tackle complex questions in a step-by-step manner, leveraging techniques like chain-of-thought reasoning. This approach enhances the model's ability to provide accurate responses by breaking down problems into manageable steps, improving performance on tasks that require logical reasoning and multi-step thinking.`,
-        `Whether to enable a reasoning workflow during question answering, as seen in models like Deepseek-R1 or OpenAI o1. When enabled, this allows the model to access external knowledge and tackle complex questions in a step-by-step manner, leveraging techniques like chain-of-thought reasoning. This approach enhances the model's ability to provide accurate responses by breaking down problems into manageable steps, improving performance on tasks that require logical reasoning and multi-step thinking.`,
       tavilyApiKeyTip:
         'If an API key is correctly set here, Tavily-based web searches will be used to supplement knowledge base retrieval.',
       tavilyApiKeyMessage: 'Please enter your Tavily API Key',

web/src/pages/chat/chat-configuration-modal/index.tsx

@@ -37,9 +37,9 @@ const validateMessages = {
 };
 
 enum ConfigurationSegmented {
-  AssistantSetting = 'Assistant settings',
+  AssistantSetting = 'Assistant Setting',
-  PromptEngine = 'Prompt engine',
+  PromptEngine = 'Prompt Engine',
-  ModelSetting = 'Model settings',
+  ModelSetting = 'Model Setting',
 }
 
 const segmentedMap = {