Rollup merge of #135998 - GuillaumeGomez:fix-trait-items-mobile-indent, r=notriddle

[rustdoc] Fix indent of trait items on mobile

Before:

![Screenshot From 2025-01-24 15-38-53](https://github.com/user-attachments/assets/f7738ff8-92b6-4aca-8a66-2d3618c54572)

After:

![Screenshot From 2025-01-24 15-38-37](https://github.com/user-attachments/assets/0a19dc7e-dddd-4cd5-b087-1915e152d7c1)

Seems like we forgot them when we did #131718. Can be tested [here](https://rustdoc.crud.net/imperio/fix-trait-items-mobile-indent/foo/trait.T.html).

r? `@notriddle`

Author: matthiaskrgr

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

@@ -2166,7 +2166,8 @@ details.toggle > summary:not(.hideme)::before {
 	top: 4px;
 }
 
-.impl-items > details.toggle > summary:not(.hideme)::before {
+.impl-items > details.toggle > summary:not(.hideme)::before,
+#main-content > .methods > details.toggle > summary:not(.hideme)::before {
 	position: absolute;
 	left: -24px;
 }
@@ -2176,7 +2177,9 @@ details.toggle > summary:not(.hideme)::before {
 .impl-items > *:not(.item-info),
 /* We also indent the first top doc comment the same to still keep an indent on the
 	doc block while aligning it with the impl block items. */
-.implementors-toggle > .docblock {
+.implementors-toggle > .docblock,
+/* We indent trait items as well. */
+#main-content > .methods > :not(.item-info) {
 	margin-left: var(--impl-items-indent);
 }
 
@@ -2508,7 +2511,8 @@ in src-script.js and main.js
 		margin-left: 10px;
 	}
 
-	.impl-items > details.toggle > summary:not(.hideme)::before {
+	.impl-items > details.toggle > summary:not(.hideme)::before,
+	#main-content > .methods > details.toggle > summary:not(.hideme)::before {
 		left: -20px;
 	}
 

tests/rustdoc-gui/search-tab.goml

@@ -78,7 +78,7 @@ call-function: ("check-colors", {
 set-window-size: (851, 600)
 
 // Check the size and count in tabs
-assert-text: ("#search-tabs > button:nth-child(1) > .count", " (26) ")
+assert-text: ("#search-tabs > button:nth-child(1) > .count", " (27) ")
 assert-text: ("#search-tabs > button:nth-child(2) > .count", " (7)  ")
 assert-text: ("#search-tabs > button:nth-child(3) > .count", " (0)  ")
 store-property: ("#search-tabs > button:nth-child(1)", {"offsetWidth": buttonWidth})

tests/rustdoc-gui/src/test_docs/lib.rs

@@ -691,3 +691,25 @@ impl ImplDoc {
 impl ImplDoc {
     pub fn bar5() {}
 }
+
+pub trait ItemsTrait {
+    /// You want doc, here is doc!
+    ///
+    /// blablala
+    type F;
+
+    /// You want doc, here is doc!
+    ///
+    /// blablala
+    const X: u32;
+
+    /// You want doc, here is doc!
+    ///
+    /// blablala
+    fn foo() {}
+
+    /// You want doc, here is doc!
+    ///
+    /// blablala
+    fn bar();
+}

tests/rustdoc-gui/toggle-docs-mobile.goml

@@ -31,3 +31,29 @@ 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, 270)
 assert-attribute: (".top-doc", {"open": ""})
+
+// Same check on trait items.
+fail-on-request-error: false // To prevent downloads errors on "trait.impl/test_docs/trait.ItemsTrait.js"
+go-to: "file://" + |DOC_PATH| + "/test_docs/trait.ItemsTrait.html"
+
+define-function: (
+    "check-trait-item",
+    [nth, text],
+    block {
+        store-value: (selector, ".methods:nth-of-type(" + |nth| + ") > details summary")
+        assert-text: (|selector| + " h4", |text|)
+        assert-position: (
+            |selector| + "::before",
+            {"x": 6},
+        )
+    },
+)
+
+// Assert the position of the toggle on an associated const.
+call-function: ("check-trait-item", {"nth": 2, "text": "const X: u32"})
+// Assert the position of the toggle on an associated type.
+call-function: ("check-trait-item", {"nth": 3, "text": "type F"})
+// Assert the position of the toggle on an associated required method.
+call-function: ("check-trait-item", {"nth": 4, "text": "fn bar()"})
+// Assert the position of the toggle on an associated provided method.
+call-function: ("check-trait-item", {"nth": 5, "text": "fn foo()"})