Skip to content

Commit a5000c5

Browse files
committed
Auto merge of #60272 - Jakst:patch-1, r=Manishearth
Explicitly set height on rust logo <img> element in docs The layout of the left side menu in docs reflows when navigating between pages because of missing height on the <img> element of rust logo. Setting height='100' tells the browser to reserve that vertical space, leading to a less janky experience.
2 parents 6afcb56 + 9db0fd7 commit a5000c5

File tree

2 files changed

+24
-5
lines changed

2 files changed

+24
-5
lines changed

src/librustdoc/html/layout.rs

+3-3
Original file line numberDiff line numberDiff line change
@@ -182,14 +182,14 @@ pub fn render<T: fmt::Display, S: fmt::Display>(
182182
let p = SlashChecker(&p);
183183
if layout.logo.is_empty() {
184184
format!("<a href='{path}index.html'>\
185-
<img src='{static_root_path}rust-logo{suffix}.png' \
186-
alt='logo' width='100'></a>",
185+
<div class='logo-container'>\
186+
<img src='{static_root_path}rust-logo{suffix}.png' alt='logo'></div></a>",
187187
path=p,
188188
static_root_path=static_root_path,
189189
suffix=page.resource_suffix)
190190
} else {
191191
format!("<a href='{}index.html'>\
192-
<img src='{}' alt='logo' width='100'></a>",
192+
<div class='logo-container'><img src='{}' alt='logo'></div></a>",
193193
p,
194194
layout.logo)
195195
}

src/librustdoc/html/static/rustdoc.css

+21-2
Original file line numberDiff line numberDiff line change
@@ -182,12 +182,25 @@ nav.sub {
182182
display: none !important;
183183
}
184184

185-
.sidebar img {
185+
.logo-container {
186+
height: 100px;
187+
width: 100px;
188+
position: relative;
186189
margin: 20px auto;
187190
display: block;
188191
margin-top: 10px;
189192
}
190193

194+
.logo-container > img {
195+
max-width: 100px;
196+
max-height: 100px;
197+
position: absolute;
198+
left: 50%;
199+
top: 50%;
200+
transform: translate(-50%, -50%);
201+
display: block;
202+
}
203+
191204
.sidebar .location {
192205
border: 1px solid;
193206
font-size: 17px;
@@ -1030,14 +1043,20 @@ h3 > .collapse-toggle, h4 > .collapse-toggle {
10301043
padding: 0;
10311044
}
10321045

1033-
.sidebar img {
1046+
.sidebar .logo-container {
10341047
width: 35px;
1048+
height: 35px;
10351049
margin-top: 5px;
10361050
margin-bottom: 5px;
10371051
float: left;
10381052
margin-left: 50px;
10391053
}
10401054

1055+
.sidebar .logo-container > img {
1056+
max-width: 35px;
1057+
max-height: 35px;
1058+
}
1059+
10411060
.sidebar-menu {
10421061
position: fixed;
10431062
z-index: 10;

0 commit comments

Comments
 (0)