diff --git a/src/librustdoc/html/layout.rs b/src/librustdoc/html/layout.rs
index 8c5871d912647..25ca67db6491e 100644
--- a/src/librustdoc/html/layout.rs
+++ b/src/librustdoc/html/layout.rs
@@ -17,6 +17,7 @@ pub(crate) struct Layout {
pub(crate) external_html: ExternalHtml,
pub(crate) default_settings: FxHashMap,
pub(crate) krate: String,
+ pub(crate) krate_version: String,
/// The given user css file which allow to customize the generated
/// documentation theme.
pub(crate) css_file_extension: Option,
diff --git a/src/librustdoc/html/render/context.rs b/src/librustdoc/html/render/context.rs
index 97714afaa4587..62c7dbe78eca6 100644
--- a/src/librustdoc/html/render/context.rs
+++ b/src/librustdoc/html/render/context.rs
@@ -534,6 +534,7 @@ impl<'tcx> FormatRenderer<'tcx> for Context<'tcx> {
external_html,
default_settings,
krate: krate.name(tcx).to_string(),
+ krate_version: cache.crate_version.as_deref().unwrap_or_default().to_string(),
css_file_extension: extension_css,
scrape_examples_extension: !call_locations.is_empty(),
};
@@ -669,10 +670,9 @@ impl<'tcx> FormatRenderer<'tcx> for Context<'tcx> {
let blocks = sidebar_module_like(all.item_sections());
let bar = Sidebar {
- title_prefix: "Crate ",
- title: crate_name.as_str(),
+ title_prefix: "",
+ title: "",
is_crate: false,
- version: "",
blocks: vec![blocks],
path: String::new(),
};
diff --git a/src/librustdoc/html/render/sidebar.rs b/src/librustdoc/html/render/sidebar.rs
index 76f63c6f63e36..417c572fd770d 100644
--- a/src/librustdoc/html/render/sidebar.rs
+++ b/src/librustdoc/html/render/sidebar.rs
@@ -19,7 +19,6 @@ pub(super) struct Sidebar<'a> {
pub(super) title_prefix: &'static str,
pub(super) title: &'a str,
pub(super) is_crate: bool,
- pub(super) version: &'a str,
pub(super) blocks: Vec>,
pub(super) path: String,
}
@@ -99,12 +98,12 @@ pub(super) fn print_sidebar(cx: &Context<'_>, it: &clean::Item, buffer: &mut Buf
|| it.is_primitive()
|| it.is_union()
|| it.is_enum()
- || it.is_mod()
+ // crate title is displayed as part of logo lockup
+ || (it.is_mod() && !it.is_crate())
|| it.is_type_alias()
{
(
match *it.kind {
- clean::ModuleItem(..) if it.is_crate() => "Crate ",
clean::ModuleItem(..) => "Module ",
_ => "",
},
@@ -113,14 +112,12 @@ pub(super) fn print_sidebar(cx: &Context<'_>, it: &clean::Item, buffer: &mut Buf
} else {
("", "")
};
- let version =
- if it.is_crate() { cx.cache().crate_version.as_deref().unwrap_or_default() } else { "" };
let path: String = if !it.is_mod() {
cx.current.iter().map(|s| s.as_str()).intersperse("::").collect()
} else {
"".into()
};
- let sidebar = Sidebar { title_prefix, title, is_crate: it.is_crate(), version, blocks, path };
+ let sidebar = Sidebar { title_prefix, title, is_crate: it.is_crate(), blocks, path };
sidebar.render_into(buffer).unwrap();
}
diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css
index 3b23664133761..6ceb42b937950 100644
--- a/src/librustdoc/html/static/css/rustdoc.css
+++ b/src/librustdoc/html/static/css/rustdoc.css
@@ -461,19 +461,9 @@ img {
display: none !important;
}
-.sidebar .logo-container {
- margin-top: 10px;
- margin-bottom: 10px;
- text-align: center;
-}
-
-.version {
- overflow-wrap: break-word;
-}
-
.logo-container > img {
- height: 100px;
- width: 100px;
+ height: 48px;
+ width: 48px;
}
ul.block, .block li {
@@ -510,6 +500,8 @@ ul.block, .block li {
color: var(--sidebar-link-color);
}
.sidebar .current,
+.sidebar .current a,
+.sidebar-crate a.logo-container:hover + h2 a,
.sidebar a:hover:not(.logo-container) {
background-color: var(--sidebar-current-link-background-color);
}
@@ -524,6 +516,47 @@ ul.block, .block li {
overflow: hidden;
}
+.sidebar-crate {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin: 0 32px;
+ column-gap: 32px;
+ flex-wrap: wrap;
+}
+
+.sidebar-crate h2 {
+ flex-grow: 1;
+ /* This setup with the margins and row-gap is designed to make flex-wrap
+ work the way we want. If they're in the side-by-side lockup, there
+ should be a 16px margin to the left of the logo (visually the same as
+ the 24px one on everything else, which are not giant circles) and 8px
+ between it and the crate's name and version. When they're line wrapped,
+ the logo needs to have the same margin on both sides of itself (to
+ center properly) and the crate name and version need 24px on their
+ left margin. */
+ margin: 0 -8px;
+}
+
+.sidebar-crate .logo-container {
+ margin: 10px -16px;
+ text-align: center;
+}
+
+.sidebar-crate h2 a {
+ display: block;
+ margin-left: -0.25rem;
+ padding-left: 0.25rem;
+ margin-right: -24px;
+}
+
+.sidebar-crate h2 .version {
+ display: block;
+ font-weight: normal;
+ font-size: 1rem;
+ overflow-wrap: break-word;
+}
+
.mobile-topbar {
display: none;
}
diff --git a/src/librustdoc/html/static/js/main.js b/src/librustdoc/html/static/js/main.js
index 097aa0b940d93..6cf0a8f3201e3 100644
--- a/src/librustdoc/html/static/js/main.js
+++ b/src/librustdoc/html/static/js/main.js
@@ -51,8 +51,12 @@ function setMobileTopbar() {
// but with the current code it's hard to get the right information in the right place.
const mobileLocationTitle = document.querySelector(".mobile-topbar h2");
const locationTitle = document.querySelector(".sidebar h2.location");
- if (mobileLocationTitle && locationTitle) {
- mobileLocationTitle.innerHTML = locationTitle.innerHTML;
+ if (mobileLocationTitle) {
+ if (hasClass(document.body, "crate")) {
+ mobileLocationTitle.innerText = `Crate ${currentCrate}`;
+ } else if (locationTitle) {
+ mobileLocationTitle.innerHTML = locationTitle.innerHTML;
+ }
}
}
diff --git a/src/librustdoc/html/templates/page.html b/src/librustdoc/html/templates/page.html
index b4b9c31916532..a47caeaf51746 100644
--- a/src/librustdoc/html/templates/page.html
+++ b/src/librustdoc/html/templates/page.html
@@ -89,13 +89,21 @@ {# #}
{% endif %}
{# #}
diff --git a/src/librustdoc/html/templates/sidebar.html b/src/librustdoc/html/templates/sidebar.html
index 01d476ad29f2f..14a61f3643e65 100644
--- a/src/librustdoc/html/templates/sidebar.html
+++ b/src/librustdoc/html/templates/sidebar.html
@@ -6,9 +6,6 @@ {# #}