Rollup merge of #107964 - notriddle:notriddle/title-line-height, r=GuillaumeGomez

rustdoc: use tighter line height in h1 and h2

This keeps the line height for body text the same, as required by WCAG, but for headers, it makes sense to have wrapped lines be a bit tighter packed.

## Before

![image](https://user-images.githubusercontent.com/1593513/218332683-88a02467-7811-4e6b-81f8-67dded691465.png)

## After

![image](https://user-images.githubusercontent.com/1593513/218332698-a1b2a265-0658-4306-8473-b835f663172d.png)

6 files changed, 19 insertions, 11 deletions

diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css
index 2a9548712f0..4f8f00f298a 100644
--- a/src/librustdoc/html/static/css/rustdoc.css
+++ b/src/librustdoc/html/static/css/rustdoc.css
@@ -174,6 +174,14 @@ h1, h2, h3, h4 {
 .top-doc .docblock > h4 {
 	border-bottom: 1px solid var(--headings-border-bottom-color);
 }
+/* while line-height 1.5 is required for any "block of text",
+	which WCAG defines as more than one sentence, it looks weird for
+	very large main headers */
+h1, h2 {
+	line-height: 1.25;
+	padding-top: 3px;
+	padding-bottom: 9px;
+}
 h3.code-header {
 	font-size: 1.125rem; /* 18px */
 }
diff --git a/tests/rustdoc-gui/mobile.goml b/tests/rustdoc-gui/mobile.goml
index 3e444cbd6dc..8c8516ebff8 100644
--- a/tests/rustdoc-gui/mobile.goml
+++ b/tests/rustdoc-gui/mobile.goml
@@ -12,7 +12,7 @@ assert-css: (".main-heading", {
   "flex-direction": "column"
 })
 
-assert-property: (".mobile-topbar h2", {"offsetHeight": 36})
+assert-property: (".mobile-topbar h2", {"offsetHeight": 33})
 
 // Note: We can't use assert-text here because the 'Since' is set by CSS and
 // is therefore not part of the DOM.
diff --git a/tests/rustdoc-gui/scrape-examples-layout.goml b/tests/rustdoc-gui/scrape-examples-layout.goml
index 95102528ec1..dad727c7757 100644
--- a/tests/rustdoc-gui/scrape-examples-layout.goml
+++ b/tests/rustdoc-gui/scrape-examples-layout.goml
@@ -40,10 +40,10 @@ assert-property: (
 store-value: (offset_y, 4)
 
 // First with desktop
-assert-position: (".scraped-example .code-wrapper", {"y": 255})
-assert-position: (".scraped-example .code-wrapper .prev", {"y": 255 + |offset_y|})
+assert-position: (".scraped-example .code-wrapper", {"y": 253})
+assert-position: (".scraped-example .code-wrapper .prev", {"y": 253 + |offset_y|})
 
 // Then with mobile
 size: (600, 600)
-assert-position: (".scraped-example .code-wrapper", {"y": 314})
-assert-position: (".scraped-example .code-wrapper .prev", {"y": 314 + |offset_y|})
+assert-position: (".scraped-example .code-wrapper", {"y": 308})
+assert-position: (".scraped-example .code-wrapper .prev", {"y": 308 + |offset_y|})
diff --git a/tests/rustdoc-gui/search-result-display.goml b/tests/rustdoc-gui/search-result-display.goml
index 43e608228d8..20a88c36edb 100644
--- a/tests/rustdoc-gui/search-result-display.goml
+++ b/tests/rustdoc-gui/search-result-display.goml
@@ -22,7 +22,7 @@ size: (900, 900)
 
 // First we check the current width, height and position.
 assert-css: ("#crate-search", {"width": "223px"})
-assert-css: (".search-results-title", {"height": "44px", "width": "640px"})
+assert-css: (".search-results-title", {"height": "50px", "width": "640px"})
 assert-css: ("#search", {"width": "640px"})
 
 // Then we update the text of one of the `<option>`.
@@ -33,7 +33,7 @@ text: (
 
 // Then we compare again to confirm the height didn't change.
 assert-css: ("#crate-search", {"width": "527px"})
-assert-css: (".search-results-title", {"height": "44px", "width": "640px"})
+assert-css: (".search-results-title", {"height": "50px", "width": "640px"})
 // And we check that the `<select>` isn't bigger than its container (".search-results-title").
 assert-css: ("#search", {"width": "640px"})
 
diff --git a/tests/rustdoc-gui/sidebar-mobile-scroll.goml b/tests/rustdoc-gui/sidebar-mobile-scroll.goml
index 2449269b192..4442b263e9a 100644
--- a/tests/rustdoc-gui/sidebar-mobile-scroll.goml
+++ b/tests/rustdoc-gui/sidebar-mobile-scroll.goml
@@ -6,7 +6,7 @@ assert-css: (".sidebar", {"display": "block", "left": "-1000px"})
 
 // Scroll down.
 scroll-to: "//h2[@id='blanket-implementations']"
-assert-window-property: {"pageYOffset": "627"}
+assert-window-property: {"pageYOffset": "622"}
 
 // Open the sidebar menu.
 click: ".sidebar-menu-toggle"
@@ -21,11 +21,11 @@ assert-window-property: {"pageYOffset": "0"}
 // Close the sidebar menu. Make sure the scroll position gets restored.
 click: ".sidebar-menu-toggle"
 wait-for-css: (".sidebar", {"left": "-1000px"})
-assert-window-property: {"pageYOffset": "627"}
+assert-window-property: {"pageYOffset": "622"}
 
 // Now test that scrollability returns when the browser window is just resized.
 click: ".sidebar-menu-toggle"
 wait-for-css: (".sidebar", {"left": "0px"})
 assert-window-property: {"pageYOffset": "0"}
 size: (900, 600)
-assert-window-property: {"pageYOffset": "627"}
+assert-window-property: {"pageYOffset": "622"}
diff --git a/tests/rustdoc-gui/sidebar-mobile.goml b/tests/rustdoc-gui/sidebar-mobile.goml
index d5f4b619629..cc6267c3dc9 100644
--- a/tests/rustdoc-gui/sidebar-mobile.goml
+++ b/tests/rustdoc-gui/sidebar-mobile.goml
@@ -45,7 +45,7 @@ assert-property: (".mobile-topbar", {"clientHeight": "45"})
 // so the target is not obscured by the topbar.
 click: ".sidebar-menu-toggle"
 click: ".sidebar-elems section .block li > a"
-assert-position: ("#method\.must_use", {"y": 45})
+assert-position: ("#method\.must_use", {"y": 46})
 
 // Check that the bottom-most item on the sidebar menu can be scrolled fully into view.
 click: ".sidebar-menu-toggle"