From 9b2b73e865f73e6426e0dcb58a31ee2a903b529e Mon Sep 17 00:00:00 2001 From: Kalle Struik Date: Sat, 29 Mar 2025 12:56:38 +0100 Subject: [PATCH] New bars --- hosts/kalle-pc/default.nix | 3 +- modules/ags/config/app.ts | 7 +- modules/ags/config/style.scss | 95 ++++++++++- modules/ags/config/themes/catpuccin.scss | 27 +++ modules/ags/config/widget/Clock.tsx | 18 ++ modules/ags/config/widget/LeftBar.tsx | 30 ++-- modules/ags/config/widget/RightBar.tsx | 27 +++ modules/ags/config/widget/Systray.tsx | 26 +-- modules/ags/config/widget/Workspaces.tsx | 55 ++++++ modules/ags/config_old/bar/Bar.js | 46 ----- modules/ags/config_old/bar/Clock.js | 24 --- modules/ags/config_old/bar/Systray.js | 16 -- modules/ags/config_old/colors.css | 35 ---- modules/ags/config_old/config.js | 14 -- modules/ags/config_old/constants.js | 5 - modules/ags/config_old/media/Media.js | 160 ------------------ modules/ags/config_old/media/style.css | 59 ------- .../config_old/notifications/Notifications.js | 129 -------------- .../ags/config_old/notifications/style.css | 59 ------- modules/ags/config_old/style.css | 22 --- modules/ags/config_old/tsconfig.json | 18 -- modules/ags/config_old/types | 1 - modules/ags/default.nix | 9 +- 23 files changed, 252 insertions(+), 633 deletions(-) create mode 100644 modules/ags/config/themes/catpuccin.scss create mode 100644 modules/ags/config/widget/Clock.tsx create mode 100644 modules/ags/config/widget/RightBar.tsx create mode 100644 modules/ags/config/widget/Workspaces.tsx delete mode 100644 modules/ags/config_old/bar/Bar.js delete mode 100644 modules/ags/config_old/bar/Clock.js delete mode 100644 modules/ags/config_old/bar/Systray.js delete mode 100644 modules/ags/config_old/colors.css delete mode 100644 modules/ags/config_old/config.js delete mode 100644 modules/ags/config_old/constants.js delete mode 100644 modules/ags/config_old/media/Media.js delete mode 100644 modules/ags/config_old/media/style.css delete mode 100644 modules/ags/config_old/notifications/Notifications.js delete mode 100644 modules/ags/config_old/notifications/style.css delete mode 100644 modules/ags/config_old/style.css delete mode 100644 modules/ags/config_old/tsconfig.json delete mode 120000 modules/ags/config_old/types diff --git a/hosts/kalle-pc/default.nix b/hosts/kalle-pc/default.nix index 24cc38a..09b2b3e 100644 --- a/hosts/kalle-pc/default.nix +++ b/hosts/kalle-pc/default.nix @@ -22,6 +22,7 @@ ../../modules/zen-browser.nix ../../modules/steam.nix ../../modules/nvim + ../../modules/ags ../../modules/grayjay.nix ../../modules/signal.nix ]; @@ -87,7 +88,7 @@ ]; autoStart = [ - "${pkgs.ags}/bin/ags" + "uwsm-app -- ags run" (mkUwsmApp inputs.zen-browser.packages.x86_64-linux.default "zen") (mkUwsmApp pkgs.discord "discord") ]; diff --git a/modules/ags/config/app.ts b/modules/ags/config/app.ts index ab85dba..77e793b 100644 --- a/modules/ags/config/app.ts +++ b/modules/ags/config/app.ts @@ -1,10 +1,15 @@ import { App } from "astal/gtk3" import style from "./style.scss" import LeftBar from "./widget/LeftBar" +import RightBar from "./widget/RightBar" + +const LEFT_DISPLAY = "HF237" +const RIGHT_DISPLAY = "LCDTV16" App.start({ css: style, main() { - App.get_monitors().map(LeftBar) + LeftBar(App.get_monitors().find(it => it.get_model() == LEFT_DISPLAY)!); + RightBar(App.get_monitors().find(it => it.get_model() == RIGHT_DISPLAY)!); }, }) diff --git a/modules/ags/config/style.scss b/modules/ags/config/style.scss index 904eb3b..a19299e 100644 --- a/modules/ags/config/style.scss +++ b/modules/ags/config/style.scss @@ -1,18 +1,97 @@ // https://gitlab.gnome.org/GNOME/gtk/-/blob/gtk-3-24/gtk/theme/Adwaita/_colors-public.scss -$fg-color: #{"@theme_fg_color"}; -$bg-color: #{"@theme_bg_color"}; +@use 'sass:color'; + +@import "themes/catpuccin.scss"; window.Bar { background: transparent; - color: $fg-color; + color: $ctp-text; >centerbox { - background: $bg-color; + background: $ctp-base; border-radius: 5px; margin: 8px; - - >box { - margin: 4px; - } + padding: 8px; } } + +.Time { + background: $ctp-surface-0; + border-radius: 5px; + + >.icon { + background: $ctp-red; + color: $ctp-surface-0; + padding: 6px 8px; + font-size: 18px; + } + + &.icon-left>.icon { + border-radius: 5px 0 0 5px; + } + &.icon-right>.icon { + border-radius: 0 5px 5px 0; + } + >.label { + padding: 0 8px; + font-size: 16px; + } +} + +.Workspaces { + background: $ctp-surface-0; + border-radius: 5px; + + >.icon { + background: $ctp-blue; + color: $ctp-surface-0; + padding: 6px 8px; + font-size: 18px; + } + + &.icon-left>.icon { + border-radius: 5px 0 0 5px; + } + &.icon-right>.icon { + border-radius: 0 5px 5px 0; + } + + >.labels { + padding: 0 8px; + font-size: 16px; + + button { + all: unset; + + &.add { + font-size: 12px; + margin-left: 4px; + } + } + } +} + +.Systray { + background: $ctp-surface-0; + border-radius: 5px; + + >.icon { + background: $ctp-green; + color: $ctp-surface-0; + padding: 4px 8px 0 8px; + font-size: 20px; + border-radius: 5px 0 0 5px; + } + + &.icon-left>.icon { + border-radius: 5px 0 0 5px; + } + &.icon-right>.icon { + border-radius: 0 5px 5px 0; + } + + >.item { + all: unset; + padding: 8px 8px; + } +} diff --git a/modules/ags/config/themes/catpuccin.scss b/modules/ags/config/themes/catpuccin.scss new file mode 100644 index 0000000..596d79d --- /dev/null +++ b/modules/ags/config/themes/catpuccin.scss @@ -0,0 +1,27 @@ +$ctp-rosewater: #f5e0dc; +$ctp-flamingo: #f2cdcd; +$ctp-pink: #f5c2e7; +$ctp-mauve: #cba6f7; +$ctp-red: #f38ba8; +$ctp-maroon: #eba0ac; +$ctp-peach: #fab387; +$ctp-yellow: #f9e2af; +$ctp-green: #a6e3a1; +$ctp-teal: #94e2d5; +$ctp-sky: #89dceb; +$ctp-sapphire: #74c7ec; +$ctp-blue: #89b4fa; +$ctp-lavender: #b4befe; +$ctp-text: #cdd6f4; +$ctp-subtext-1: #bac2de; +$ctp-subtext-0: #a6adc8; +$ctp-overlay-2: #9399b2; +$ctp-overlay-1: #7f849c; +$ctp-overlay-0: #6c7086; +$ctp-surface-2: #585b70; +$ctp-surface-1: #45475a; +$ctp-surface-0: #313244; +$ctp-base: #1e1e2e; +$ctp-mantle: #181825; +$ctp-crust: #11111b; + diff --git a/modules/ags/config/widget/Clock.tsx b/modules/ags/config/widget/Clock.tsx new file mode 100644 index 0000000..f2f6f85 --- /dev/null +++ b/modules/ags/config/widget/Clock.tsx @@ -0,0 +1,18 @@ +import { GLib, Variable } from "astal" + +const TIME_FORMAT = "%H:%M" + +export default function Clock(props: { iconSide: "left" | "right" }) { + const time = Variable("").poll(1000, () => + GLib.DateTime.new_now_local().format(TIME_FORMAT)!) + + return + {props.iconSide == "left" && +} diff --git a/modules/ags/config/widget/LeftBar.tsx b/modules/ags/config/widget/LeftBar.tsx index 38736a9..b6c111c 100644 --- a/modules/ags/config/widget/LeftBar.tsx +++ b/modules/ags/config/widget/LeftBar.tsx @@ -1,5 +1,6 @@ import { App, Astal, Gdk, Gtk } from "astal/gtk3"; -import Systray from "./Systray"; +import Clock from "./Clock"; +import Workspaces from "./Workspaces"; export default function LeftBar(gdkmonitor: Gdk.Monitor) { const { TOP, LEFT, RIGHT } = Astal.WindowAnchor; @@ -11,25 +12,14 @@ export default function LeftBar(gdkmonitor: Gdk.Monitor) { anchor={TOP | LEFT | RIGHT} application={App}> - -
- + + + + + + + + } - -function Left() { - return - -} - -function Center() { - return - -} - -function Right() { - return - - -} diff --git a/modules/ags/config/widget/RightBar.tsx b/modules/ags/config/widget/RightBar.tsx new file mode 100644 index 0000000..544f4a1 --- /dev/null +++ b/modules/ags/config/widget/RightBar.tsx @@ -0,0 +1,27 @@ +import { App, Astal, Gdk, Gtk } from "astal/gtk3"; +import Clock from "./Clock"; +import Workspaces from "./Workspaces"; +import Systray from "./Systray"; + +export default function RightBar(gdkmonitor: Gdk.Monitor) { + const { TOP, LEFT, RIGHT } = Astal.WindowAnchor; + + return + + + + + + + + + + + + +} diff --git a/modules/ags/config/widget/Systray.tsx b/modules/ags/config/widget/Systray.tsx index 4da0941..800f3d4 100644 --- a/modules/ags/config/widget/Systray.tsx +++ b/modules/ags/config/widget/Systray.tsx @@ -1,23 +1,23 @@ import { bind } from "astal" -import { Button, Icon } from "astal/gtk3/widget" import Tray from "gi://AstalTray" const tray = Tray.get_default() -export default function Systray() { - for (const item of tray.get_items()) { - print(item.title) - } - return - {tray.get_items().map(item => )} +export default function Systray(props: { iconSide: "left" | "right" }) { + return + {props.iconSide == "left" && } function SystrayItem({ item }: { item: Tray.TrayItem }) { - return + return ["dbusmenu", ag])} + menuModel={bind(item, "menuModel")}> + + } diff --git a/modules/ags/config/widget/Workspaces.tsx b/modules/ags/config/widget/Workspaces.tsx new file mode 100644 index 0000000..85a34d2 --- /dev/null +++ b/modules/ags/config/widget/Workspaces.tsx @@ -0,0 +1,55 @@ +import { bind } from "astal" +import Hyprland from "gi://AstalHyprland" + +export default function Workspaces(props: { monitor: string, iconSide: "left" | "right" }) { + const hyprland = Hyprland.get_default(); + + return + {props.iconSide == "left" && +} + +function Workspace(props: { workspace: Hyprland.Workspace }) { + const hyprland = Hyprland.get_default(); + + return + {bind(props.workspace.get_monitor(), "activeWorkspace").as(ws => { + if (ws == props.workspace) { + return +} diff --git a/modules/ags/config_old/bar/Bar.js b/modules/ags/config_old/bar/Bar.js deleted file mode 100644 index 3526bdf..0000000 --- a/modules/ags/config_old/bar/Bar.js +++ /dev/null @@ -1,46 +0,0 @@ -import { GTK_ALIGN_CENTER, GTK_ALIGN_END, GTK_ALIGN_START } from "../constants.js" -import { Clock } from "./Clock.js" -import { SysTray } from "./Systray.js" - -function BarStart() { - return Widget.Box({ - halign: GTK_ALIGN_START, - children: [ - Widget.Label({ label: "Start" }), - Widget.Button({ label: "Button", onClicked: () => App.ToggleWindow("media2") }), - ], - }) -} -function BarCenter() { - return Widget.Box({ - halign: GTK_ALIGN_CENTER, - children: [ - Clock(), - ], - }) -} -function BarEnd() { - return Widget.Box({ - halign: GTK_ALIGN_END, - children: [ - SysTray(), - ], - }) -} - -export function Bar(monitor = 0) { - return Widget.Window({ - monitor, - exclusivity: "exclusive", - className: "bar", - margins: [5, 5, 0, 5], - name: `bar${monitor}`, - anchor: ["left", "top", "right"], - child: Widget.CenterBox({ - vertical: false, - startWidget: BarStart(), - centerWidget: BarCenter(), - endWidget: BarEnd(), - }) - }) -} diff --git a/modules/ags/config_old/bar/Clock.js b/modules/ags/config_old/bar/Clock.js deleted file mode 100644 index 3660cc1..0000000 --- a/modules/ags/config_old/bar/Clock.js +++ /dev/null @@ -1,24 +0,0 @@ -const time = Variable("", { - poll: [1000, 'date "+%H:%M"'], -}) - -const date = Variable("", { - poll: [1000, 'date "+%Y-%m-%d"'], -}) - -export function Clock() { - return Widget.Box({ - className: "clock", - vertical: true, - children: [ - Widget.Label({ - className: "time", - label: time.bind(), - }), - Widget.Label({ - className: "date", - label: date.bind(), - }), - ], - }) -} diff --git a/modules/ags/config_old/bar/Systray.js b/modules/ags/config_old/bar/Systray.js deleted file mode 100644 index 6d30e93..0000000 --- a/modules/ags/config_old/bar/Systray.js +++ /dev/null @@ -1,16 +0,0 @@ -const systemtray = await Service.import("systemtray") - -export function SysTray() { - const items = systemtray.bind("items") - .as(items => items.map(item => Widget.Button({ - child: Widget.Icon({ icon: item.bind("icon") }), - on_primary_click: (_, event) => item.activate(event), - on_secondary_click: (_, event) => item.openMenu(event), - tooltip_markup: item.bind("tooltip_markup"), - }))) - - return Widget.Box({ - className: "systray", - children: items, - }) -} diff --git a/modules/ags/config_old/colors.css b/modules/ags/config_old/colors.css deleted file mode 100644 index 3e3f215..0000000 --- a/modules/ags/config_old/colors.css +++ /dev/null @@ -1,35 +0,0 @@ -@define-color ctp-rosewater #f5e0dc; -@define-color ctp-flamingo #f2cdcd; -@define-color ctp-pink #f5c2e7; -@define-color ctp-mauve #cba6f7; -@define-color ctp-red #f38ba8; -@define-color ctp-maroon #eba0ac; -@define-color ctp-peach #fab387; -@define-color ctp-yellow #f9e2af; -@define-color ctp-green #a6e3a1; -@define-color ctp-teal #94e2d5; -@define-color ctp-sky #89dceb; -@define-color ctp-sapphire #74c7ec; -@define-color ctp-blue #89b4fa; -@define-color ctp-lavender #b4befe; -@define-color ctp-text #cdd6f4; -@define-color ctp-subtext1 #bac2de; -@define-color ctp-subtext0 #a6adc8; -@define-color ctp-overlay2 #9399b2; -@define-color ctp-overlay1 #7f849c; -@define-color ctp-overlay0 #6c7086; -@define-color ctp-surface2 #585b70; -@define-color ctp-surface1 #45475a; -@define-color ctp-surface0 #313244; -@define-color ctp-base #1e1e2e; -@define-color ctp-mantle #181825; -@define-color ctp-crust #11111b; - -button { - background: @ctp-surface0; - border: none; -} - -button:active, button:hover, button:focus { - background: @ctp-surface1; -} diff --git a/modules/ags/config_old/config.js b/modules/ags/config_old/config.js deleted file mode 100644 index 5999848..0000000 --- a/modules/ags/config_old/config.js +++ /dev/null @@ -1,14 +0,0 @@ -import { Media } from "./media/Media.js"; -import { Bar } from "./bar/Bar.js"; -import { Notifications } from "./notifications/Notifications.js"; - - -App.config({ - style: "./style.css", - windows: [ - Bar(2), - Media(2), - Notifications(2), - ] -}) - diff --git a/modules/ags/config_old/constants.js b/modules/ags/config_old/constants.js deleted file mode 100644 index 3824349..0000000 --- a/modules/ags/config_old/constants.js +++ /dev/null @@ -1,5 +0,0 @@ -export const GTK_ALIGN_FILL = 0; -export const GTK_ALIGN_START = 1; -export const GTK_ALIGN_END = 2; -export const GTK_ALIGN_CENTER = 3; -export const GTK_ALIGN_BASELINE = 4; diff --git a/modules/ags/config_old/media/Media.js b/modules/ags/config_old/media/Media.js deleted file mode 100644 index b21c412..0000000 --- a/modules/ags/config_old/media/Media.js +++ /dev/null @@ -1,160 +0,0 @@ -import { GTK_ALIGN_CENTER, GTK_ALIGN_FILL } from '../constants.js' - -const mpris = await Service.import("mpris") -const players = mpris.bind("players") - -const FALLBACK_ICON = "audio-x-generic-symbolic" -const PLAY_ICON = "media-playback-start-symbolic" -const PAUSE_ICON = "media-playback-pause-symbolic" -const PREV_ICON = "media-skip-backward-symbolic" -const NEXT_ICON = "media-skip-forward-symbolic" - -/** @param {number} length */ -function lengthStr(length) { - const min = Math.floor(length / 60) - const sec = Math.floor(length % 60) - const sec0 = sec < 10 ? "0" : "" - return `${min}:${sec0}${sec}` -} - -/** @param {import('types/service/mpris').MprisPlayer} player */ -function Player(player) { - const artists = player.bind("track_artists").transform(a => a.join(", ")) - - const playPause = Widget.Button({ - className: "play-pause", - onClicked: () => player.playPause(), - visible: player.bind("can_play"), - child: Widget.Icon({ - icon: player.bind("play_back_status").transform(s => { - switch (s) { - case "Playing": return PAUSE_ICON - case "Paused": - case "Stopped": return PLAY_ICON - } - }), - }), - }) - - const prev = Widget.Button({ - onClicked: () => player.previous(), - visible: player.bind("can_go_prev"), - child: Widget.Icon(PREV_ICON), - }) - - const next = Widget.Button({ - onClicked: () => player.next(), - visible: player.bind("can_go_next"), - child: Widget.Icon(NEXT_ICON), - }) - - const positionSlider = Widget.Slider({ - className: "position", - drawValue: false, - onChange: ({ value }) => player.position = value * player.length, - visible: player.bind("length").as(l => l > 0), - setup: self => { - function update() { - const value = player.position / player.length - self.value = value > 0 ? value : 0 - } - self.hook(player, update) - self.hook(player, update, "position") - self.poll(1000, update) - }, - }) - - const positionLabel = Widget.Label({ - className: "position", - hpack: "start", - setup: self => { - const update = (_, time) => { - self.label = lengthStr(time || player.position) - self.visible = player.length > 0 - } - - self.hook(player, update, "position") - self.poll(1000, update) - }, - }) - - const lengthLabel = Widget.Label({ - className: "length", - hpack: "end", - visible: player.bind("length").transform(l => l > 0), - label: player.bind("length").transform(lengthStr), - }) - - return Widget.Overlay({ - className: "player", - child: Widget.Box({ - className: "bg-img", - vpack: "start", - css: player.bind("cover_path").transform(p => `background-image: url('${p}');`), - }), - overlays: [ - Widget.Box({ - className: "bg-cover" - }), - Widget.Box({ - className: "overlay", - vertical: true, - halign: GTK_ALIGN_CENTER, - children: [ - Widget.Box({ - className: "info", - vertical: true, - children: [ - Widget.Label({ className: "title", label: player.bind("track_title") }), - Widget.Label({ className: "album", label: player.bind("track_album") }), - Widget.Label({ className: "artist", label: artists }), - ], - }), - Widget.Box({ - vexpand: true, - }), - Widget.CenterBox({ - className: "controls", - startWidget: positionLabel, - centerWidget: Widget.Box({ - halign: GTK_ALIGN_CENTER, - spacing: 20, - children: [ - prev, - playPause, - next, - ], - }), - endWidget: lengthLabel, - }), - positionSlider, - ], - }) - ], - }) -} - -function MediaContent() { - const currentIdx = Variable(0); - const currentPlayer = Utils.merge([currentIdx.bind(), players], (currentIdx, players) => { - const idx = Math.min(currentIdx, players.length - 1); - return players[idx]; - }) - - return Widget.Box({ - children: currentPlayer.as(p => [Player(p)]), - }) -} - -export function Media(monitor = 0) { - return Widget.Window({ - monitor, - visible: false, - exclusivity: "normal", - className: "media", - margins: [10, 10, 0, 10], - name: `media${monitor}`, - anchor: ["left", "top"], - child: MediaContent(), - }) -} diff --git a/modules/ags/config_old/media/style.css b/modules/ags/config_old/media/style.css deleted file mode 100644 index 38b4551..0000000 --- a/modules/ags/config_old/media/style.css +++ /dev/null @@ -1,59 +0,0 @@ -.media > box { - border-radius: 5px; - - background-color: transparent; - color: @ctp-text; -} - -.media .player .bg-img { - border-radius: 5px; - min-width: 400px; - min-height: 200px; - background-size: cover; -} - -.media .player .bg-cover { - background: linear-gradient(alpha(@ctp-base, 0.5), @ctp-base); -} - -.media .player .overlay { - border-radius: 5px; - min-width: 400px; -} - -.media .player .info { - padding: 10px; -} - -.media .player .controls { - padding: 10px; -} - -.media .player .info .title { - font-size: 1.2em; - font-weight: bold; -} - -.media .player scale.position { - padding: 0; - border-radius: 0; - border: none; -} - -.media .player scale.position trough { - min-height: 4px; - border-radius: 0; - border: none; - background-color: @ctp-overlay0; -} - -.media .player scale.position highlight { - border-radius: 0; - border: none; - background-color: @ctp-lavender; -} - -.media .player scale.position slider { - all: unset; -} - diff --git a/modules/ags/config_old/notifications/Notifications.js b/modules/ags/config_old/notifications/Notifications.js deleted file mode 100644 index 7c5366b..0000000 --- a/modules/ags/config_old/notifications/Notifications.js +++ /dev/null @@ -1,129 +0,0 @@ -const notifications = await Service.import("notifications") - -/** @param {import('resource:///com/github/Aylur/ags/service/notifications.js').Notification} n */ -function NotificationIcon({ app_entry, app_icon, image }) { - if (image) { - return Widget.Box({ - css: `background-image: url("${image}");` - + "background-size: contain;" - + "background-repeat: no-repeat;" - + "background-position: center;", - }) - } - - let icon = "dialog-information-symbolic" - if (Utils.lookUpIcon(app_icon)) - icon = app_icon - - if (app_entry && Utils.lookUpIcon(app_entry)) - icon = app_entry - - return Widget.Box({ - child: Widget.Icon(icon), - }) -} - -/** @param {import('resource:///com/github/Aylur/ags/service/notifications.js').Notification} n */ -function Notification(n) { - const icon = Widget.Box({ - vpack: "start", - class_name: "icon", - child: NotificationIcon(n), - }) - - const title = Widget.Label({ - class_name: "title", - xalign: 0, - justification: "left", - hexpand: true, - max_width_chars: 24, - label: n.summary, - use_markup: true, - }) - - const body = Widget.Label({ - class_name: "body", - hexpand: true, - use_markup: true, - xalign: 0, - justification: "left", - label: n.body, - wrap: true, - }) - - const content = Widget.Box({ - className: "content", - children: [ - icon, - Widget.Box({ - vertical: true, - children: [ - title, - body, - ] - }), - ], - }) - - const actions = Widget.Box({ - className: "actions", - children: n.actions.map(({ id, label }) => Widget.Button({ - className: "action", - on_clicked: () => { - n.invoke(id) - n.dismiss() - }, - hexpand: true, - child: Widget.Label(label), - })), - }) - - - return Widget.EventBox({ - attribute: { id: n.id }, - onPrimaryClick: n.dismiss, - child: Widget.Box({ - classNames: ["notification", n.urgency], - vertical: true, - children: [ - content, - actions, - ], - }), - }) -} - -function NotificationList() { - const list = Widget.Box({ - css: "min-width: 2px; min-height: 2px;", - vertical: true, - spacing: 10, - children: notifications.popups.map(Notification), - }) - - function onNotified(_, /** @type {number} */ id) { - const n = notifications.getNotification(id) - if (n) - list.children = [Notification(n), ...list.children] - } - - function onDismissed(_, /** @type {number} */ id) { - list.children.find(n => n.attribute.id === id)?.destroy() - } - - list.hook(notifications, onNotified, "notified") - .hook(notifications, onDismissed, "dismissed") - return list -} - -export function Notifications(monitor = 0) { - return Widget.Window({ - monitor, - exclusivity: "normal", - className: "notifications", - margins: [10, 10, 10, 10], - name: `notifications${monitor}`, - anchor: ["left", "top"], - child: NotificationList(), - }) -} diff --git a/modules/ags/config_old/notifications/style.css b/modules/ags/config_old/notifications/style.css deleted file mode 100644 index aa5b3a9..0000000 --- a/modules/ags/config_old/notifications/style.css +++ /dev/null @@ -1,59 +0,0 @@ -.notification { - min-width: 300px; - padding: 10px; - background-color: alpha(@ctp-base, 0.7); - border-radius: 5px; - - border: 1px solid; - border-left: 5px solid; - border-color: @ctp-overlay1; -} - -.notification.low { - border-color: @ctp-base; -} - -.notification.critical { - border-color: @ctp-red; -} - -.notification .icon { - min-width: 68px; - min-height: 68px; - margin-right: 1em; -} - -.notification .icon image { - font-size: 58px; - /* to center the icon */ - margin: 5px; - color: @ctp-text; -} - -.notification .icon box { - min-width: 68px; - min-height: 68px; - border-radius: 7px; -} - -.notification .actions .action { - margin: 0 .4em; - margin-top: .8em; -} - -.notification .actions .action:first-child { - margin-left: 0; -} - -.notification .actions .action:last-child { - margin-right: 0; -} - -.notification .title { - color: @ctp-text; - font-size: 1.4em; -} - -.notification .body { - color: @ctp-subtext0; -} diff --git a/modules/ags/config_old/style.css b/modules/ags/config_old/style.css deleted file mode 100644 index b0053a9..0000000 --- a/modules/ags/config_old/style.css +++ /dev/null @@ -1,22 +0,0 @@ -@import url("colors.css"); -@import url("notifications/style.css"); -@import url("media/style.css"); - - -.bar > box { - padding: 10px; - border-radius: 5px; - - background-color: alpha(@ctp-base, 0.95); - color: @ctp-text; -} - -.clock .time { - font-weight: bold; - font-size: 1em; -} - -.clock .date { - font-size: 0.8em; -} - diff --git a/modules/ags/config_old/tsconfig.json b/modules/ags/config_old/tsconfig.json deleted file mode 100644 index f03f2d1..0000000 --- a/modules/ags/config_old/tsconfig.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "compilerOptions": { - "target": "ES2022", - "module": "ES2022", - "lib": [ - "ES2022" - ], - "allowJs": true, - "checkJs": true, - "strict": true, - "noImplicitAny": false, - "baseUrl": ".", - "typeRoots": [ - "./types" - ], - "skipLibCheck": true - } -} \ No newline at end of file diff --git a/modules/ags/config_old/types b/modules/ags/config_old/types deleted file mode 120000 index b7f3cac..0000000 --- a/modules/ags/config_old/types +++ /dev/null @@ -1 +0,0 @@ -/home/kalle/.local/share/com.github.Aylur.ags/types \ No newline at end of file diff --git a/modules/ags/default.nix b/modules/ags/default.nix index f8a806f..993d0ff 100644 --- a/modules/ags/default.nix +++ b/modules/ags/default.nix @@ -1,15 +1,20 @@ { inputs, + pkgs, ... }: - { - home-manager.users.kalle = { imports = [ inputs.ags.homeManagerModules.default ]; programs.ags = { enable = true; configDir = ./config; + extraPackages = with inputs.ags.packages.${pkgs.system}; [ + tray + hyprland + mpris + wireplumber + ]; }; }; }