样式修改

frontend-web/src/components/workspace/input-box.tsx

@@ -86,6 +86,30 @@ import { Tooltip } from "./tooltip";
 
 type InputMode = "flash" | "thinking" | "pro" | "ultra";
 
+// 推荐问题列表 — 可自由配置 title（卡片标题）和 content（发送给对话的内容）
+const RECOMMENDED_QUESTIONS: { title: string; content: string }[] = [
+  {
+    title: "市场分析报告",
+    content: "请帮我写一份关于当前 AI 市场的详细分析报告，包括市场规模、主要玩家和发展趋势。",
+  },
+  {
+    title: "制定学习计划",
+    content: "请帮我制定一个为期 3 个月的 Python 编程学习计划，从基础到进阶，每周安排具体任务。",
+  },
+  {
+    title: "代码审查建议",
+    content: "请帮我审查代码，找出潜在的问题、性能瓶颈以及改进建议，并给出修改示例。",
+  },
+  {
+    title: "数据分析方案",
+    content: "请帮我设计一个用于分析用户行为数据的方案，包括数据收集、处理和可视化策略。",
+  },
+  {
+    title: "文章润色优化",
+    content: "请帮我润色以下文章，使其更加流畅、专业，并保持原意不变。",
+  },
+];
+
 function getResolvedMode(
   mode: InputMode | undefined,
   supportsThinking: boolean,
@@ -430,7 +454,32 @@ export function InputBox({
   }, [context.model_name, disabled, isMock, status, thread.messages, threadId]);
 
   return (
-    <div ref={promptRootRef} className="relative flex flex-col gap-4">
+    <div ref={promptRootRef} className="relative flex flex-col gap-6">
+      {extraHeader && (
+        <div className="flex items-center justify-center">
+          {extraHeader}
+        </div>
+      )}
+
+      {isNewThread && searchParams.get("mode") !== "skill" && (
+        <div className="flex flex-wrap justify-center gap-2.5 px-4 mb-[10px]">
+          {RECOMMENDED_QUESTIONS.map((q) => (
+            <button
+              key={q.title}
+              type="button"
+              className="rounded-full border border-[#e4e4e7] bg-white px-4 py-2 text-sm text-[#18181b] shadow-none transition-colors hover:bg-[#f4f4f5] cursor-pointer"
+              onClick={() => {
+                textInput.setInput(q.content);
+                setFollowupsHidden(true);
+                setTimeout(() => requestFormSubmit(), 0);
+              }}
+            >
+              {q.title}
+            </button>
+          ))}
+        </div>
+      )}
+
       {showFollowups && (
         <div className="flex items-center justify-center pb-2">
           <div className="flex items-center gap-2">
@@ -473,13 +522,6 @@ export function InputBox({
         onSubmit={handleSubmit}
         {...props}
       >
-        {extraHeader && (
-          <div className="absolute top-0 right-0 left-0 z-10">
-            <div className="absolute right-0 bottom-0 left-0 flex items-center justify-center">
-              {extraHeader}
-            </div>
-          </div>
-        )}
         <PromptInputAttachments>
           {(attachment) => <PromptInputAttachment data={attachment} />}
         </PromptInputAttachments>
@@ -846,12 +888,6 @@ export function InputBox({
         )}
       </PromptInput>
 
-      {isNewThread && searchParams.get("mode") !== "skill" && (
-        <div className="flex items-center justify-center pt-2">
-          <SuggestionList />
-        </div>
-      )}
-
       <Dialog open={confirmOpen} onOpenChange={setConfirmOpen}>
         <DialogContent>
           <DialogHeader>

frontend-web/src/components/workspace/messages/message-list.tsx

@@ -68,7 +68,7 @@ export function MessageList({
     <Conversation
       className={cn("flex size-full flex-col justify-center", className)}
     >
-      <ConversationContent className="mx-auto w-full max-w-(--container-width-md) gap-8 pt-12">
+      <ConversationContent className="mx-auto w-full max-w-(--container-width-lg) gap-8 pt-12">
         {groupMessages(messages, (group) => {
           if (group.type === "human" || group.type === "assistant") {
             return group.messages.map((msg) => {

frontend-web/src/components/workspace/messages/skeleton.tsx

@@ -24,7 +24,7 @@ function SkeletonBar({
 export function MessageListSkeleton() {
   let index = 0;
   return (
-    <div className="flex w-full max-w-(--container-width-md) flex-col gap-12 p-8 pt-16">
+    <div className="flex w-full max-w-(--container-width-lg) flex-col gap-12 p-8 pt-16">
       <div
         role="human-message"
         className="flex w-[50%] flex-col items-end gap-2 self-end"

frontend-web/src/components/workspace/welcome.tsx

@@ -50,23 +50,23 @@ export function Welcome({
       </div>
       {searchParams.get("mode") === "skill" ? (
         <div className="text-muted-foreground text-sm">
-          {t.welcome.createYourOwnSkillDescription.includes("\n") ? (
+          {/* {t.welcome.createYourOwnSkillDescription.includes("\n") ? (
             <pre className="font-sans whitespace-pre">
               {t.welcome.createYourOwnSkillDescription}
             </pre>
           ) : (
             <p>{t.welcome.createYourOwnSkillDescription}</p>
-          )}
+          )} */}
         </div>
       ) : (
         <div className="text-muted-foreground text-sm">
-          {t.welcome.description.includes("\n") ? (
+          {/* {t.welcome.description.includes("\n") ? (
             <pre className="font-sans whitespace-pre">
               {t.welcome.description}
             </pre>
           ) : (
             <p>{t.welcome.description}</p>
-          )}
+          )} */}
         </div>
       )}
     </div>

frontend-web/src/core/i18n/locales/zh-CN.ts

@@ -59,7 +59,7 @@ export const zhCN: Translations = {
 
   // Welcome
   welcome: {
-    greeting: "你好，欢迎回来！",
+    greeting: "你好，欢迎使用CM助手",
     description:
       "欢迎使用 CM 助手",
 

frontend-web/src/pages/ChatPage.tsx

@@ -145,8 +145,8 @@ export default function ChatPage() {
                   "relative w-full",
                   isLandingState && "-translate-y-[calc(50vh-96px)]",
                   isLandingState
-                    ? "max-w-(--container-width-sm)"
-                    : "max-w-(--container-width-md)",
+                    ? "max-w-(--container-width-md)"
+                    : "max-w-(--container-width-lg)",
                 )}
               >
                 <div className="absolute -top-4 right-0 left-0 z-0">