doc: make version picker usable on mobile

This makes the version picker usable on mobile devices.
Previously, the version picker was difficult to select from. This
change makes the #gtoc > ul > li elements have a display
of `block` instead of `inline`.

PR-URL: https://github.com/nodejs/node/pull/39958
Reviewed-By: Luigi Pinca <luigipinca@gmail.com>
Reviewed-By: Antoine du Hamel <duhamelantoine1995@gmail.com>
Reviewed-By: Tobias Nießen <tniessen@tnie.de>
Reviewed-By: James M Snell <jasnell@gmail.com>
Reviewed-By: Derek Lewis <DerekNonGeneric@inf.is>
This commit is contained in:
Evan Lucas authored and Node.js GitHub Bot committed 2021-09-22 22:08:33 +00:00
1 parent 24cc239cad
commit c89d519528
1 file changed
+15 -13
+15 -13
View File
@@ -165,19 +165,6 @@ em code {
line-height: 1.5rem;
}
#gtoc > ul > li {
display: inline;
border-right: 1px currentColor solid;
margin-right: .4rem;
padding-right: .4rem;
}
#gtoc > ul > li:last-child {
border-right: none;
margin-right: 0;
padding-right: 0;
}
li.version-picker {
position: relative;
}
@@ -741,6 +728,21 @@ kbd {
outline: var(--brand3) dotted 2px;
}
@media only screen and (min-width: 577px) {
#gtoc > ul > li {
display: inline;
border-right: 1px currentColor solid;
margin-right: .4rem;
padding-right: .4rem;
}
#gtoc > ul > li:last-child {
border-right: none;
margin-right: 0;
padding-right: 0;
}
}
@media only screen and (max-width: 1024px) {
#content {
overflow: visible;