Rollup merge of rust-lang#106996 - notriddle:notriddle/settings-line-…

…div, r=GuillaumeGomez

rustdoc: instead of `.setting-name { width: 100% }`, use default div CSS

This has no discernible change in appearance.

src/librustdoc/html/static/css/settings.css

@@ -33,10 +33,6 @@
 	padding-bottom: 1px;
 }
 
-.radio-line .setting-name {
-	width: 100%;
-}
-
 .radio-line .choice {
 	margin-top: 0.1em;
 	margin-bottom: 0.1em;

src/librustdoc/html/static/js/settings.js

@@ -135,7 +135,7 @@
                 // This is a select setting.
                 output += `\
 <div class="radio-line" id="${js_data_name}">
-    <span class="setting-name">${setting_name}</span>
+    <div class="setting-name">${setting_name}</div>
 <div class="choices">`;
                 onEach(setting["options"], option => {
                     const checked = option === setting["default"] ? " checked" : "";

tests/rustdoc-gui/settings.goml

@@ -105,6 +105,33 @@ assert-css: (
         "box-shadow": "rgb(33, 150, 243) 0px 0px 1px 1px",
     },
 )
+// Now we check the setting-name for radio buttons is on a different line than the label.
+compare-elements-position-near: (
+    "#theme .setting-name",
+    "#theme .choices",
+    {"x": 1}
+)
+compare-elements-position-near-false: (
+    "#theme .setting-name",
+    "#theme .choices",
+    {"y": 1}
+)
+// Now we check that the label positions are all on the same line.
+compare-elements-position-near: (
+    "#theme .choices #theme-light",
+    "#theme .choices #theme-dark",
+    {"y": 1}
+)
+compare-elements-position-near: (
+    "#theme .choices #theme-dark",
+    "#theme .choices #theme-ayu",
+    {"y": 1}
+)
+compare-elements-position-near: (
+    "#theme .choices #theme-ayu",
+    "#theme .choices #theme-system-preference",
+    {"y": 1}
+)
 
 // First we check the "default" display for toggles.
 assert-css: (