rustdoc: click target for sidebar items flush left

This commit is contained in:
Michael Howell 2024-07-01 17:08:49 -07:00
parent cf2df68d1f
commit 5fc30b857c
2 changed files with 14 additions and 5 deletions

View file

@ -15,6 +15,7 @@
--desktop-sidebar-width: 200px;
--src-sidebar-width: 300px;
--desktop-sidebar-z-index: 100;
--sidebar-elems-left-padding: 24px;
}
/* See FiraSans-LICENSE.txt for the Fira Sans license. */
@ -559,8 +560,11 @@ ul.block, .block li {
.sidebar > h2 a {
display: block;
padding: 0.25rem; /* 4px */
margin-left: -0.25rem;
margin-right: 0.25rem;
/* extend click target to far edge of screen (mile wide bar) */
border-left: solid var(--sidebar-elems-left-padding) transparent;
margin-left: calc(-0.25rem - var(--sidebar-elems-left-padding));
background-clip: padding-box;
}
.sidebar h2 {
@ -578,7 +582,7 @@ ul.block, .block li {
.sidebar-elems,
.sidebar > .version,
.sidebar > h2 {
padding-left: 24px;
padding-left: var(--sidebar-elems-left-padding);
}
.sidebar a {
@ -632,13 +636,17 @@ ul.block, .block li {
.sidebar-crate .logo-container {
/* The logo is expected to have 8px "slop" along its edges, so we can optically
center it. */
margin: 0 -16px 0 -16px;
margin: 0 calc(-16px - var(--sidebar-elems-left-padding));
padding: 0 var(--sidebar-elems-left-padding);
text-align: center;
}
.sidebar-crate h2 a {
display: block;
margin: 0 calc(-24px + 0.25rem) 0 -0.2rem;
/* extend click target to far edge of screen (mile wide bar) */
border-left: solid var(--sidebar-elems-left-padding) transparent;
background-clip: padding-box;
margin: 0 calc(-24px + 0.25rem) 0 calc(-0.2rem - var(--sidebar-elems-left-padding));
/* Align the sidebar crate link with the search bar, which have different
font sizes.

View file

@ -3,8 +3,9 @@
go-to: "file://" + |DOC_PATH| + "/huge_logo/index.html"
set-window-size: (1280, 1024)
// offsetWidth = width of sidebar + left and right margins
assert-property: (".sidebar-crate .logo-container", {"offsetWidth": "96", "offsetHeight": 48})
// offsetWidth = width of sidebar
assert-property: (".sidebar-crate .logo-container", {"offsetWidth": "48", "offsetHeight": 48})
assert-property: (".sidebar-crate .logo-container img", {"offsetWidth": "48", "offsetHeight": 48})
set-window-size: (400, 600)