Skip to content

doc: improve scrolling, various CSS tweaks - #5198

Closed
silverwind wants to merge 4 commits into
nodejs:masterfrom
silverwind:doc-fixes
Closed

doc: improve scrolling, various CSS tweaks#5198
silverwind wants to merge 4 commits into
nodejs:masterfrom
silverwind:doc-fixes

Conversation

@silverwind

@silverwindsilverwind commented Feb 11, 2016

Copy link
Copy Markdown
Contributor
  • Made scrolling of the sidebar not affect the main page by using a combination of overflow:hidden and overflow:scroll.
  • Changed the scrollbar of the sidebar to be visible again for accessibilty reasons and removed the indication gradient because it was causing too much issues.
  • In WebKit-based browsers, the scrollbar received custom styling making it appear to be outside of the sidebar.
  • The main content is no longer limited to 702px width, but now uses all available space.
  • Changed the background of the code blocks to a very similar, but neutral color and made inline blocks the same color.
  • Made inline code blocks inside italic sections not italic.
  • Simplified styling of api_stability classes by introducing a common class name for the stability levels.
  • Fixed various issues related to the green hover background on links.
  • Fixed code box overflow outside the main content area.
  • Various minor tweaks to paddings and margins.
  • Cleaned up numbers in the stylesheet, removing unnecessary units, decimals and empty selectors.

ref: nodejs/nodejs.org#513
cc: @nodejs/website @chrisdickinson @dkfiresky

@silverwind
doc: improve scrolling, various CSS tweaks
e7cf4a4
- Made scrolling of the sidebar not affect the main page by using a
a combination of overflow:hidden and overflow:scroll.
- Changed the scrollbar of the sidebar to be visible again for
accessibilty reason and removed the indication gradient because it
was causing too much issues.
- The main content is no longer limited to 702px, but now uses all
available space.
- In WebKit based browsers, the scrollbar received custom styling
making it appear to be outside of the sidebar.
- Changed the background of the code blocks to a neutral color and
made inline blocks the same color.
- Made inline code blocks inside italic sections not italic.
- Simplified styling of api_stability classes by introducing a common
class name for the stability levels.
- Fixed various issues related to the green hover background on links.
- Various minor tweaks to paddings and margins.
- Cleaned up numbers in CSS, removing unnecessary units an decimals.
@silverwindsilverwind added doc Issues and PRs related to the documentations. lts-watch-v4.x labels Feb 11, 2016
@silverwindsilverwind mentioned this pull request Feb 11, 2016
Closed
@ghost

ghost commented Feb 11, 2016

Copy link
Copy Markdown

👍

@jasnell

jasnell commented Feb 11, 2016

Copy link
Copy Markdown
Member

LGTM

@silverwind

silverwind commented Feb 11, 2016

Copy link
Copy Markdown
ContributorAuthor

Did a few more tweaks to types, removing some redundant styles and the double padding.

I'm thinking about changing the link color to #6ea400 as has been suggested in nodejs/nodejs.org#501.

@silverwind

silverwind commented Feb 12, 2016

Copy link
Copy Markdown
ContributorAuthor

Okay I'm confident that should be good to land now. I'd say we defer a color change until nodejs/nodejs.org#501 is resolved.

@silverwind

silverwind commented Feb 13, 2016

Copy link
Copy Markdown
ContributorAuthor

Fixed type font size to be in line with monospace text.

I'll land tomorrow unless there are objections.

silverwind added a commit that referenced this pull request Feb 14, 2016
@silverwind
doc: improve scrolling, various CSS tweaks
3add7a7
- Made scrolling of the sidebar not affect the main page by using a combination
of overflow:hidden and overflow:scroll.
- Changed the scrollbar of the sidebar to be visible again for accessibilty
reasons and removed the indication gradient because it was causing too much
issues.
- In WebKit-based browsers, the scrollbar received custom styling making it
appear to be outside of the sidebar.
- The main content is no longer limited to 702px width, but now uses all
available space.
- Changed the background of the code blocks to a very similar, but neutral
color and made inline blocks the same color.
- Made inline code blocks inside italic sections not italic.
- Simplified styling of api_stability classes by introducing a common class
name for the stability levels.
- Fixed various issues related to the green hover background on links.
- Fixed code box overflow outside the main content area.
- Various minor tweaks to paddings and margins.
- Cleaned up numbers in the stylesheet, removing unnecessary units, decimals
and empty selectors.
PR-URL: #5198
Reviewed-By: James M Snell <jasnell@gmail.com>
@silverwind

silverwind commented Feb 14, 2016

Copy link
Copy Markdown
ContributorAuthor

Landed in 3add7a7.

@nodejs/lts hopefully this can be backported soon so, so we don't end up in situations where the docs have different styling, like it happened with 5.6.0 / 4.3.0.

@rvagg

rvagg commented Feb 15, 2016

Copy link
Copy Markdown
Member

+1 for fast-tracking this to v4.x

