patternfly / patternfly/patternfly-react
Scrollable areas - add dynamic shadows based on scroll position
Chưa có ai nhận issue này.
- Ngôn ngữ chính
- TypeScript
- Star
- 862
- Fork
- 392
- Merge trung bình
- 4 ngày 8 giờ
- Pull request đã merge (30 ngày)
- 9
Mô tả
From @jamestalton, I wanted to create an issue to track a request I've heard from James a few times. It would be super cool if PF was able to add shadows to scrollable regions dynamically. A good example we could currently work with is scrollable page sections. You designate a page section as .pf-m-overflow-scroll, and by default, it looks like any other page section. However, if its content is taller than the section, it will automatically add a scrollbar and the content becomes scrollable. PF could detected that there is overflow and added a shadow dynamically. Currently users can add shadows themselves by adding .pf-m-shadow-bottom (one for a top shadow, too) to the preceding page section, but that class adds a static shadow. If you add it because the section below has the potential to scroll, but doesn't scroll because there is no overflow content, the shadow appears unnecessarily.
Some questions:
-
Currently a user could wire this up themselves, but should PF provide this ability?
-
Would this be enabled for all scrollable regions? Sounds like that has the potential to create a lot of work to implement/maintain.
-
Is there any kind of performance cost?
-
Are there other cases for dynamic shadows - for example, adding a shadow only once you've scrolled a little bit? What's the LEO for that and does it come with performance costs?
Anything else you'd like to add @jamestalton?
Jira Issue: PF-1775
Hướng dẫn đóng góp
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- 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.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Hướng nghiên cứu
Bắt đầu với bản demo overflow-scroll của các phần trang có thể cuộn được liên kết và xem xét cách .pf-m-overflow-scroll và .pf-m-shadow-bottom hiện đang hoạt động. Làm rõ liệu các bóng động nên được áp dụng rộng rãi hay chỉ cho các phần trang, bao gồm các kỳ vọng về hiệu năng và các trạng thái cuộn mong muốn. Được xem là hoàn tất khi phạm vi và hành vi đã được thống nhất trước khi bắt đầu triển khai.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Đánh giá
- Công nghệ
- css, react, typescript
- Lĩnh vực
- design, frontend
- Loại issue
- Tính năng
- Độ khó
- 5/5
- Thời gian dự kiến
- Hơn một tuần
- Mức độ hoạt động
- Ít trao đổi
- Độ rõ ràng
- Cần làm rõ
- Mức phù hợp với người mới
- 30/100