Polish bar alignment and battery indicator, dismiss launcher on outside click

shell/ferese-shell/src/status_ui/bar.rs

@@ -57,14 +57,12 @@ impl FereseShell {
         } else {
             theme.text_muted
         });
-        let mut content = row![accented_icon(
-            source,
-            metrics.icon_size,
-            foreground,
-            color(theme.accent)
-        )]
-        .spacing(4)
-        .align_y(Alignment::Center);
+        let indicator = if kind == Menu::Battery {
+            self.battery_indicator(theme, 1.0, battery_percentage)
+        } else {
+            accented_icon(source, metrics.icon_size, foreground, color(theme.accent)).into()
+        };
+        let mut content = row![indicator].spacing(4).align_y(Alignment::Center);
 
         if kind == Menu::Recording
             && let Some(elapsed) = self.recorder.elapsed()
@@ -77,17 +75,6 @@ impl FereseShell {
             );
         }
 
-        if kind == Menu::Battery
-            && battery_percentage
-            && let Some(battery) = &self.status.battery
-        {
-            content = content.push(
-                self.render
-                    .text(format!("{}%", battery.percent))
-                    .size(metrics.text_size)
-                    .class(theme::Text::Color(foreground)),
-            );
-        }
         if kind == Menu::Notifications
             && self
                 .status

shell/ferese-shell/src/status_ui/battery.rs

@@ -1,54 +1,21 @@
-use cosmic::iced::{Alignment, Color, Length};
+use cosmic::iced::{Alignment, Length};
 use cosmic::widget::{button, column, container, row};
 use cosmic::{Element, theme};
 
-use super::bar::status_icon;
-use super::controls::{control_card, level_meter, slider_row};
-use super::{Menu, MenuRows, MenuStyle};
+use super::controls::{control_card, slider_row};
+use super::{MenuRows, MenuStyle};
 use crate::status::Action;
-use crate::{FereseShell, Message, ShellTheme, accented_icon, bar_icon, color_with_opacity, motion};
+use crate::{FereseShell, Message, ShellTheme, bar_icon, color_with_opacity, motion};
 
 pub(super) fn view<'a>(shell: &'a FereseShell, mut rows: MenuRows<'a>, style: MenuStyle) -> MenuRows<'a> {
     let MenuStyle {
         theme,
-        primary,
+        primary: _,
         muted,
         opacity: p,
     } = style;
     if let Some(b) = &shell.status.battery {
-        let battery_color = if b.percent < shell.config.status.low_battery_threshold && b.status != "Charging" {
-            Color {
-                a: p,
-                ..Color::from_rgb8(230, 172, 90)
-            }
-        } else {
-            primary
-        };
-        rows = rows.push(
-            container(
-                row![
-                    shell
-                        .render
-                        .text(format!("{}%", b.percent))
-                        .size(24)
-                        .width(Length::Fill),
-                    accented_icon(
-                        status_icon(Menu::Battery, &shell.status).0,
-                        24,
-                        battery_color,
-                        color_with_opacity(theme.accent, p),
-                    ),
-                ]
-                .align_y(Alignment::Center),
-            )
-            .padding([2, 0])
-            .class(theme::Container::custom(move |_| container::Style {
-                text_color: Some(battery_color),
-                icon_color: Some(battery_color),
-                ..Default::default()
-            })),
-        );
-        rows = rows.push(level_meter(shell.render, b.percent, battery_color, p));
+        rows = rows.push(container(shell.battery_indicator(theme, p, true)).padding([2, 0]));
         rows = rows.push(
             shell
                 .render

shell/ferese-shell/src/status_ui/media.rs

@@ -81,7 +81,8 @@ pub(super) fn bar<'a>(
         return shell.render.text("").into();
     };
     let foreground = color(if selected { palette.accent } else { palette.text_primary });
-    let height = (metrics.group_item_height - 4.0).max(0.0);
+    let vertical_padding = ((metrics.group_item_height - f32::from(metrics.icon_size)) * 0.5).clamp(0.0, 2.0);
+    let height = metrics.group_item_height - 2.0 * vertical_padding;
     let side = height.min(24.0);
     let cover: Element<'_, cosmic::Action<Message>> =
         match shell.media.artwork.as_ref().and_then(|art| art.handle.as_ref()) {
@@ -178,8 +179,9 @@ pub(super) fn bar<'a>(
         .spacing(2)
         .align_y(Alignment::Center),
     )
-    .padding(2)
+    .padding([vertical_padding, 2.0])
     .height(metrics.group_item_height)
+    .align_y(cosmic::iced::alignment::Vertical::Center)
     .class(theme::Container::custom(move |_| bar_style));
 
     let mut area = mouse_area(controls);

shell/ferese-shell/src/status_ui/mod.rs

@@ -365,7 +365,9 @@ impl FereseShell {
         let kind = menu.kind;
         let primary = color_with_opacity(theme.text_primary, p);
         let muted = color_with_opacity(theme.text_muted, p);
-        let badge = ferese_theme::menus::badge(
+        let heading_icon = if kind == Menu::Battery {
+            self.battery_indicator(theme, p, false)
+        } else {
             accented_icon(
                 status_icon(kind, &self.status).0,
                 22,
@@ -373,7 +375,10 @@ impl FereseShell {
                 color_with_opacity(theme.accent, p),
             )
             .width(Length::Fixed(22.))
-            .into(),
+            .into()
+        };
+        let badge = ferese_theme::menus::badge(
+            heading_icon,
             color(theme.accent),
             p,
             self.render.radius(20.),

shell/ferese-shell/src/status_ui/system.rs

@@ -111,16 +111,24 @@ pub(super) fn view<'a>(
         ));
     }
 
-    if let Some(b) = &shell.status.battery {
-        connections = connections.push(connection_control(
-            shell.render,
-            "Battery",
-            &format!("{}%", b.percent),
-            status_icon(Menu::Battery, &shell.status).0,
-            b.status == "Charging",
-            None,
-            style,
-        ));
+    if shell.status.battery.is_some() {
+        connections = connections.push(
+            container(
+                column![
+                    container(shell.battery_indicator(theme, p, true))
+                        .center_x(Length::Fill)
+                        .center_y(28),
+                    shell.render.text("Battery").size(11)
+                        .width(Length::Fill).height(16)
+                        .align_x(alignment::Horizontal::Center)
+                        .class(theme::Text::Color(muted)),
+                ]
+                .spacing(2)
+                .align_x(Alignment::Center),
+            )
+            .width(Length::FillPortion(1))
+            .padding(4),
+        );
     }
 
     if shell.status.network.is_some() || shell.status.bluetooth.is_some() || shell.status.battery.is_some() {