Rollup merge of #102799 - rol1510:issue-100421-fix, r=notriddle
rustdoc: remove hover gap in file picker Fixes #100421 Before: <img width="385" alt="image" src="https://user-images.githubusercontent.com/29011024/194677087-fda2db3e-126d-47cf-8152-c554e3c25a54.png"> After: <img width="388" alt="image" src="https://user-images.githubusercontent.com/29011024/194676774-7a50ace9-4060-492e-849a-ad85d9132630.png"> longe module names also wrap nicely: <img width="389" alt="image" src="https://user-images.githubusercontent.com/29011024/194678516-f2497b3a-8d50-439b-9d69-3fa9fb43b84d.png"> Also if you zoom out very far, the arrows did move to the left, in relation to the text below. This is now also fixed. <img width="818" alt="image" src="https://user-images.githubusercontent.com/29011024/194677652-cfdf129d-f5db-4f26-ac3c-3d0853e89619.png"> CSS doesn't have a lot of controll over the `::marker` element, so now the `::after` element is used to draw the arrows. Now the whole line is clickable wihtout gaps.
This commit is contained in:
commit
fb27d01922
1 changed files with 22 additions and 1 deletions
|
@ -1494,10 +1494,31 @@ details.dir-entry {
|
|||
padding-left: 4px;
|
||||
}
|
||||
|
||||
details.dir-entry > summary::after {
|
||||
content: " ►";
|
||||
position: absolute;
|
||||
left: -15px;
|
||||
top: 0px;
|
||||
font-size: 80%;
|
||||
padding: 2px 0px;
|
||||
/* set width to cover gap between arrow and text */
|
||||
width: 25px;
|
||||
}
|
||||
|
||||
details[open].dir-entry > summary::after {
|
||||
content: " ▼";
|
||||
}
|
||||
|
||||
details.dir-entry > summary::-webkit-details-marker,
|
||||
details.dir-entry > summary::marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
details.dir-entry > summary {
|
||||
margin: 0 0 0 13px;
|
||||
list-style-position: outside;
|
||||
list-style: none;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
details.dir-entry div.folders, details.dir-entry div.files {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue