rustdoc: adjust spacing and typography in header

Author: notriddle

src/librustdoc/html/render/mod.rs

@@ -2010,9 +2010,9 @@ fn render_rightside(w: &mut Buffer, cx: &Context<'_>, item: &clean::Item, render
     );
     if let Some(link) = src_href {
         if has_stability {
-            write!(rightside, " · <a class=\"src\" href=\"{link}\">source</a>")
+            write!(rightside, " · <a class=\"src\" href=\"{link}\">Source</a>")
         } else {
-            write!(rightside, "<a class=\"src rightside\" href=\"{link}\">source</a>")
+            write!(rightside, "<a class=\"src rightside\" href=\"{link}\">Source</a>")
         }
     }
     if has_stability && has_src_ref {

src/librustdoc/html/static/css/rustdoc.css

@@ -185,7 +185,7 @@ h1, h2, h3, h4 {
 	grid-template-columns: minmax(105px, 1fr) minmax(0, max-content);
 	grid-template-rows: minmax(25px, min-content) min-content min-content;
 	padding-bottom: 6px;
-	margin-bottom: 11px;
+	margin-bottom: 15px;
 }
 .rustdoc-breadcrumbs {
 	grid-area: main-heading-breadcrumbs;
@@ -1004,6 +1004,7 @@ nav.sub {
 	display: flex;
 	height: 34px;
 	flex-grow: 1;
+	margin-bottom: 4px;
 }
 .src nav.sub {
 	margin: 0 0 -10px 0;
@@ -2253,7 +2254,12 @@ in src-script.js and main.js
 
 	/* We don't display this button on mobile devices. */
 	#copy-path {
-		display: none;
+		/* display: none; avoided as a layout hack.
+			When there's one line, we get an effective line-height of 34px,
+			because that's how big the image is, but if the header wraps,
+			they're packed more tightly than that. */
+		width: 0;
+		visibility: hidden;
 	}
 
 	/* Text label takes up too much space at this size. */

src/librustdoc/html/templates/print_item.html

@@ -26,7 +26,7 @@ <h1>
         {% match src_href %}
             {% when Some with (href) %}
                 {% if !stability_since_raw.is_empty() +%} · {%+ endif %}
-                <a class="src" href="{{href|safe}}">source</a> {#+ #}
+                <a class="src" href="{{href|safe}}">Source</a> {#+ #}
             {% else %}
         {% endmatch %}
     </span> {# #}

tests/rustdoc-gui/item-info.goml

@@ -20,7 +20,7 @@ store-position: (
     {"x": second_line_x, "y": second_line_y},
 )
 assert: |first_line_x| != |second_line_x| && |first_line_x| == 516 && |second_line_x| == 272
-assert: |first_line_y| != |second_line_y| && |first_line_y| == 714 && |second_line_y| == 737
+assert: |first_line_y| != |second_line_y| && |first_line_y| == 718 && |second_line_y| == 741
 
 // Now we ensure that they're not rendered on the same line.
 set-window-size: (1100, 800)

tests/rustdoc-gui/scrape-examples-layout.goml

@@ -80,8 +80,8 @@ click: ".scraped-example .button-holder .expand"
 store-value: (offset_y, 4)
 
 // First with desktop
-assert-position: (".scraped-example", {"y": 252})
-assert-position: (".scraped-example .prev", {"y": 252 + |offset_y|})
+assert-position: (".scraped-example", {"y": 256})
+assert-position: (".scraped-example .prev", {"y": 256 + |offset_y|})
 
 // Gradient background should be at the top of the code block.
 assert-css: (".scraped-example .example-wrap::before", {"top": "0px"})
@@ -90,8 +90,8 @@ assert-css: (".scraped-example .example-wrap::after", {"bottom": "0px"})
 // Then with mobile
 set-window-size: (600, 600)
 store-size: (".scraped-example .scraped-example-title", {"height": title_height})
-assert-position: (".scraped-example", {"y": 287})
-assert-position: (".scraped-example .prev", {"y": 287 + |offset_y| + |title_height|})
+assert-position: (".scraped-example", {"y": 291})
+assert-position: (".scraped-example .prev", {"y": 291 + |offset_y| + |title_height|})
 
 define-function: (
     "check_title_and_code_position",

tests/rustdoc-gui/sidebar-source-code-display.goml

@@ -141,7 +141,7 @@ click: "#sidebar-button"
 wait-for-css: (".src .sidebar > *", {"visibility": "hidden"})
 // We scroll to line 117 to change the scroll position.
 scroll-to: '//*[@id="117"]'
-store-value: (y_offset, "2570")
+store-value: (y_offset, "2578")
 assert-window-property: {"pageYOffset": |y_offset|}
 // Expanding the sidebar...
 click: "#sidebar-button"

tests/rustdoc-gui/source-anchor-scroll.goml

@@ -8,13 +8,13 @@ set-window-size: (600, 800)
 assert-property: ("html", {"scrollTop": "0"})
 
 click: '//a[text() = "barbar" and @href="#5-7"]'
-assert-property: ("html", {"scrollTop": "200"})
+assert-property: ("html", {"scrollTop": "208"})
 click: '//a[text() = "bar" and @href="#28-36"]'
-assert-property: ("html", {"scrollTop": "231"})
+assert-property: ("html", {"scrollTop": "239"})
 click: '//a[normalize-space() = "sub_fn" and @href="#2-4"]'
-assert-property: ("html", {"scrollTop": "128"})
+assert-property: ("html", {"scrollTop": "136"})
 
 // We now check that clicking on lines doesn't change the scroll
 // Extra information: the "sub_fn" function header is on line 1.
 click: '//*[@id="6"]'
-assert-property: ("html", {"scrollTop": "128"})
+assert-property: ("html", {"scrollTop": "136"})

tests/rustdoc-gui/source-code-page.goml

@@ -89,7 +89,7 @@ assert-css: (".src-line-numbers", {"text-align": "right"})
 // do anything (and certainly not add a `#NaN` to the URL!).
 go-to: "file://" + |DOC_PATH| + "/src/test_docs/lib.rs.html"
 // We use this assert-position to know where we will click.
-assert-position: ("//*[@id='1']", {"x": 88, "y": 163})
+assert-position: ("//*[@id='1']", {"x": 88, "y": 171})
 // We click on the left of the "1" anchor but still in the "src-line-number" `<pre>`.
 click: (163, 77)
 assert-document-property: ({"URL": "/lib.rs.html"}, ENDS_WITH)
@@ -165,15 +165,15 @@ assert-css: ("nav.sub", {"flex-direction": "row"})
 // offsetTop[nav.sub form] = offsetTop[#main-content] - offsetHeight[nav.sub form] - offsetTop[nav.sub form]
 assert-position: ("nav.sub form", {"y": 15})
 assert-property: ("nav.sub form", {"offsetHeight": 34})
-assert-position: ("h1", {"y": 64})
+assert-position: ("h1", {"y": 68})
 // 15 = 64 - 34 - 15
 
 // Now do the same check on moderately-sized, tablet mobile.
 set-window-size: (700, 700)
 assert-css: ("nav.sub", {"flex-direction": "row"})
 assert-position: ("nav.sub form", {"y": 8})
 assert-property: ("nav.sub form", {"offsetHeight": 34})
-assert-position: ("h1", {"y": 50})
+assert-position: ("h1", {"y": 54})
 // 8 = 50 - 34 - 8
 
 // Check the sidebar directory entries have a marker and spacing (tablet).

tests/rustdoc/anchors.no_const_anchor.html

@@ -1 +1 @@
-<section id="associatedconstant.YOLO" class="method"><a class="src rightside" href="../src/foo/anchors.rs.html#16">source</a><h4 class="code-header">const <a href="#associatedconstant.YOLO" class="constant">YOLO</a>: <a class="primitive" href="{{channel}}/std/primitive.u32.html">u32</a></h4></section>
+<section id="associatedconstant.YOLO" class="method"><a class="src rightside" href="../src/foo/anchors.rs.html#16">Source</a><h4 class="code-header">const <a href="#associatedconstant.YOLO" class="constant">YOLO</a>: <a class="primitive" href="{{channel}}/std/primitive.u32.html">u32</a></h4></section>

tests/rustdoc/anchors.no_const_anchor2.html

@@ -1 +1 @@
-<section id="associatedconstant.X" class="associatedconstant"><a class="src rightside" href="../src/foo/anchors.rs.html#42">source</a><h4 class="code-header">pub const <a href="#associatedconstant.X" class="constant">X</a>: <a class="primitive" href="{{channel}}/std/primitive.i32.html">i32</a> = 0i32</h4></section>
+<section id="associatedconstant.X" class="associatedconstant"><a class="src rightside" href="../src/foo/anchors.rs.html#42">Source</a><h4 class="code-header">pub const <a href="#associatedconstant.X" class="constant">X</a>: <a class="primitive" href="{{channel}}/std/primitive.i32.html">i32</a> = 0i32</h4></section>