fix(web): make login responsive

apps/web_v1/src/App.css

@@ -59,8 +59,10 @@
 }
 
 .login-card.arco-card {
-  width: min(1180px, 96vw);
+  width: min(960px, 100%);
   min-height: 430px;
+  display: grid;
+  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
   overflow: hidden;
   border-color: var(--color-border);
   border-radius: var(--radius-control);
@@ -68,20 +70,19 @@
 }
 
 .login-card .arco-card-body {
-  display: grid;
-  grid-template-columns: 1fr 1.1fr 1fr;
+  display: contents;
   padding: 0;
 }
 
 .login-brand-panel,
-.login-form-panel,
-.login-value-panel {
+.login-form-panel {
+  min-width: 0;
   min-height: 430px;
   padding: 42px;
+  box-sizing: border-box;
 }
 
-.login-brand-panel,
-.login-form-panel {
+.login-brand-panel {
   border-right: 1px solid var(--color-border);
 }
 
@@ -125,16 +126,6 @@
   font-weight: 600;
 }
 
-.login-footer-links {
-  align-self: end;
-  flex-wrap: wrap;
-  margin-top: 72px;
-}
-
-.login-footer-links .arco-typography {
-  white-space: nowrap;
-}
-
 .login-form-panel {
   display: grid;
   align-content: center;
@@ -144,6 +135,12 @@
   margin-top: 20px;
 }
 
+.login-form .arco-input-wrapper,
+.login-form .arco-input-password,
+.login-form > .arco-btn {
+  width: 100%;
+}
+
 .login-row {
   display: flex;
   align-items: center;
@@ -179,35 +176,6 @@
   font-weight: 600;
 }
 
-.login-value-panel {
-  display: grid;
-  align-content: center;
-  gap: 18px;
-}
-
-.value-point {
-  display: grid;
-  grid-template-columns: 42px 1fr;
-  gap: var(--space-3);
-  align-items: center;
-}
-
-.value-point > span {
-  width: 42px;
-  height: 42px;
-  display: grid;
-  place-items: center;
-  border-radius: 999px;
-  background: var(--color-soft-blue);
-  color: var(--color-primary);
-  font-size: 22px;
-}
-
-.value-title {
-  display: block;
-  font-weight: 700;
-}
-
 .workbench-shell {
   height: 100vh;
   display: grid;
@@ -2029,23 +1997,47 @@
   padding-top: 14px;
 }
 
-@media (max-width: 1180px) {
-  .workbench-shell {
-    min-width: 1180px;
+@media (max-width: 760px) {
+  .login-screen {
+    place-items: start stretch;
+    padding: 16px;
   }
 
-  .login-card .arco-card-body {
+  .login-card.arco-card {
     grid-template-columns: 1fr;
+    min-height: 0;
   }
 
   .login-brand-panel,
   .login-form-panel {
     min-height: auto;
+    padding: 24px;
+  }
+
+  .login-brand-panel {
     border-right: 0;
     border-bottom: 1px solid var(--color-border);
   }
 
-  .login-value-panel {
-    min-height: auto;
+  .login-row,
+  .connection-card {
+    grid-template-columns: 1fr;
+  }
+
+  .login-row {
+    align-items: stretch;
+    flex-direction: column;
+    gap: var(--space-2);
+  }
+
+  .login-row .arco-btn,
+  .connection-card .arco-btn {
+    width: 100%;
+  }
+}
+
+@media (max-width: 1180px) {
+  .workbench-shell {
+    min-width: 1180px;
   }
 }

apps/web_v1/src/pages/login.tsx

@@ -1,17 +1,13 @@
-import type { ReactElement } from 'react'
 import { useEffect, useState } from 'react'
 import { Button, Card, Form, Input, Space, Typography } from '@arco-design/web-react'
 import {
-  IconBook,
   IconCheckCircleFill,
   IconCloseCircleFill,
   IconLaunch,
   IconLoading,
-  IconSafe,
-  IconUserGroup,
 } from '@arco-design/web-react/icon'
 
-const { Title, Text, Paragraph } = Typography
+const { Title, Text } = Typography
 
 type ConnectionStatus = 'checking' | 'online' | 'offline'
 
@@ -42,12 +38,7 @@ export function LoginPage({ onLogin }: { onLogin: (input: { server: string; emai
             <Title heading={2}>森林AI</Title>
           </div>
           <Text className="login-slogan">私有部署 · 安全可控的智能协作平台</Text>
-          <Text type="secondary">知识沉淀 · 团队协作 · AI Agent</Text>
-          <Space className="login-footer-links" size={24}>
-            <Text type="secondary">v1.0.0</Text>
-            <Text type="secondary">隐私政策</Text>
-            <Text type="secondary">服务协议</Text>
-          </Space>
+          <Text type="secondary">知识沉淀 · 团队协作 · AI 助手</Text>
         </div>
 
         <div className="login-form-panel">
@@ -77,16 +68,6 @@ export function LoginPage({ onLogin }: { onLogin: (input: { server: string; emai
             </Button>
           </Form>
         </div>
-
-        <div className="login-value-panel">
-          <Title heading={3}>安全 · 专注 · 高效</Title>
-          <Paragraph>
-            森林AI 是面向知识工作者与内部团队的私有部署工作台，帮助团队在统一空间中收集信息、整理知识、协同决策。
-          </Paragraph>
-          <ValuePoint icon={<IconSafe />} title="私有部署，数据自有" desc="所有数据与模型运行在您的环境中，安全可控。" />
-          <ValuePoint icon={<IconBook />} title="知识沉淀，结构清晰" desc="从收集到整理，形成可复用的团队知识库。" />
-          <ValuePoint icon={<IconUserGroup />} title="协同高效，聚焦成果" desc="围绕项目与任务协同，减少沟通成本，专注交付。" />
-        </div>
       </Card>
     </section>
   )
@@ -133,15 +114,3 @@ function normalizeBaseUrl(value: string) {
   const trimmed = value.trim()
   return trimmed.endsWith('/') ? trimmed.slice(0, -1) : trimmed
 }
-
-function ValuePoint({ icon, title, desc }: { icon: ReactElement; title: string; desc: string }) {
-  return (
-    <div className="value-point">
-      <span>{icon}</span>
-      <div>
-        <Text className="value-title">{title}</Text>
-        <Text type="secondary">{desc}</Text>
-      </div>
-    </div>
-  )
-}