mirror of
https://github.com/nodejs/node.git
synced 2024-11-21 10:59:27 +00:00
doc: fix arrow vertical alignment in HTML version
This commit fixes the alignment of the bullet points (green arrow) under 'Node.js <version> documentation' by drawing a triangle in CSS instead of using an ASCII char. PR-URL: https://github.com/nodejs/node/pull/52193 Reviewed-By: Antoine du Hamel <duhamelantoine1995@gmail.com> Reviewed-By: Luigi Pinca <luigipinca@gmail.com> Reviewed-By: Moshe Atlow <moshe@atlow.co.il>
This commit is contained in:
parent
4d8602046e
commit
27493a1dd7
@ -182,27 +182,32 @@ li.picker-header {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
li.picker-header .collapsed-arrow, li.picker-header .expanded-arrow {
|
||||
width: 1.5ch;
|
||||
height: 1.5em;
|
||||
}
|
||||
|
||||
li.picker-header .collapsed-arrow {
|
||||
li.picker-header .picker-arrow {
|
||||
display: inline-block;
|
||||
width: .6rem;
|
||||
height: .6rem;
|
||||
border-top: .3rem solid transparent;
|
||||
border-bottom: .3rem solid transparent;
|
||||
border-left: .6rem solid var(--color-links);
|
||||
border-right: none;
|
||||
margin: 0 .2rem .05rem 0;
|
||||
}
|
||||
|
||||
li.picker-header .expanded-arrow {
|
||||
display: none;
|
||||
li.picker-header a:focus .picker-arrow,
|
||||
li.picker-header a:active .picker-arrow,
|
||||
li.picker-header a:hover .picker-arrow {
|
||||
border-left: .6rem solid var(--white);
|
||||
}
|
||||
|
||||
li.picker-header.expanded .collapsed-arrow,
|
||||
:root:not(.has-js) li.picker-header:hover .collapsed-arrow {
|
||||
display: none;
|
||||
}
|
||||
|
||||
li.picker-header.expanded .expanded-arrow,
|
||||
:root:not(.has-js) li.picker-header:hover .expanded-arrow {
|
||||
display: inline-block;
|
||||
li.picker-header.expanded a:focus .picker-arrow,
|
||||
li.picker-header.expanded a:active .picker-arrow,
|
||||
li.picker-header.expanded a:hover .picker-arrow,
|
||||
:root:not(.has-js) li.picker-header:hover .picker-arrow {
|
||||
border-top: .6rem solid var(--white);
|
||||
border-bottom: none;
|
||||
border-left: .35rem solid transparent;
|
||||
border-right: .35rem solid transparent;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
li.picker-header.expanded > a,
|
||||
|
@ -60,7 +60,7 @@
|
||||
__ALTDOCS__
|
||||
<li class="picker-header">
|
||||
<a href="#">
|
||||
<span class="collapsed-arrow">►</span><span class="expanded-arrow">▼</span>
|
||||
<span class="picker-arrow"></span>
|
||||
Options
|
||||
</a>
|
||||
|
||||
|
@ -528,7 +528,7 @@ function altDocs(filename, docCreated, versions) {
|
||||
return list ? `
|
||||
<li class="picker-header">
|
||||
<a href="#">
|
||||
<span class="collapsed-arrow">►</span><span class="expanded-arrow">▼</span>
|
||||
<span class="picker-arrow"></span>
|
||||
Other versions
|
||||
</a>
|
||||
<div class="picker"><ol id="alt-docs">${list}</ol></div>
|
||||
@ -558,7 +558,7 @@ function gtocPicker(id) {
|
||||
return `
|
||||
<li class="picker-header">
|
||||
<a href="#">
|
||||
<span class="collapsed-arrow">►</span><span class="expanded-arrow">▼</span>
|
||||
<span class="picker-arrow"></span>
|
||||
Index
|
||||
</a>
|
||||
|
||||
@ -575,7 +575,7 @@ function tocPicker(id, content) {
|
||||
return `
|
||||
<li class="picker-header">
|
||||
<a href="#">
|
||||
<span class="collapsed-arrow">►</span><span class="expanded-arrow">▼</span>
|
||||
<span class="picker-arrow"></span>
|
||||
Table of contents
|
||||
</a>
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user