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

Improve readability of sticky header in appendix #1238

Merged
merged 2 commits into from
Aug 30, 2024
Merged

Improve readability of sticky header in appendix #1238

merged 2 commits into from
Aug 30, 2024

Conversation

matthijsgroen
Copy link
Contributor

The header of the appendix table was transparent, making the text in the header hard to read when scrolling

Fixes #1110

The header of the appendix table was transparent, making the text in the header hard to read when scrolling

Fixes #1110
@matthijsgroen
Copy link
Contributor Author

@mlinksva is this something you could verify?

@mlinksva
Copy link
Contributor

This does look nicer but it appears to me only the first column is affected:

Screenshot 2024-08-29 at 08 54 15

It isn't immediately clear to me why, any idea?

@matthijsgroen
Copy link
Contributor Author

matthijsgroen commented Aug 30, 2024

It seems to be caused by:

https://github.com/github/choosealicense.com/blob/gh-pages/assets/vendor/hint.css/hint.css#L27

The position relative moves the dots out of the page flow and cause them to render on top of the sticky header.

Since this is a global stylesheet, I cannot forsee the impact of removing this position: relative for the rest of the site. It looks good without the position relative for the appendix page though.

Update: I just checked on other pages, but there the positioning of a hint following the dot will break.
They also work with really high z-index values. So I added a commit to set a z-index for this sticky header as well

It needs to be the same (or higher) than the one used in the hint.css, to have the dots in the table slide under the header.
@matthijsgroen
Copy link
Contributor Author

The z-index value is now based on

@mlinksva mlinksva closed this Aug 30, 2024
@mlinksva mlinksva reopened this Aug 30, 2024
@mlinksva
Copy link
Contributor

Tests are failing for unrelated reasons, will fix in a separate PR.

@mlinksva mlinksva merged commit e7e937b into github:gh-pages Aug 30, 2024
1 check failed
@matthijsgroen matthijsgroen deleted the patch-1 branch August 30, 2024 16:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Appendix table header is missing a background
2 participants