feat(command-line): adjustable command line opacity

COMMANDLINEOPACITY (20-100 percent, default 100) and a slider under
Options > Display make the floating command line's panels see-through,
so the drawing stays visible behind it. The input field stays opaque
for legibility. The value is an application setting that persists.

Refs #1494

Co-Authored-By: Claude Opus 5.5 <[email protected]>

src/ui/command_line.rs

@@ -191,6 +191,9 @@ pub struct CommandLine {
     /// in milliseconds (0–60000, default 3000). 0 means history never fades;
     /// the pinned step prompt still shows.
     fade_ms: u32,
+    /// COMMANDLINEOPACITY: how opaque the command line's panels are, in
+    /// percent (20–100, default 100), so the drawing shows through.
+    opacity_percent: u8,
 }
 
 impl Default for CommandLine {
@@ -217,6 +220,7 @@ impl Default for CommandLine {
             step_options: Vec::new(),
             cliprompt_lines: 3,
             fade_ms: DEFAULT_COMMANDLINE_FADE_MS,
+            opacity_percent: 100,
         }
     }
 }
@@ -509,6 +513,15 @@ impl CommandLine {
         self.fade_ms
     }
 
+    /// COMMANDLINEOPACITY mirror (percent, 20–100).
+    pub fn set_opacity_percent(&mut self, percent: u8) {
+        self.opacity_percent = percent.clamp(20, 100);
+    }
+
+    pub fn opacity_percent(&self) -> u8 {
+        self.opacity_percent
+    }
+
     fn fade_secs(&self) -> f32 {
         self.fade_ms as f32 / 1000.0
     }
@@ -1127,12 +1140,15 @@ impl CommandLine {
         // The transient recent lines and the full archive are two views of the
         // same history. Showing both while the archive is open creates a fake
         // second history region and visually disconnects the input row (#555).
+        let opacity = f32::from(self.opacity_percent) / 100.0;
         let recent_history: Element<'a, Message> = if self.history_open || !has_recent_history {
             container(column![]).height(0).into()
         } else {
             container(history_rows)
-                .style(|theme: &Theme| container::Style {
-                    background: Some(Background::Color(theme.palette().background.base.color)),
+                .style(move |theme: &Theme| container::Style {
+                    background: Some(Background::Color(
+                        theme.palette().background.base.color.scale_alpha(opacity),
+                    )),
                     ..Default::default()
                 })
                 .width(Length::Fill)
@@ -1153,10 +1169,11 @@ impl CommandLine {
                 recent_history,
                 history_divider,
                 container(input_row)
-                    .style(|theme: &Theme| {
+                    .style(move |theme: &Theme| {
                         let palette = theme.palette();
+                        let color = palette.background.weakest.color.scale_alpha(opacity);
                         container::Style {
-                            background: Some(Background::Color(palette.background.weakest.color)),
+                            background: Some(Background::Color(color)),
                             ..Default::default()
                         }
                     })
@@ -1170,7 +1187,9 @@ impl CommandLine {
         .style(move |theme: &Theme| {
             let palette = theme.palette();
             container::Style {
-                background: Some(Background::Color(palette.background.base.color)),
+                background: Some(Background::Color(
+                    palette.background.base.color.scale_alpha(opacity),
+                )),
                 border: Border {
                     color: palette.background.neutral.color,
                     width: if history_open { 1.0 } else { 0.0 },

src/ui/window/options.rs

@@ -53,6 +53,8 @@ pub struct AppPrefs {
     pub cliprompt_lines: i32,
     /// COMMANDLINEFADETIME: how long overlay history lines stay visible, in ms.
     pub commandline_fade_ms: i32,
+    /// COMMANDLINEOPACITY: command-line panel opacity in percent.
+    pub command_line_opacity: u8,
     /// ZOOMWHEEL: reverse the mouse-wheel zoom direction.
     pub zoom_wheel_reversed: bool,
     /// Scroll pans and Ctrl+scroll zooms (touchpads).
@@ -974,6 +976,22 @@ pub fn view_window<'a>(
             ))
             .size(11)
             .width(sizing.width),
+        )
+        .push(Space::new().height(12))
+        .push(
+            row![
+                text(crate::t!("Command line opacity")).size(12).width(140),
+                slider(
+                    20..=100,
+                    prefs.command_line_opacity.clamp(20, 100),
+                    Message::CommandLineOpacityChanged,
+                )
+                .step(5u8)
+                .width(Fill),
+                text(format!("{}%", prefs.command_line_opacity)).size(11).width(44),
+            ]
+            .spacing(10)
+            .align_y(iced::Center),
         );
 
     let display_element = display.spacing(0).width(sizing.width);