From 54089e6390e4dd179f35438bd46099fb09854427 Mon Sep 17 00:00:00 2001
From: Michael Howell <michael@notriddle.com>
Date: Tue, 17 Jan 2023 11:49:36 -0700
Subject: [PATCH 1/2] rustdoc: instead of `.setting-name { width: 100% }`, use
 default div CSS

---
 src/librustdoc/html/static/css/settings.css | 4 ----
 src/librustdoc/html/static/js/settings.js   | 2 +-
 2 files changed, 1 insertion(+), 5 deletions(-)

diff --git a/src/librustdoc/html/static/css/settings.css b/src/librustdoc/html/static/css/settings.css
index 91419093147..3fa47875173 100644
--- a/src/librustdoc/html/static/css/settings.css
+++ b/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;
diff --git a/src/librustdoc/html/static/js/settings.js b/src/librustdoc/html/static/js/settings.js
index 9ed8f63610f..84df1b7d391 100644
--- a/src/librustdoc/html/static/js/settings.js
+++ b/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" : "";

From a242a2c6ade769b4986dff36c8d62cb22db59f75 Mon Sep 17 00:00:00 2001
From: Michael Howell <michael@notriddle.com>
Date: Tue, 17 Jan 2023 12:09:38 -0700
Subject: [PATCH 2/2] rustdoc: add test cases for settings radio button layout

---
 tests/rustdoc-gui/settings.goml | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)

diff --git a/tests/rustdoc-gui/settings.goml b/tests/rustdoc-gui/settings.goml
index f236dc3e0fe..72de41e41ba 100644
--- a/tests/rustdoc-gui/settings.goml
+++ b/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: (