Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

When details element is open, it would be helpful to have an upward pointing triangle at the end of the text (to allow it to be closed) #10741

Open
JimLewis opened this issue Nov 4, 2024 · 4 comments
Labels
addition/proposal New features or enhancements needs implementer interest Moving the issue forward requires implementers to express interest

Comments

@JimLewis
Copy link

JimLewis commented Nov 4, 2024

What problem are you trying to solve?

We are using details element to make log files for EDA tool output human manageable. For each step in a regression run, a details element is used with the summary tag highlighting what operation was done and the rest of the details has the tool output. It is working well. The issue is when the details is opened to explore the issue, one typically scrolls through 100's of lines of text and then wants to close it after getting to the end.

What solutions exist today?

?

How would you solve it?

Add an upward pointing triangle (either automatically at or via another html element) that allows the details to be closed from the bottom of the text - rather than scrolling back up through the text.

Anything else?

Current details element has been working brilliantly - I am able to render a log file that is 100K+ lines (regression run) in seconds, where as opening a raw log file in an editor is painfully slow when it gets this long. We also use HTML summary files (similar to JUint XML) to help identify failing tests, however, when investigating test failures, having the detailed test output in an html based log file has been helpful.

@JimLewis JimLewis added addition/proposal New features or enhancements needs implementer interest Moving the issue forward requires implementers to express interest labels Nov 4, 2024
@nektro
Copy link

nektro commented Nov 4, 2024

adding position: sticky; top: 0; to the <summary> may approach the experience you're looking for

@JimLewis
Copy link
Author

JimLewis commented Nov 5, 2024

@nektro That certainly does something. Having it float on top of other text is a really disorienting at best - mostly unreadable when layered over other text.

OTOH, demarking the end of the details would be better - and more clear as to where it ends and where the next independent text begins.

@JimLewis
Copy link
Author

JimLewis commented Nov 5, 2024

It can be made readable if the colors are adjusted when "details[open" - this removes the disorientation with the text overlay ...

It still would be better with an end marker.

@nektro
Copy link

nektro commented Nov 5, 2024

mostly unreadable when layered over other text.

i didnt include it in my last message because i didnt want to be prescriptive about the existing style of your page, but you likely also need to set a background-color, border, and/or padding, margin, etc to make it look nice and cohesive with your styles

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
addition/proposal New features or enhancements needs implementer interest Moving the issue forward requires implementers to express interest
Development

No branches or pull requests

2 participants