hera/oil-formula-calculator
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

右上角用户界面和顶部界面 #9

New Issue
Closed
opened 2026-04-07 22:46:00 +00:00 by hera · 3 comments
hera commented 2026-04-07 22:46:00 +00:00
Owner
Copy Link
  1. 下滑的时候，顶部的配方查询那一行一直显示
  2. 右上角不显示“查看者”这样的权限身份，在我的账户页面里面也不显示
  3. 去主分支参考一下上传二维码页面的布局，做成一模一样的，尤其是预览图
  4. 累加到pr5
1. 下滑的时候，顶部的配方查询那一行一直显示 2. 右上角不显示“查看者”这样的权限身份，在我的账户页面里面也不显示 3. 去主分支参考一下上传二维码页面的布局，做成一模一样的，尤其是预览图 4. 累加到pr5
yoyo commented 2026-04-07 22:46:01 +00:00
Collaborator
Copy Link

推送完成，改动已累加到 PR #5。

三项修复做了什么：

① 顶部导航栏 sticky

  • CSS 里 .nav-tabs 已有 position:sticky; top:0，但在预览环境（pr-X.oil.oci.euphon.net）橙色 banner 也 sticky 在 top:0、z-index 更高，会把导航栏压住。
  • 修复：isPreview 为 true 时将 nav-tabs 的 top 设为 36px，刚好错开 banner 高度。

② 右上角 + 账户页显示权限身份

  • App.vue 头部现在会在用户名旁边显示半透明白色小徽章（查看者 / 编辑 / 管理员等）。
  • MyDiary.vue 账户页的角色字段由灰色 form-static 换成绿色渐变徽章（与 UserMenu 下拉里的样式一致）。

③ QR 上传预览布局

  • 上传区改为 120×120 居中方形（与"二维码链接"那行自动生成的 QR 预览完全一致）。
  • 上传后的图片直接复用 .qr-img 样式（有圆角和细边框），不再是大虚线框里的小缩略图。
推送完成，改动已累加到 PR #5。 --- 三项修复做了什么： **① 顶部导航栏 sticky** - CSS 里 `.nav-tabs` 已有 `position:sticky; top:0`，但在预览环境（`pr-X.oil.oci.euphon.net`）橙色 banner 也 sticky 在 `top:0`、z-index 更高，会把导航栏压住。 - 修复：`isPreview` 为 true 时将 nav-tabs 的 `top` 设为 `36px`，刚好错开 banner 高度。 **② 右上角 + 账户页显示权限身份** - `App.vue` 头部现在会在用户名旁边显示半透明白色小徽章（查看者 / 编辑 / 管理员等）。 - `MyDiary.vue` 账户页的角色字段由灰色 `form-static` 换成绿色渐变徽章（与 UserMenu 下拉里的样式一致）。 **③ QR 上传预览布局** - 上传区改为 `120×120` 居中方形（与"二维码链接"那行自动生成的 QR 预览完全一致）。 - 上传后的图片直接复用 `.qr-img` 样式（有圆角和细边框），不再是大虚线框里的小缩略图。
hera commented 2026-04-08 19:41:15 +00:00
Author
Owner
Copy Link
  1. 查看者等权限身份不要在任何地方显示
  2. 上传二维码等图片的页面布局去参考initial commit的布局，做成一模一样的
1. 查看者等权限身份不要在任何地方显示 2. 上传二维码等图片的页面布局去参考initial commit的布局，做成一模一样的
yoyo commented 2026-04-08 19:41:16 +00:00
Collaborator
Copy Link

推送成功，已累加到 PR #5。

两处改动：

① 全面移除权限身份显示

  • App.vue：右上角用户名旁的徽章（查看者/编辑/管理员）已删除
  • UserMenu.vue：下拉菜单里的 .role-badge 行已删除
  • MyDiary.vue：账号设置页的"角色"字段已删除

② QR上传布局还原为 initial commit 样式

  • 去掉了外层 .qr-preview 包裹和 .qr-upload-area 的 120×120 方框限制
  • 图片类名改回 upload-preview qr-upload-preview（与 logo/背景上传风格一致）
  • 提示文字改回"📲 点击上传二维码图片"
  • 补回 .qr-upload-preview { max-width: 120px; max-height: 120px } CSS
推送成功，已累加到 PR #5。 --- **两处改动：** **① 全面移除权限身份显示** - `App.vue`：右上角用户名旁的徽章（查看者/编辑/管理员）已删除 - `UserMenu.vue`：下拉菜单里的 `.role-badge` 行已删除 - `MyDiary.vue`：账号设置页的"角色"字段已删除 **② QR上传布局还原为 initial commit 样式** - 去掉了外层 `.qr-preview` 包裹和 `.qr-upload-area` 的 120×120 方框限制 - 图片类名改回 `upload-preview qr-upload-preview`（与 logo/背景上传风格一致） - 提示文字改回"📲 点击上传二维码图片" - 补回 `.qr-upload-preview { max-width: 120px; max-height: 120px }` CSS
hera closed this issue 2026-04-08 22:09:32 +00:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
No items
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
yoyo hera
No Assignees
2 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: hera/oil-formula-calculator#9
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?