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

doc: prevent tables from shrinking page #31859

Closed
wants to merge 1 commit into from

Conversation

davidgilbertson
Copy link
Contributor

Checklist

This change prevents tables from growing so wide that they shrink the page on mobile.

Problem (currently on https://nodejs.org/api/crypto.html):

nodejs org_dist_latest-v13 x_docs_api_crypto html(iPhone 6_7_8)

Now, on phones, table content will break if it has to, so the page loads the same width as all the other pages. The padding's a tiny bit less, too.

nodejs org_dist_latest-v13 x_docs_api_crypto html(iPhone 6_7_8) (1)

On larger screens, the first column is prevented from wrapping, since it often contains variables. Content in other columns will still wrap (note the URLs wrap, which they don't currently).

nodejs org_dist_latest-v13 x_docs_api_crypto html(iPad)

Tables on some pages (e.g. https://nodejs.org/api/crypto.html) are 
quite wide because of long content (e.g. URLs) that don't break.
With this change, cell padding is smaller on small screens, and the 
table content is allowed to break.
@nodejs-github-bot nodejs-github-bot added the doc Issues and PRs related to the documentations. label Feb 18, 2020
@lpinca
Copy link
Member

lpinca commented Feb 20, 2020

@nodejs/website

@XhmikosR
Copy link
Contributor

Refs #29692

I guess this works, although personally I'm used to overflow: auto in the parent and thus allow vertical scrolling for the table.

@davidgilbertson
Copy link
Contributor Author

Yeah that was my first thought, but I figured since the site HTML/CSS is pretty barebones, a CSS-only solution was more likely to make it through.

@BridgeAR BridgeAR added the author ready PRs that have at least one approval, no pending requests for changes, and a CI started. label Mar 9, 2020
Copy link
Member

@BridgeAR BridgeAR left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

RSLGTM

addaleax pushed a commit that referenced this pull request Mar 11, 2020
Tables on some pages (e.g. https://nodejs.org/api/crypto.html) are
quite wide because of long content (e.g. URLs) that don't break.
With this change, cell padding is smaller on small screens, and the
table content is allowed to break.

PR-URL: #31859
Reviewed-By: Luigi Pinca <luigipinca@gmail.com>
Reviewed-By: Ruben Bridgewater <ruben@bridgewater.de>
Reviewed-By: James M Snell <jasnell@gmail.com>
@addaleax
Copy link
Member

Landed in 7baadb3

@addaleax addaleax closed this Mar 11, 2020
MylesBorins pushed a commit that referenced this pull request Mar 11, 2020
Tables on some pages (e.g. https://nodejs.org/api/crypto.html) are
quite wide because of long content (e.g. URLs) that don't break.
With this change, cell padding is smaller on small screens, and the
table content is allowed to break.

PR-URL: #31859
Reviewed-By: Luigi Pinca <luigipinca@gmail.com>
Reviewed-By: Ruben Bridgewater <ruben@bridgewater.de>
Reviewed-By: James M Snell <jasnell@gmail.com>
@MylesBorins MylesBorins mentioned this pull request Mar 12, 2020
targos pushed a commit that referenced this pull request Apr 22, 2020
Tables on some pages (e.g. https://nodejs.org/api/crypto.html) are
quite wide because of long content (e.g. URLs) that don't break.
With this change, cell padding is smaller on small screens, and the
table content is allowed to break.

PR-URL: #31859
Reviewed-By: Luigi Pinca <luigipinca@gmail.com>
Reviewed-By: Ruben Bridgewater <ruben@bridgewater.de>
Reviewed-By: James M Snell <jasnell@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
author ready PRs that have at least one approval, no pending requests for changes, and a CI started. doc Issues and PRs related to the documentations.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

7 participants