Rollup merge of #92861 - jsha:mobile-column-flex, r=GuillaumeGomez

Rustdoc mobile: put out-of-band info on its own line

Before this, the item name and the stability, source link, and "collapse
all docs" would compete for room on a single line, resulting in awkward
wrapping behavior on mobile. This gives a separate line for that
out-of-band information. It also removes the "copy path" icon on mobile
to make a little more room.

Demo: https://rustdoc.crud.net/jsha/mobile-column-flex/std/string/struct.String.html

r? `@GuillaumeGomez`

2 files changed, 23 insertions, 6 deletions

diff --git a/src/test/rustdoc-gui/mobile.goml b/src/test/rustdoc-gui/mobile.goml
new file mode 100644
index 00000000000..acde1123925
--- /dev/null
+++ b/src/test/rustdoc-gui/mobile.goml
@@ -0,0 +1,17 @@
+// Test various properties of the mobile UI
+goto: file://|DOC_PATH|/staged_api/struct.Foo.html
+size: (400, 600)
+
+// The out-of-band info (source, stable version, collapse) should be below the
+// h1 when the screen gets narrow enough.
+assert-css: (".main-heading", {
+  "display": "flex",
+  "flex-direction": "column"
+})
+
+// Note: We can't use assert-text here because the 'Since' is set by CSS and
+// is therefore not part of the DOM.
+assert-css: (".content .out-of-band .since::before", { "content": "\"Since \"" })
+
+size: (1000, 1000)
+assert-css-false: (".content .out-of-band .since::before", { "content": "\"Since \"" })
diff --git a/src/test/rustdoc-gui/toggle-docs-mobile.goml b/src/test/rustdoc-gui/toggle-docs-mobile.goml
index 4c83fd6c0e3..e7a75b43c5a 100644
--- a/src/test/rustdoc-gui/toggle-docs-mobile.goml
+++ b/src/test/rustdoc-gui/toggle-docs-mobile.goml
@@ -1,12 +1,12 @@
 goto: file://|DOC_PATH|/test_docs/struct.Foo.html
 size: (433, 600)
 assert-attribute: (".top-doc", {"open": ""})
-click: (4, 250) // This is the position of the top doc comment toggle
+click: (4, 270) // This is the position of the top doc comment toggle
 assert-attribute-false: (".top-doc", {"open": ""})
-click: (4, 250)
+click: (4, 270)
 assert-attribute: (".top-doc", {"open": ""})
 // To ensure that the toggle isn't over the text, we check that the toggle isn't clicked.
-click: (3, 250)
+click: (3, 270)
 assert-attribute: (".top-doc", {"open": ""})
 
 // Assert the position of the toggle on the top doc block.
@@ -22,10 +22,10 @@ assert-position: (
 // Now we do the same but with a little bigger width
 size: (600, 600)
 assert-attribute: (".top-doc", {"open": ""})
-click: (4, 250) // New Y position since all search elements are back on one line.
+click: (4, 270) // New Y position since all search elements are back on one line.
 assert-attribute-false: (".top-doc", {"open": ""})
-click: (4, 250)
+click: (4, 270)
 assert-attribute: (".top-doc", {"open": ""})
 // To ensure that the toggle isn't over the text, we check that the toggle isn't clicked.
-click: (3, 250)
+click: (3, 270)
 assert-attribute: (".top-doc", {"open": ""})