diff --git a/scss/navbar.scss b/scss/navbar.scss
index 213fc48b..4888618e 100644
--- a/scss/navbar.scss
+++ b/scss/navbar.scss
@@ -21,36 +21,37 @@
}
&.current {
- .pane-button {
+ .nav-button {
background-color: scheme.$primary;
color: color.change(scheme.$base, $alpha: 1);
}
- &:hover .pane-button,
- &:focus .pane-button {
+ &:hover .nav-button,
+ &:focus .nav-button {
background-color: color.mix(scheme.$primary, scheme.$base, 80%);
}
- &:active .pane-button {
+ &:active .nav-button {
background-color: color.mix(scheme.$primary, scheme.$base, 70%);
}
}
- &:first-child .pane-button {
+ &:first-child .nav-button {
margin-top: lib.s(10);
}
- &:last-child .pane-button {
+ &:last-child .nav-button {
margin-bottom: lib.s(10);
}
}
- .pane-button {
+ .nav-button {
@include lib.rounded(20);
@include lib.element-decel;
padding: lib.s(10) lib.s(8);
margin: lib.s(5) lib.s(8);
+ min-width: lib.s(40);
.icon {
font-size: lib.s(28);
diff --git a/src/modules/navbar.tsx b/src/modules/navbar.tsx
index b844ff41..e230c19f 100644
--- a/src/modules/navbar.tsx
+++ b/src/modules/navbar.tsx
@@ -1,11 +1,16 @@
import type { Monitor } from "@/services/monitors";
+import { capitalize } from "@/utils/strings";
import type { AstalWidget } from "@/utils/types";
-import { Variable } from "astal";
+import { bind, execAsync, Variable } from "astal";
import { Astal, Gtk } from "astal/gtk3";
import { navbar as config } from "config";
import AstalHyprland from "gi://AstalHyprland";
+import Pango from "gi://Pango";
import SideBar, { awaitSidebar, paneNames, switchPane, type PaneName } from "./sidebar";
+const specialWsNames = ["sysmon", "communication", "music", "todo"] as const;
+type SpecialWsName = (typeof specialWsNames)[number];
+
const getPaneIcon = (name: PaneName) => {
if (name === "dashboard") return "dashboard";
if (name === "audio") return "tune";
@@ -15,13 +20,11 @@ const getPaneIcon = (name: PaneName) => {
return "date_range";
};
-const getPaneName = (name: PaneName) => {
- if (name === "dashboard") return "Dash";
- if (name === "audio") return "Audio";
- if (name === "connectivity") return "Conn";
- if (name === "packages") return "Pkgs";
- if (name === "notifpane") return "Alrts";
- return "Time";
+const getSpecialWsIcon = (name: SpecialWsName) => {
+ if (name === "sysmon") return "speed";
+ if (name === "communication") return "communication";
+ if (name === "music") return "music_note";
+ return "checklist";
};
const hookIsCurrent = (
@@ -50,17 +53,40 @@ const PaneButton = ({
}) => (
+);
+
+const SpecialWsButton = ({ name }: { name: SpecialWsName }) => (
+
@@ -113,6 +139,10 @@ export default ({ monitor }: { monitor: Monitor }) => {
{paneNames.map(n => (
))}
+
+ {specialWsNames.map(n => (
+
+ ))}