Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

用户消息复制按钮导致气泡底部出现多余留白

Đang mở Phù hợp với người mới
#879 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

Chưa có ai nhận issue này.

Đánh giá

Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức phù hợp với người mới
82/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Ít trao đổi
Công nghệ
tailwindcss, typescript
Lĩnh vực
frontend

Hướng nghiên cứu

Bắt đầu với frontend/src/components/console/task/message-userinput.tsx và kiểm tra wrapper của tin nhắn người dùng, class pb-7 của nó và nút sao chép được định vị tuyệt đối. Xác minh layout cho cả tin nhắn chỉ có văn bản và tin nhắn có tệp đính kèm, bao gồm các trạng thái khi di chuột và khi focus bằng bàn phím. Hoàn tất khi hàng trống cố định biến mất trong lúc sao chép, trong khi tooltip, phản hồi trạng thái và layout của tệp đính kèm vẫn không thay đổi.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

问题描述

用户消息增加复制按钮后,消息气泡下方固定出现一整行空白,使每条对话消息整体高度增加,视觉上略显臃肿。

截图中留白位于用户消息区域内部、正文气泡下方。复制按钮默认隐藏时,这块空间仍然存在。

根因定位

frontend/src/components/console/task/message-userinput.tsx 的用户消息外层使用了 pb-7,为绝对定位在 bottom-0 的复制按钮固定预留 28px 高度。按钮处于 opacity-0 时,预留空间依然参与布局。

期望行为

  • 用户消息气泡下方不再固定占用一整行空间
  • 复制按钮仍可通过鼠标悬停和键盘聚焦访问
  • 复制、Tooltip 和成功/失败提示行为保持不变
  • 包含附件的用户消息保持正常布局

复现步骤

  1. 打开任意任务对话
  2. 查看带文本的用户消息气泡
  3. 观察正文气泡下方始终存在一整行留白
  4. 鼠标悬停后可看到该区域右侧的复制按钮

关联信息

  • 相关 PR:#861
  • 用户 UID:019d5da5-27a2-7679-b28e-f6fb5d1e78b5
Ngôn ngữ chính
TypeScript
Star
4.9k
Fork
743
Merge trung bình
14 giờ 30 phút
Pull request đã merge (30 ngày)
61

Chuẩn bị môi trường

Dự án này không cung cấp dev container, Dockerfile hay hướng dẫn đóng góp, nên bạn cần tự thiết lập môi trường: hãy bắt đầu từ README và xem hướng dẫn đóng góp lần đầu của chúng tôi để biết các bước chung.

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của chaitin/MonkeyCode

Tất cả issue của chaitin/MonkeyCode

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.