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

The Fields list on a phone hides the API name under its buttons

Đang mở
#263 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ó
3/5
Thời gian dự kiến
1-2 ngày
Mức phù hợp với người mới
75/100
Loại issue
Tính năng
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
css, playwright, react, typescript

Hướng nghiên cứu

Start with FieldTable and FieldTableRow in plugins/fields/frontend/FieldsScreen.tsx, then read the phone media query in frontend/src/index.css and the pinned action rule in @gopherium/godmin's src/base.css. Add the 390-pixel Playwright check in test/e2e/tests/fields-order.spec.ts and run it alongside the existing ordering check. Done means fields stack without sideways scrolling, the full API name clears the buttons, and wide-screen layout stays unchanged.

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

Mô tả

enhancement help wanted

What happens

On a phone (under 640 pixels wide), the Fields screen at /fields keeps its wide table. Contacts, Users, API tokens and Import are DataViews lists that switch to a stacked list on a phone. Fields is a plain godmin-table, so it has no phone layout.

The table is wider than the phone, so it scrolls sideways inside its region. GodMin pins the move and archive buttons to the right edge, and the API name column slides under them. In Spanish the header reads "NOMBRE EN LA AP" and the value reads "birthDat". Nothing tells the reader that the table scrolls.

Moving the list to DataViews is not the fix. DataViews cannot reorder rows by hand, and the arrows are what this screen is for.

What should happen

On a phone, each field is one stacked row with no sideways scroll:

  • the label on the first line, with the move and archive buttons at its end
  • the kind badge and any sub field labels under it
  • the API name under that, in full, wrapping when it is long

The header row hides, and each value under the label shows its column name before it. WordPress list tables do the same under 782 pixels. The first column stays, and the other columns stack below it with their names from data-colname. The Archive question that replaces the buttons fits the row too. The table on a wide screen does not change.

A new Playwright check at 390 pixels wide opens /fields with a field labelled "Preferred delivery window". It proves that the region does not scroll sideways and that the API name sits fully inside the region, clear of the buttons. fields-order.spec.ts stays green.

Where

  • plugins/fields/frontend/FieldsScreen.tsx, FieldTable and FieldTableRow: a class on the table and a column name on each cell
  • frontend/src/index.css, the @media (max-width: 639px) block
  • @gopherium/godmin src/base.css, the phone rule that pins .godmin-table__actions inside .godmin-table-scroll, which the stacked rows must turn off
  • test/e2e/tests/fields-order.spec.ts, the new phone check
Ngôn ngữ chính
Go
Star
287
Fork
64
Merge trung bình
13 giờ 24 phút
Pull request đã merge (30 ngày)
60

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

  • Có Dockerfile hoặc tệp Docker Compose
  • Không có mẫu pull request
  • Không có hướng dẫn đóng góp

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 gopherium/AlphOne

Tất cả issue của gopherium/AlphOne

Issue tương tự

Thêm issue về Go

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.