rvagg pushed a commit that referenced this pull request Feb 15, 2016
@silverwind@rvagg
doc: improve scrolling, various CSS tweaks
a6aaf2c
- Made scrolling of the sidebar not affect the main page by using a combination
of overflow:hidden and overflow:scroll.
- Changed the scrollbar of the sidebar to be visible again for accessibilty
reasons and removed the indication gradient because it was causing too much
issues.
- In WebKit-based browsers, the scrollbar received custom styling making it
appear to be outside of the sidebar.
- The main content is no longer limited to 702px width, but now uses all
available space.
- Changed the background of the code blocks to a very similar, but neutral
color and made inline blocks the same color.
- Made inline code blocks inside italic sections not italic.
- Simplified styling of api_stability classes by introducing a common class
name for the stability levels.
- Fixed various issues related to the green hover background on links.
- Fixed code box overflow outside the main content area.
- Various minor tweaks to paddings and margins.
- Cleaned up numbers in the stylesheet, removing unnecessary units, decimals
and empty selectors.
PR-URL: #5198
Reviewed-By: James M Snell <jasnell@gmail.com>
@MylesBorins

MylesBorins commented Feb 18, 2016

Copy link
Copy Markdown
Contributor

Blocked by #4741 for landing in v4.x

MylesBorins pushed a commit that referenced this pull request Feb 22, 2016
@silverwindMyles Borins
doc: improve scrolling, various CSS tweaks
5149575
- Made scrolling of the sidebar not affect the main page by using a combination
of overflow:hidden and overflow:scroll.
- Changed the scrollbar of the sidebar to be visible again for accessibilty
reasons and removed the indication gradient because it was causing too much
issues.
- In WebKit-based browsers, the scrollbar received custom styling making it
appear to be outside of the sidebar.
- The main content is no longer limited to 702px width, but now uses all
available space.
- Changed the background of the code blocks to a very similar, but neutral
color and made inline blocks the same color.
- Made inline code blocks inside italic sections not italic.
- Simplified styling of api_stability classes by introducing a common class
name for the stability levels.
- Fixed various issues related to the green hover background on links.
- Fixed code box overflow outside the main content area.
- Various minor tweaks to paddings and margins.
- Cleaned up numbers in the stylesheet, removing unnecessary units, decimals
and empty selectors.
PR-URL: #5198
Reviewed-By: James M Snell <jasnell@gmail.com>
@MylesBorins

MylesBorins commented Feb 22, 2016

Copy link
Copy Markdown
Contributor

@rvagg will be in next 4.4 rc

MylesBorins pushed a commit that referenced this pull request Feb 22, 2016
@silverwindMyles Borins
doc: improve scrolling, various CSS tweaks
464636b
- Made scrolling of the sidebar not affect the main page by using a combination
of overflow:hidden and overflow:scroll.
- Changed the scrollbar of the sidebar to be visible again for accessibilty
reasons and removed the indication gradient because it was causing too much
issues.
- In WebKit-based browsers, the scrollbar received custom styling making it
appear to be outside of the sidebar.
- The main content is no longer limited to 702px width, but now uses all
available space.
- Changed the background of the code blocks to a very similar, but neutral
color and made inline blocks the same color.
- Made inline code blocks inside italic sections not italic.
- Simplified styling of api_stability classes by introducing a common class
name for the stability levels.
- Fixed various issues related to the green hover background on links.
- Fixed code box overflow outside the main content area.
- Various minor tweaks to paddings and margins.
- Cleaned up numbers in the stylesheet, removing unnecessary units, decimals
and empty selectors.
PR-URL: #5198
Reviewed-By: James M Snell <jasnell@gmail.com>
stefanmb pushed a commit to stefanmb/node that referenced this pull request Feb 23, 2016
@silverwind@stefanmb
doc: improve scrolling, various CSS tweaks
1523267
- Made scrolling of the sidebar not affect the main page by using a combination
of overflow:hidden and overflow:scroll.
- Changed the scrollbar of the sidebar to be visible again for accessibilty
reasons and removed the indication gradient because it was causing too much
issues.
- In WebKit-based browsers, the scrollbar received custom styling making it
appear to be outside of the sidebar.
- The main content is no longer limited to 702px width, but now uses all
available space.
- Changed the background of the code blocks to a very similar, but neutral
color and made inline blocks the same color.
- Made inline code blocks inside italic sections not italic.
- Simplified styling of api_stability classes by introducing a common class
name for the stability levels.
- Fixed various issues related to the green hover background on links.
- Fixed code box overflow outside the main content area.
- Various minor tweaks to paddings and margins.
- Cleaned up numbers in the stylesheet, removing unnecessary units, decimals
and empty selectors.
PR-URL: nodejs#5198
Reviewed-By: James M Snell <jasnell@gmail.com>
MylesBorins pushed a commit that referenced this pull request Mar 2, 2016
@silverwindMyles Borins
doc: improve scrolling, various CSS tweaks
5ed26f3
- Made scrolling of the sidebar not affect the main page by using a combination
of overflow:hidden and overflow:scroll.
- Changed the scrollbar of the sidebar to be visible again for accessibilty
reasons and removed the indication gradient because it was causing too much
issues.
- In WebKit-based browsers, the scrollbar received custom styling making it
appear to be outside of the sidebar.
- The main content is no longer limited to 702px width, but now uses all
available space.
- Changed the background of the code blocks to a very similar, but neutral
color and made inline blocks the same color.
- Made inline code blocks inside italic sections not italic.
- Simplified styling of api_stability classes by introducing a common class
name for the stability levels.
- Fixed various issues related to the green hover background on links.
- Fixed code box overflow outside the main content area.
- Various minor tweaks to paddings and margins.
- Cleaned up numbers in the stylesheet, removing unnecessary units, decimals
and empty selectors.
PR-URL: #5198
Reviewed-By: James M Snell <jasnell@gmail.com>
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

docIssues and PRs related to the documentations.

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

4 participants

@silverwind@jasnell@rvagg@MylesBorins