From c63aa07fb888f8ad4ad4b7ee2e59cf7fecd8477e Mon Sep 17 00:00:00 2001
From: Abdessamad Derraz <3028866+Abdess@users.noreply.github.com>
Date: Tue, 27 Oct 2026 21:02:19 +0100
Subject: [PATCH] fix: give the setup list the site's select arrow

The install box's select had a rule of its own that dropped the arrow
and read as a text field. It now takes the shared select rule and
--rb-select-arrow in both themes.
---
 tests/test_site_density_cards.py | 26 ++++++++++++++++++++++++++
 website/src/styles/retrobios.css | 12 ++----------
 2 files changed, 28 insertions(+), 10 deletions(-)

diff --git a/tests/test_site_density_cards.py b/tests/test_site_density_cards.py
index 6d924ad31..adf141516 100644
--- a/tests/test_site_density_cards.py
+++ b/tests/test_site_density_cards.py
@@ -228,6 +228,32 @@ class AnInstallBoxShowsOneCommand(unittest.TestCase):
         self.assertEqual(text.count("install.sh | sh"), 3)
 
 
+class TheSetupListLooksLikeAList(unittest.TestCase):
+    """The setup list had a rule of its own without the arrow, and read as
+    a text field at 390 and 1440 px."""
+
+    def test_the_select_takes_the_site_arrow(self) -> None:
+        css = (REPO_ROOT / "website" / "src" / "styles" / "retrobios.css").read_text(encoding="utf-8")
+        shared = re.search(r"\.sl-markdown-content select \{([^}]*)\}", css)
+        self.assertIsNotNone(shared)
+        self.assertIn("appearance: none", shared.group(1))
+        self.assertIn("var(--rb-select-arrow)", shared.group(1))
+        # No rule for the install box's select overrides it.
+        self.assertNotRegex(css, r"rb-install-setup select")
+        # The arrow is defined for both themes.
+        self.assertEqual(len(re.findall(r"--rb-select-arrow:", css)), 2)
+        # The box's select sits in Markdown content, where the shared rule applies.
+        box = "\n".join(gs._console_install_block("PlayStation Portable", PAIRS))
+        self.assertIn('<label class="rb-install-setup">Your setup <select>', box)
+
+    def test_the_built_select_shows_the_arrow(self) -> None:
+        if not (DIST / "systems").is_dir():
+            self.skipTest("no built site")
+        css = "".join(path.read_text(encoding="utf-8") for path in (DIST / "_astro").glob("*.css"))
+        self.assertNotIn("rb-install-setup select", css)
+        self.assertRegex(css, r"\.sl-markdown-content select\{[^}]*--rb-select-arrow")
+
+
 class TheScriptWiresBoth(unittest.TestCase):
     def test_pickers_and_copy_buttons_run(self) -> None:
         source = SITE_TS.read_text(encoding="utf-8")
diff --git a/website/src/styles/retrobios.css b/website/src/styles/retrobios.css
index 186d12d6e..4459005c6 100644
--- a/website/src/styles/retrobios.css
+++ b/website/src/styles/retrobios.css
@@ -574,16 +574,8 @@ body:has(.rb-sys-file, .rb-file-entry) { --sl-content-width: var(--rb-grid-width
    of every command, which wraps anywhere rather than scroll a phone. */
 .sl-markdown-content .rb-install-all code { overflow-wrap: anywhere; }
 .sl-markdown-content .rb-install-setup { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; font-size: 0.9rem; }
-.sl-markdown-content .rb-install-setup select {
-	min-height: 32px;
-	max-width: 100%;
-	padding: 0 0.5rem;
-	border: 1px solid var(--rb-border-strong);
-	border-radius: 4px;
-	background: var(--sl-color-bg);
-	color: var(--sl-color-white);
-	font: inherit;
-}
+/* Its select is styled as every other choice list on the site (the
+   arrow of --rb-select-arrow, below): a rule of its own hid the arrow. */
 
 /* Collapsible blocks are quiet: a closed block must not outweigh the
    command it explains. Colour is kept for caution and danger. */