nosignal/nosignal-shell
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

bar: fix workspaces visual glitch

Browse source 
Also use gtk truncate for active window and media playing
For some reason, odd numbers of workspaces need the adjustment, but even don't
This commit is contained in:
2 * r + 2 * t 2025-04-02 23:38:04 +11:00
parent 675e77c4f6
commit 65d0511408
3 changed files with 12 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
scss/bar.scss
View file

@ -276,7 +276,7 @@
border-bottom-left-radius: lib.s($-rounding); border-bottom-left-radius: lib.s($-rounding);
} }
.workspaces { .workspaces.odd {
margin-right: -1px; margin-right: -1px;
} }
@ -300,7 +300,7 @@
padding-top: lib.s(15); padding-top: lib.s(15);
} }
.workspaces { .workspaces.odd {
margin-bottom: -1px; margin-bottom: -1px;
} }

18
src/modules/bar.tsx
View file

@ -3,7 +3,6 @@ import type { Monitor } from "@/services/monitors";
import Players from "@/services/players"; import Players from "@/services/players";
import Updates from "@/services/updates"; import Updates from "@/services/updates";
import { getAppCategoryIcon } from "@/utils/icons"; import { getAppCategoryIcon } from "@/utils/icons";
import { ellipsize } from "@/utils/strings";
import { bindCurrentTime, osIcon } from "@/utils/system"; import { bindCurrentTime, osIcon } from "@/utils/system";
import type { AstalWidget } from "@/utils/types"; import type { AstalWidget } from "@/utils/types";
import { setupCustomTooltip } from "@/utils/widgets"; import { setupCustomTooltip } from "@/utils/widgets";
@ -146,12 +145,11 @@ const ActiveWindow = ({ monitor, ...props }: ModuleProps) => (
} }
/> />
<label <label
truncate
angle={bind(config.vertical).as(v => (v ? 270 : 0))} angle={bind(config.vertical).as(v => (v ? 270 : 0))}
setup={self => { setup={self => {
const update = () => const update = () =>
(self.label = hyprland.focusedClient?.title (self.label = hyprland.focusedClient?.title ? hyprland.focusedClient.title : "Desktop");
? ellipsize(hyprland.focusedClient.title, config.vertical.get() ? 25 : 40)
: "Desktop");
hookFocusedClientProp(self, "title", update); hookFocusedClientProp(self, "title", update);
self.hook(config.vertical, update); self.hook(config.vertical, update);
}} }}
@ -192,11 +190,10 @@ const MediaPlaying = ({ monitor, ...props }: ModuleProps) => {
} }
/> />
<label <label
truncate
angle={bind(config.vertical).as(v => (v ? 270 : 0))} angle={bind(config.vertical).as(v => (v ? 270 : 0))}
setup={self => { setup={self => {
// TODO: scroll text when playing or hover const update = () => (self.label = getLabel("No media"));
const update = () =>
(self.label = ellipsize(getLabel("No media"), config.vertical.get() ? 25 : 40));
players.hookLastPlayer(self, ["notify::title", "notify::artist"], update); players.hookLastPlayer(self, ["notify::title", "notify::artist"], update);
self.hook(config.vertical, update); self.hook(config.vertical, update);
}} }}
@ -255,7 +252,12 @@ const Workspaces = ({ monitor, ...props }: ModuleProps) => (
hyprland.dispatch("workspace", (event.delta_y < 0 ? "-" : "+") + 1); hyprland.dispatch("workspace", (event.delta_y < 0 ? "-" : "+") + 1);
}} }}
> >
<box vertical={bind(config.vertical)} className={`module workspaces ${getClassName(props)}`}> <box
vertical={bind(config.vertical)}
className={bind(config.modules.workspaces.shown).as(
s => `module workspaces ${s % 2 === 0 ? "even" : "odd"} ${getClassName(props)}`
)}
>
{bind(config.modules.workspaces.shown).as( {bind(config.modules.workspaces.shown).as(
n => Array.from({ length: n }).map((_, idx) => <Workspace idx={idx + 1} />) // Start from 1 n => Array.from({ length: n }).map((_, idx) => <Workspace idx={idx + 1} />) // Start from 1
)} )}

2
src/utils/strings.ts
View file

@ -1,5 +1,3 @@
export const ellipsize = (str: string, len: number) => (str.length > len ? `${str.slice(0, len - 1)}…` : str);
export const basename = (path: string, stripExt = true) => { export const basename = (path: string, stripExt = true) => {
const lastSlash = path.lastIndexOf("/"); const lastSlash = path.lastIndexOf("/");
const lastDot = path.lastIndexOf("."); const lastDot = path.lastIndexOf(".");