 peanut
|
b6bf97bc36
|
fix(mini-program): 修复剧本详情页卡片边距与屏幕重叠问题
问题:
- 信息卡片和正文卡片的圆角边框紧贴屏幕边缘
- 容器圆角被截断，视觉显示不完整
- 底部边距不足，卡片圆角显示不完整
修复:
- .detail-content 左右 padding 从 32rpx 增加到 40rpx
- .detail-content 顶部 padding 从 20rpx 增加到 24rpx
- .detail-content 底部 padding 从 32rpx 增加到 40rpx
- 移除 .content-container 的 padding-bottom，由父容器统一控制
效果:
- 卡片与屏幕边缘有足够间距（40rpx）
- 卡片圆角（40rpx）能完整展示
- 整体布局更加美观协调
|
2026-04-07 23:04:34 +08:00 |
|
|
peanut
|
21c07ba450
|
fix(mini-program): 修复剧本详情页内容超出屏幕和间距问题
修复内容:
1. 信息卡片右侧超出屏幕:
- .info-value 添加 flex:1 + overflow: hidden + word-break: break-all
- 长文本自动换行，不会超出屏幕
- .info-label 添加 flex-shrink: 0 防止被压缩
- .info-row 添加 min-width: 0 防止 flex 子项溢出
2. 卡片顶部与 header 无间距:
- .detail-content padding 顶部从 0 改为 20rpx
3. 正文区域右侧超出:
- .full-content 添加 overflow: hidden + word-break: break-all
- Markdown 内容自动换行
|
2026-04-07 22:56:20 +08:00 |
|
|
peanut
|
8338204bcc
|
fix(mini-program): 彻底修复剧本详情页布局超出屏幕问题
根本原因:
- height: 100vh 在小程序中包含状态栏区域，导致内容超出可视范围
- CSS env(safe-area-inset-top) 和 max() 函数在 uni-app 中支持有限
修复方案:
- 改用 height: 100% 替代 100vh
- 添加独立的状态栏占位 view，高度从 App.vue 存储的全局值读取
- 移除对 CSS env() 和 max() 函数的依赖
- header 顶部 padding 改用固定值 12px
|
2026-04-07 22:26:17 +08:00 |
|
|
peanut
|
b8dc438cbe
|
fix(mini-program): 修复剧本详情页样式和内容显示问题
样式修复:
- 标题添加 flex:1 和 text-overflow: ellipsis，长文本自动省略
- 标题添加左右 margin，避免与返回按钮重叠
- 返回按钮添加 flex-shrink:0 和 z-index，确保不被压缩
内容显示修复:
- 优先读取 script.content 字段（转换后的标准格式）
- 兼容 script.plotJson.fullContent 格式（旧数据）
|
2026-04-07 22:17:39 +08:00 |
|
|
peanut
|
ae7392c37e
|
fix(mini-program): 修复剧本详情页顶部被遮挡和布局溢出问题
- 添加 overflow: hidden 防止整体页面溢出
- 使用 env(safe-area-inset-top) 适配刘海屏安全区域
- 内容区改为 overflow-y: auto 实现局部滚动
- 调整 padding 避免顶部内容被状态栏遮挡
|
2026-04-07 22:08:21 +08:00 |
|
|
peanut
|
86b3fa8f84
|
feat(mini-program): 剧本卡片支持 Markdown 渲染
实现内容:
- 扩展 Markdown 组件支持三级标题 (###) 和粗体 (**text**)
- ScriptView.vue 卡片摘要使用 Markdown 组件渲染
- 新增 ScriptDetailView.vue 剧本详情页，展示完整 Markdown 内容
- 点击卡片可跳转查看详情，"路径映射"按钮使用@click.stop 避免事件冒泡
修改文件:
- components/Markdown.vue: 添加 h3 标题、粗体解析和样式
- pages/main/ScriptView.vue: 导入 Markdown 组件，修改摘要渲染方式，添加跳转逻辑
- pages/main/ScriptDetailView.vue: 新建详情页，展示剧本完整内容
- pages.json: 注册 ScriptDetailView 页面
解决 issues: 小程序"创造未来"页面剧本内容以纯文本显示，
无法正确渲染 Markdown 格式（标题、列表、粗体等）
|
2026-04-07 21:28:44 +08:00 |
|