From ec573151d234699c0b3bd4adfcd5b8a83ac08e18 Mon Sep 17 00:00:00 2001
From: seaislee1209 <seaislee129@gmail.com>
Date: Fri, 19 Jun 2026 19:14:26 +0800
Subject: [PATCH] =?UTF-8?q?fix(auth):=20=E7=99=BB=E5=BD=95=E9=A1=B5?=
 =?UTF-8?q?=E4=BF=AE=E6=8C=89=E9=92=AE=E4=B8=A2=E5=A4=B1=20+=20=E9=BB=91?=
 =?UTF-8?q?=E5=9D=97=E7=AD=89=E9=AB=98=20+=20=E5=93=81=E7=89=8C=E6=96=87?=
 =?UTF-8?q?=E6=A1=88=E9=87=8D=E6=A2=B3(=E5=8E=BB=E6=B5=81=E7=A8=8B?=
 =?UTF-8?q?=E7=BD=97=E5=88=97)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

用户反馈登录页:① 登录按钮不见了 ② 左黑块比右栏矮一截 ③ 左侧铺一堆生成流程/
失败不扣费,杂、不像品牌门面。

- 按钮丢失:.auth-submit-zone(按钮+SSO+切换)原是 .auth-form 的兄弟节点,登录态被当成
  flex 第三列挤出、被 overflow 裁掉 → 移进 .auth-form 表单内,按钮恢复。
- 黑块矮:.auth-brand 基础规则带 height:100%,而登录/注册 wrap 是 height:auto,百分比高
  解析不出 → 黑块退回内容高、退出 stretch。删掉 height:100%,靠 align-self:stretch 拉等高。
- 文案:删 VALUE_POINTS 四条功能罗列 + 流程箭头 p,登录/注册统一干净品牌短句
  (「让每件商品都有自己的带货短剧」/「开通团队,拍出第一条带货短剧」),守 design.md 克制调性。

实测:黑块=表单=600px 等高;登录按钮+SSO 显示正常。

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 core/frontend/src/routes/auth-screen.tsx | 52 ++++++++----------------
 core/frontend/src/styles.css             |  1 -
 2 files changed, 18 insertions(+), 35 deletions(-)

diff --git a/core/frontend/src/routes/auth-screen.tsx b/core/frontend/src/routes/auth-screen.tsx
index 47d9a05..19c393e 100644
--- a/core/frontend/src/routes/auth-screen.tsx
+++ b/core/frontend/src/routes/auth-screen.tsx
@@ -2,7 +2,6 @@ import { useEffect, useRef, useState } from "react";
 import type { FormEvent } from "react";
 import {
   ArrowRight,
-  Check,
   Eye,
   EyeOff,
   Info,
@@ -37,13 +36,6 @@ type RegisterErrors = {
   agree?: string;
 };
 
-const VALUE_POINTS: { strong: string; rest: string }[] = [
-  { strong: "5 阶段流水线", rest: "脚本 → 资产 → 故事板 → 视频片段 → 拼接导出" },
-  { strong: "失败不扣费", rest: "任务仅在用户通过时扣费，失败 / 超时 / 重跑一律不扣" },
-  { strong: "团队 + 角色 + 四层额度", rest: "超管 / 团管 / 成员，日 / 月 + 团队 / 总四层防超支" },
-  { strong: "跨项目资产库", rest: "主播 / 场景 / 商品图沉淀复用，不重复生成" }
-];
-
 export function AuthScreen({
   initialMode,
   onModeChange,
@@ -213,27 +205,19 @@ export function AuthScreen({
     <aside className="auth-brand">
       <div className="logo"><img className="logo-img" src="/assets/logo-dark.png" alt="Airshelf" /></div>
       <div className="tag">// SHORT-VIDEO COMMERCE PLATFORM</div>
-      {mode === "register" ? (
-        <>
-          <div className="hero hero-top">
-            <h1>开通团队，<br />开始 <span className="h">AI 带货</span> 第一条短剧</h1>
-            <p>个人 / 企业团队 1-2 小时出成片，失败不扣费，确认后扣。</p>
-          </div>
-          <div className="val-list">
-            {VALUE_POINTS.map((item) => (
-              <div className="val-item" key={item.strong}>
-                <span className="ic-v"><Check size={12} strokeWidth={2.2} aria-hidden="true" /></span>
-                <span className="txt-v"><b>{item.strong}</b> · {item.rest}</span>
-              </div>
-            ))}
-          </div>
-        </>
-      ) : (
-        <div className="hero">
-          <h1>AI 全流程<br /><span className="h">短剧化</span>带货生成</h1>
-          <p>商品 → AI 脚本 → 故事板 → Seedance 视频片段 → 一键导出 9:16 ≤60s 成片。</p>
-        </div>
-      )}
+      <div className="hero">
+        {mode === "register" ? (
+          <>
+            <h1>开通团队，<br />拍出第一条 <span className="h">带货短剧</span></h1>
+            <p>1-2 小时，从一张商品图，到一条能卖货的短剧。</p>
+          </>
+        ) : (
+          <>
+            <h1>让每件商品<br />都有自己的<span className="h">带货短剧</span></h1>
+            <p>商品图进，带货短剧出 —— 你只管挑成片。</p>
+          </>
+        )}
+      </div>
       <div className="foot"><a href="#">关于</a><a href="#">定价</a><a href="#">联系</a><a href="#">隐私</a></div>
     </aside>
   );
@@ -447,9 +431,7 @@ export function AuthScreen({
               <label><input type="checkbox" checked={remember} onChange={(event) => setRemember(event.target.checked)} /> 记住我 7 天</label>
               <a href="#" onClick={(event) => { event.preventDefault(); showToast("重置密码", "请联系团队超管重置你的登录密码"); }}>忘记密码?</a>
             </div>
-          </form>
-        </section>
-        <div className="auth-submit-zone">
+            <div className="auth-submit-zone">
           {loginProgress && !error && (
             <div className="login-progress" role="status" aria-live="polite">
               <span className="login-progress-spinner" aria-hidden="true"></span>
@@ -457,7 +439,7 @@ export function AuthScreen({
             </div>
           )}
           {error && <div className="form-error" role="alert">{error}</div>}
-          <button className="btn-cta" type="button" form="login-form" disabled={busy} onClick={() => { void submitLogin(); }}>
+          <button className="btn-cta" type="submit" disabled={busy}>
             {busy ? "登录中" : "登录"}
           </button>
           <div className="divider"><span className="line"></span><span className="txt">OR</span><span className="line"></span></div>
@@ -472,7 +454,9 @@ export function AuthScreen({
           <div className="switch-row">
             还没账号? <a href="/register" onClick={(event) => { event.preventDefault(); switchMode("register"); }}>注册团队 →</a>
           </div>
-        </div>
+            </div>
+          </form>
+        </section>
       </div>
       {toast && (
         <div className="toast show" role="status" aria-live="polite">
diff --git a/core/frontend/src/styles.css b/core/frontend/src/styles.css
index 639e6bd..e4c0b9f 100644
--- a/core/frontend/src/styles.css
+++ b/core/frontend/src/styles.css
@@ -747,7 +747,6 @@ nav button svg { width: 14px; height: 14px; color: var(--ink-3); }
   width: calc(100% - 420px);
   align-self: stretch;
   box-sizing: border-box;
-  height: 100%;
   min-height: 0;
   position: relative;
   overflow: hidden;