fix(products): 移除thumb max-height限制，修复竖屏视频卡片右侧白边 #1604

Merged

xiaoxia merged 1 commits from fix/product-thumb-white-border into develop 2026-09-01 14:30:42 +08:00

Conversation 4 Commits 1 Files Changed 1

-1

xiaoxia commented 2026-09-01 14:16:29 +08:00

Owner

Copy Link

Copy Source

问题

成片库竖屏视频（9:16）卡片右侧出现白边。

根因

.xx-product-thumb 设置了 max-height: 320px，竖屏视频 aspectRatio 为 9/16 时，thumb 宽度被限制在 ~180px，但卡片网格列宽约 300px，右侧出现空白。

修复

移除 .xx-product-thumb 的 max-height: 320px，让 aspectRatio 根据网格列宽自然撑满。卡片宽度由 4 列网格控制，aspectRatio 会自然约束高度。

## 问题 成片库竖屏视频（9:16）卡片右侧出现白边。 ## 根因 `.xx-product-thumb` 设置了 `max-height: 320px`，竖屏视频 aspectRatio 为 9/16 时，thumb 宽度被限制在 ~180px，但卡片网格列宽约 300px，右侧出现空白。 ## 修复 移除 `.xx-product-thumb` 的 `max-height: 320px`，让 aspectRatio 根据网格列宽自然撑满。卡片宽度由 4 列网格控制，aspectRatio 会自然约束高度。

xiaoxia added 1 commit 2026-09-01 14:16:29 +08:00

fix(products): 移除thumb max-height限制，修复竖屏视频卡片右侧白边 ... f761a6bf07

根因：.xx-product-thumb 的 max-height:320px 在竖屏视频
(aspectRatio 9/16) 时限制宽度为180px，但卡片网格列宽约300px，
导致右侧出现白边。移除 max-height 让 aspectRatio 自然撑满列宽。

auto-approve-bot commented 2026-09-01 14:21:22 +08:00

Collaborator

Copy Link

Copy Source

【阻塞级判定】

• 是否存在阻塞级问题：否
• 阻塞级问题数量：0 个

📊 审查概览

• 整体评价：通过
• 建议级问题数量：0 个

🔴 阻塞级问题（必须修复）

无

💡 改进建议（不阻塞合并）

无

✅ 良好实践

无

---

_{🤖 由 AI 代码审查机器人自动生成 | 2026-09-01 06:21:22 | 模型:}

### 【阻塞级判定】 - 是否存在阻塞级问题：否 - 阻塞级问题数量：0 个 ### 📊 审查概览 - 整体评价：通过 - 建议级问题数量：0 个 ### 🔴 阻塞级问题（必须修复） 无 ### 💡 改进建议（不阻塞合并） 无 ### ✅ 良好实践 无 --- _{🤖 由 AI 代码审查机器人自动生成 | 2026-09-01 06:21:22 | 模型:} <!-- AI_CODE_REVIEW_AUTO_COMMENT -->

gitea-actions bot commented 2026-09-01 14:22:13 +08:00

Copy Link

Copy Source

🚀 预览环境已部署

项目	详情
PR号	#1604
预览链接	https://pr-1604.preview.xiaoxiajianji.com
API环境	staging

💡 预览环境使用 staging API 数据，请勿在预览环境中操作重要数据。

🔄 每次提交新代码后预览环境会自动更新。

🗑️ PR 关闭或合并后，预览环境会自动清理。

🚀 **预览环境已部署** | 项目 | 详情 | |------|------| | PR号 | #1604 | | 预览链接 | [https://pr-1604.preview.xiaoxiajianji.com](https://pr-1604.preview.xiaoxiajianji.com) | | API环境 | staging | > 💡 预览环境使用 staging API 数据，请勿在预览环境中操作重要数据。 > > 🔄 每次提交新代码后预览环境会自动更新。 > > 🗑️ PR 关闭或合并后，预览环境会自动清理。

auto-approve-bot approved these changes 2026-09-01 14:22:17 +08:00

auto-approve-bot left a comment

Collaborator

Copy Link

Copy Source

CI全绿，自动审批通过。

CI全绿，自动审批通过。

auto-approve-bot approved these changes 2026-09-01 14:22:17 +08:00

auto-approve-bot left a comment

Collaborator

Copy Link

Copy Source

CI全绿，自动审批通过。

CI全绿，自动审批通过。

xiaoxia merged commit adf6b517fb into develop 2026-09-01 14:30:42 +08:00

xiaoxia deleted branch fix/product-thumb-white-border 2026-09-01 14:30:42 +08:00

Sign in to join this conversation.

Reviewers

No Reviewers

auto-approve-bot

Labels

Clear labels

P0

阻塞性，必须立即处理

P1

高优先级

P2

中优先级

P3

低优先级/后考虑

architecture

架构设计

backend

后端相关

blocked

阻塞中

bug

Bug修复

ci-bug

CI本身的bug

ci-optimization

CI优化类任务

ci-pipeline

CI流水线/workflow相关

cleanup

代码清理

devops

运维/部署/CI

documentation

文档相关

feature

新功能

frontend

前端相关

question

需要讨论确认

ready

PR CI通过，可合并

refactor

代码重构

No Label

Milestone

No items

No Milestone

Projects

Clear projects

No project

Assignees

Clear assignees

auto-approve-bot xiaoxia

No Assignees

3 Participants

Notifications

Subscribe

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: xiaoxia/xiaoxia-saas#1604