diff options
| -rw-r--r-- | scss/bar.scss | 8 | ||||
| -rw-r--r-- | src/modules/bar.tsx | 22 |
2 files changed, 30 insertions, 0 deletions
diff --git a/scss/bar.scss b/scss/bar.scss index a0fd230..ce3e2ea 100644 --- a/scss/bar.scss +++ b/scss/bar.scss @@ -103,6 +103,14 @@ color: scheme.$mauve; } + .battery { + color: scheme.$teal; + + .low { + color: scheme.$red; + } + } + .date-time { color: scheme.$peach; } diff --git a/src/modules/bar.tsx b/src/modules/bar.tsx index ea953d7..cd36e42 100644 --- a/src/modules/bar.tsx +++ b/src/modules/bar.tsx @@ -11,6 +11,7 @@ import { execAsync, register, Variable } from "astal"; import { bind, kebabify } from "astal/binding"; import { App, Astal, astalify, Gdk, Gtk, type ConstructProps } from "astal/gtk3"; import { bar as config } from "config"; +import AstalBattery from "gi://AstalBattery"; import AstalBluetooth from "gi://AstalBluetooth"; import AstalHyprland from "gi://AstalHyprland"; import AstalNetwork from "gi://AstalNetwork"; @@ -20,6 +21,19 @@ import AstalWp01 from "gi://AstalWp"; const hyprland = AstalHyprland.get_default(); +const getBatteryIcon = (perc: number) => { + if (perc < 0.1) return ""; + if (perc < 0.2) return ""; + if (perc < 0.3) return ""; + if (perc < 0.4) return ""; + if (perc < 0.5) return ""; + if (perc < 0.6) return ""; + if (perc < 0.7) return ""; + if (perc < 0.8) return ""; + if (perc < 0.9) return ""; + return ""; +}; + const hookFocusedClientProp = ( self: AstalWidget, prop: keyof AstalHyprland.Client, @@ -448,6 +462,13 @@ const NotifCount = () => ( </button> ); +const Battery = () => ( + <box className={bind(AstalBattery.get_default(), "percentage").as(p => `module battery ${p < 0.2 ? "low" : ""}`)}> + <label className="icon" label={bind(AstalBattery.get_default(), "percentage").as(getBatteryIcon)} /> + <label label={bind(AstalBattery.get_default(), "percentage").as(p => `${p * 100}%`)} /> + </box> +); + const DateTime = () => ( <button onClick={(self, event) => event.button === Astal.MouseButton.PRIMARY && togglePopup(self, event, "sideright")} @@ -502,6 +523,7 @@ export default ({ monitor }: { monitor: Monitor }) => ( <StatusIcons /> <PkgUpdates /> <NotifCount /> + {bind(AstalBattery.get_default(), "isBattery").as(b => b && <Battery />)} <DateTime /> <Power /> </box> |