Renew 移动端需求与决策

已确认需求

基础框架与导航

模块	涉及文件	验收要求
全局基础	.vitepress/config.mjs、.vitepress/theme/style.css、.vitepress/theme/index.js	修正 viewport，统一页面边距、导航高度、底部安全区和 1200/1024/768/480 断点，清理固定宽高造成的溢出。
顶部导航	VPNav.vue、VPNavBar.vue、VPNavBarHamburger.vue	移动端隐藏桌面菜单并显示汉堡按钮；抽屉纵向展开，支持遮罩关闭和页面滚动锁定。
导航抽屉	VPNavScreen.vue、VPNavScreenMenu.vue、VPNavScreenMenuGroup.vue、nav.ts	桌面/移动判断统一为 1200px；二级菜单可展开/收起；窗口变化后状态同步。

轮播、Banner 与框架页

模块	涉及文件	验收要求
首页轮播	CustomHomePage.vue、BannerCarousel.vue	图片不裁掉主体；标题、描述、按钮在手机上纵向排列；保留手势、分页点，小屏可缩小或隐藏箭头。
框架页	CustomFrameworkFrontendPage.vue、CustomFrameworkBackendPage.vue	移动端单列、高度自然撑开；必须保持 PC 比例的图示完整显示或可横向查看。

卡片和内容页

模块	涉及文件	验收要求
功能/保护卡片	CustomFeaturesSection.vue、CustomChoose.vue、CustomProtect.vue	PC 多列、平板两列、手机一列；取消会截断文字的固定高度。
产品卡片	CustomProductPage.vue、两个 Framework 页	手机单列，图标、标题、描述和按钮不拥挤。
案例与 Logo	CustomerCases.vue、CustomerSuccessCases.vue、CustomClassicCases.vue、CustomerLogos.vue	卡片按宽度变为三/两/一列；图片比例统一；整卡可点；Logo 不拉伸。
价格/评价	CustomPricePage.vue、CustomEvaluate.vue	价格单列且权益完整；自动评价滚动不引发横向溢出。
帮助/市场	CustomHelpCenter.vue、CustomMarketPage.vue、CustomMarketDetail.vue	卡片单列或两列；详情按图片、标题、正文顺序排列；按钮可触控。
公告动态	CustomAnnouncement.vue、CustomDevDynamics.vue	文字自然换行，时间、标签和按钮分开，超长内容不撑破页面。
能力矩阵	CustomCapabilityMatrix.vue	不隐藏关键列；表头与内容对应；外层横向滚动。

表单、弹窗、Footer 和咨询

模块	涉及文件	验收要求
表单/预约	LeadCaptureForm.vue、ScheduleDialog.vue	手机单列，按钮易点，弹窗不超屏且内容可内部滚动，键盘弹出后可操作。
微信/咨询	CustomWechatDialog.vue、CustomPopover.vue	关闭按钮可见，二维码按比例缩放，遮罩和 Esc 关闭正常。
Footer	CustomFooter.vue	移动端纵向分组，保留联系方式、二维码和备案信息，不被底部栏遮挡。
底部操作栏	MobileActionBar.vue	1024px 及以下显示，适配安全区，咨询和预约只由用户点击触发。
第三方客服	CustomAdComponent.vue、CustomPopover.vue	不在加载后自动弹出，不用 CSS 强制显示第三方图标，不擅自删除百度统计脚本。

验收决策

• 快速视口：390×844、1440×900。
• 最终视口：320×568、375×812、390×844、480×900、768×1024、1024×1366、1440×900。
• 重点路由：首页、产品页、前后端框架页、帮助中心、市场页、案例页、价格页、关于页。
• 重点交互：导航展开/二级菜单/关闭、轮播切换与手势、表单输入、预约弹窗、咨询弹窗、底部操作栏、第三方入口。
• 严重程度：P0 内容/入口丢失，P1 布局/交互不可用，P2 明显视觉偏差，P3 细节优化。
• 没有原型图时，以现有 PC 页的内容和入口作为回归基准，以本文档的移动端重排决策作为布局基准。

变更历史

日期	变更
2026-08-24	将根目录 1.md 迁移为正式需求与决策文档，补齐验收视口、严重程度和第三方客服边界。