kalle
/
dotfiles
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Improve bar

main
kalle 2025-04-01 21:22:55 +02:00
parent 1f9e028732
commit 445e0269d8
3 changed files with 42 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
modules/ags/config/style.scss
View File

@ -13,23 +13,31 @@ window.Bar {
} }
.pill { .pill {
background: $ctp-surface-0;
border-radius: 5px;
>.icon { >.icon {
color: $ctp-surface-0; color: $ctp-surface-0;
padding: 6px 8px; padding: 6px 8px;
font-size: 18px; font-size: 18px;
} }
&.icon-left>.icon { &.icon-left {
border-radius: 5px 0 0 5px; &>.icon {
border-radius: 5px 0 0 5px;
}
&>.label {
border-radius: 0 5px 5px 0;
}
} }
&.icon-right>.icon { &.icon-right {
border-radius: 0 5px 5px 0; &>.icon {
border-radius: 0 5px 5px 0;
}
&>.label {
border-radius: 5px 0 0 5px;
}
} }
>.label { >.label {
background: $ctp-surface-0;
padding: 0 8px; padding: 0 8px;
font-size: 16px; font-size: 16px;
} }
@ -48,17 +56,12 @@ window.Bar {
background: $ctp-blue; background: $ctp-blue;
} }
>.labels { >.label button {
padding: 0 8px; all: unset;
font-size: 16px;
button { &.add {
all: unset; font-size: 12px;
margin-left: 4px;
&.add {
font-size: 12px;
margin-left: 4px;
}
} }
} }
} }
@ -70,7 +73,23 @@ window.Bar {
font-size: 20px; font-size: 20px;
} }
>.item { .items {
background: $ctp-surface-0;
font-size: 16px;
}
&.icon-left {
.items {
border-radius: 0 5px 5px 0;
}
}
&.icon-right {
.items {
border-radius: 5px 0 0 5px;
}
}
.item {
all: unset; all: unset;
padding: 8px 8px; padding: 8px 8px;
} }

6
modules/ags/config/widget/Systray.tsx
View File

@ -6,9 +6,11 @@ const tray = Tray.get_default()
export default function Systray(props: { iconSide: "left" | "right" }) { export default function Systray(props: { iconSide: "left" | "right" }) {
return <box className={`pill Systray icon-${props.iconSide}`}> return <box className={`pill Systray icon-${props.iconSide}`}>
{props.iconSide == "left" && <label className="icon" label="󱊔" />} {props.iconSide == "left" && <label className="icon" label="󱊔" />}
{bind(tray, "items").as(items => items.map(item => <SystrayItem item={item} />))} <box className="items">
{bind(tray, "items").as(items => items.map(item => <SystrayItem item={item} />))}
</box>
{props.iconSide == "right" && <label className="icon" label="󱊔" />} {props.iconSide == "right" && <label className="icon" label="󱊔" />}
</box> </box >
} }
function SystrayItem({ item }: { item: Tray.TrayItem }) { function SystrayItem({ item }: { item: Tray.TrayItem }) {

2
modules/ags/config/widget/Workspaces.tsx
View File

@ -6,7 +6,7 @@ export default function Workspaces(props: { monitor: string, iconSide: "left" |
return <box className={`pill Workspaces icon-${props.iconSide}`}> return <box className={`pill Workspaces icon-${props.iconSide}`}>
{props.iconSide == "left" && <label className="icon" label="󱗼" />} {props.iconSide == "left" && <label className="icon" label="󱗼" />}
<box className="labels"> <box className="label">
{bind(hyprland, "workspaces").as(wss => wss {bind(hyprland, "workspaces").as(wss => wss
.filter(it => it && it.get_monitor && it.get_monitor().name == props.monitor) .filter(it => it && it.get_monitor && it.get_monitor().name == props.monitor)
.sort((a, b) => a.get_id() - b.get_id()) .sort((a, b) => a.get_id() - b.get_id())