From cc6bd77a0c4de4607f1d2f6bf88c0f87b2642eef Mon Sep 17 00:00:00 2001 From: Dennis Schoepf Date: Sun, 23 Nov 2025 23:34:40 +0100 Subject: [PATCH] updates swaync config --- modules/wezterm/config/overrides.lua | 2 +- modules/wm/swaync/config.json | 29 +- modules/wm/swaync/style.css | 424 +++++++++++++++++++++++++-- 3 files changed, 414 insertions(+), 41 deletions(-) diff --git a/modules/wezterm/config/overrides.lua b/modules/wezterm/config/overrides.lua index 4792159..da67862 100644 --- a/modules/wezterm/config/overrides.lua +++ b/modules/wezterm/config/overrides.lua @@ -16,7 +16,7 @@ function M.apply_to_config(config) config.window_decorations = "NONE" config.window_padding = helpers.get_padding(18, 6) config.window_background_opacity = 0.92 - config.enable_wayland = false; + -- config.enable_wayland = false; end end diff --git a/modules/wm/swaync/config.json b/modules/wm/swaync/config.json index 450c542..17a401b 100644 --- a/modules/wm/swaync/config.json +++ b/modules/wm/swaync/config.json @@ -15,23 +15,27 @@ "positionX": "right", "positionY": "top", "widget-config": { + "title": { + "clear-all-button": false, + "text": "Notifications" + }, "buttons-grid": { "actions": [ { - "command": "iwgtk", - "label": " 󰖩 " + "command": "wezterm start -- nmtui", + "label": " 󰛳 " }, { "command": "wezterm start -- bluetui", "label": " 󰂯 " }, { - "command": "niri msg action quit", - "label": " 󰍃 " + "command": "hyprlock", + "label": " 󰌾 " }, { - "command": "swaylock", - "label": " 󰌾 " + "command": "niri msg action quit", + "label": " 󰍃 " }, { "command": "systemctl reboot", @@ -44,25 +48,16 @@ ], "buttons-per-row": 3 }, - "dnd": { - "clear-all-button": true, - "text": "Do Not Disturb" - }, "mpris": { "autohide": true, "loop-carousel": false, "show-album-art": "always" - }, - "title": { - "clear-all-button": false, - "text": "Control Panel" } }, "widgets": [ "title", - "dnd", - "buttons-grid", "notifications", - "mpris" + "mpris", + "buttons-grid" ] } diff --git a/modules/wm/swaync/style.css b/modules/wm/swaync/style.css index 663c7cb..535a042 100644 --- a/modules/wm/swaync/style.css +++ b/modules/wm/swaync/style.css @@ -32,41 +32,419 @@ @define-color silver #b8c6d5; @define-color silver_bright #ffffff; -.control-center { - border-radius: 0; - background: @bg; - color: @fg; -} - -.control-center-list-placeholder { - opacity: 0; -} - -.control-center-list { +notificationwindow, blankwindow, blankwindow { background: transparent; } -.control-center-list>.notification { - box-shadow: none; -} - -.notification-group { - background: transparent; -} - -.notification-group>.notification { - border: 1px solid $cyan_subtle_bg; -} - .close-button { + /* The notification Close Button */ background: @magenta_subtle_bg_darker; color: @magenta_brighter; text-shadow: none; + padding: 0; border-radius: 100%; + margin-top: 16px; + margin-right: 16px; + box-shadow: none; + border: none; + min-width: 24px; + min-height: 24px; } .close-button:hover { + box-shadow: none; background: @red_subtle_bg; color: @red_bright; + border: none; +} + +.notification-row { + background: none; + outline: none; +} + +.notification-row:focus { + background-color: @bg_secondary; +} + +.notification-row .notification-background { + padding: 0; + background: transparent; +} + +.notification-row .notification-background .notification { + /* The actual notification */ + border: none; + border-radius: 12px; + padding: 6px 12px; + margin: 8px; + background-color: @bg; +} + +.notification-row .notification-background .notification:hover { + background-color: @bg; +} + +.notification-row .notification-background .notification.low { + /* Low Priority Notification */ +} + +.notification-row .notification-background .notification.normal { + /* Normal Priority Notification */ +} + +.notification-row .notification-background .notification.critical { + /* Critical Priority Notification */ +} + +.notification-row .notification-background .notification .notification-default-action { + /* The large action that also displays the notification summary and body */ + padding: 4px; + margin: 0; + box-shadow: none; + background: transparent; + border: none; + color: @fg; + border-radius: 12px; +} + +.notification-row .notification-background .notification .notification-default-action:hover { + -gtk-icon-filter: none; + background-color: @bg; +} + +.notification-row .notification-background .notification .notification-default-action:not(:only-child) { + /* When alternative actions are visible */ + border-bottom-left-radius: 0px; + border-bottom-right-radius: 0px; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content { + background: transparent; + border-radius: 12px; + padding: 0; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .image { + /* Notification Primary Image */ + -gtk-icon-filter: none; + -gtk-icon-size: 24px; + border-radius: 100px; + /* Size in px */ + margin: 4px; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .app-icon { + /* Notification app icon (only visible when the primary image is set) */ + -gtk-icon-filter: none; + -gtk-icon-size: 24px; + -gtk-icon-shadow: 0 1px 4px black; + margin: 6px; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .text-box label { + /* Fixes base GTK 4 CSS setting a filter of opacity 50% for some odd reason */ + filter: none; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .text-box .summary { + /* Notification summary/title */ + font-size: 1.2rem; + margin-top: 6px; + margin-left: 6px; + font-weight: bold; + background: transparent; + color: @fg; + text-shadow: none; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .text-box .time { + /* Notification time-ago */ + margin-top: 8px; + font-size: 1rem; + font-weight: normal; + background: transparent; + color: @fg_dim; + text-shadow: none; + margin-right: 32px; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .text-box .body { + /* Notification body */ + margin-top: 4px; + margin-bottom: 6px; + margin-left: 6px; + font-size: 1rem; + font-weight: normal; + background: transparent; + color: @fg_dim; + text-shadow: none; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content progressbar { + /* The optional notification progress bar */ + margin-top: 4px; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .body-image { + /* The "extra" optional bottom notification image */ + margin-top: 4px; + background-color: white; + -gtk-icon-filter: none; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .inline-reply { + /* The inline reply section */ + margin-top: 4px; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .inline-reply .inline-reply-entry { + background: @bg; + color: @green_bright; + caret-color: @green_bright; + border: @green_subtle_bg; + border-radius: 12px; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .inline-reply .inline-reply-button { + margin-left: 4px; + background: @green_subtle_bg; + border: green_subtle_bg; + border-radius: 12px; + color: @green_bright; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .inline-reply .inline-reply-button:disabled { + background: initial; + color: @grey; + border: 2px solid; + border-color: transparent; +} + +.notification-row .notification-background .notification .notification-default-action .notification-content .inline-reply .inline-reply-button:hover { + background: @bg_secondary; +} + +.notification-row .notification-background .notification .notification-alt-actions { + background: none; + border-bottom-left-radius: var(--border-radius); + border-bottom-right-radius: var(--border-radius); + padding: 4px; +} + +.notification-row .notification-background .notification .notification-action { + /* The alternative actions below the default action */ + margin: 4px; + padding: 0; +} + +.notification-row .notification-background .notification .notification-action > button { + border-radius: 12px; + color: @fg; +} + +.notification-group { + margin: 0; + padding: 0; +} + +.notification-group:focus { + background: @bg; +} + +.notification-group.low { + /* Low Priority Group */ +} + +.notification-group.normal { + /* Low Priority Group */ +} + +.notification-group.critical { + /* Low Priority Group */ +} + +.notification-group .notification-group-close-button .close-button { +} + +.notification-group .notification-group-buttons, .notification-group .notification-group-headers { + margin: 0 10px 4px 10px; + color: @fg; +} + +.notification-group .notification-group-headers { + /* Notification Group Headers */ +} + +.notification-group .notification-group-headers .notification-group-header { + font-size: 1.1rem; + font-weight: bold; +} + +.notification-group .notification-group-headers .notification-group-icon { + margin-top: 2px; + color: @fg_dim; + -gtk-icon-size: 24px; +} + +.notification-group .notification-group-buttons { + /* Notification Group Buttons */ + background-color: @bg; + color: @fg_dim; +} + +.notification-group.collapsed { + /* When another group is expanded, lower the opacity of the collapsed ones */ +} + +.notification-group.collapsed.not-expanded { + opacity: 0.4; +} + +.notification-group.collapsed .notification-row .notification { + background-color: @bg; +} + +.notification-group.collapsed .notification-row:not(:last-child) { + /* Top notification in stack */ + /* Set lower stacked notifications opacity to 0 */ +} + +.notification-group.collapsed .notification-row:not(:last-child) .notification-action, +.notification-group.collapsed .notification-row:not(:last-child) .notification-default-action { + opacity: 0; +} + +.notification-group.collapsed:hover .notification-row:not(:only-child) .notification { + background-color: @bg; +} + +.control-center { + /* The Control Center which contains the old notifications + widgets */ + background-color: @bg; + border-radius: 0; + color: @fg; +} + +.control-center .control-center-list-placeholder { + /* The placeholder when there are no notifications */ + opacity: 0; +} + +.control-center .control-center-list { + /* List of notifications */ + background: transparent; +} + +.control-center .control-center-list .notification { + box-shadow: none; + border: 2px solid @magenta_subtle_bg_darker; +} + +.control-center .control-center-list .notification .notification-default-action, +.control-center .control-center-list .notification .notification-action { +} + +.control-center .control-center-list .notification .notification-default-action:hover, +.control-center .control-center-list .notification .notification-action:hover { + background-color: @bg; +} + +.blank-window { + /* Window behind control center and on all other monitors */ + background: transparent; +} + +.floating-notifications { + background: transparent; +} + +.floating-notifications .notification { box-shadow: none; } + +.widget-mpris { + padding: 0; +} + +.widget-mpris .widget-mpris-player { + margin-bottom: 12px; + border-radius: 12px; + border: 2px solid @magenta_subtle_bg_darker; +} + +.widget-mpris .widget-mpris-player .mpris-background { + filter: blur(10px); +} + +.widget-mpris .widget-mpris-player .mpris-overlay { + padding: 12px; +} + +.widget-mpris .widget-mpris-player .mpris-overlay button:hover { + /* The media player buttons (play, pause, next, etc...) */ + background: @magenta_subtle_bg_darker; + color: @magenta_brighter; +} + +.widget-mpris .widget-mpris-player .mpris-overlay .widget-mpris-album-art { + border-radius: 8px; + -gtk-icon-size: 64px; +} + +.widget-mpris .widget-mpris-player .mpris-overlay .widget-mpris-title { + font-weight: bold; + font-size: 1.25rem; +} + +.widget-mpris .widget-mpris-player .mpris-overlay .widget-mpris-subtitle { + font-size: 1.1rem; + color: @fg_alt; +} + +.widget-mpris .widget-mpris-player .mpris-overlay > box > button { + /* Change player control buttons */ + color: @fg; +} + +.widget-mpris .widget-mpris-player .mpris-overlay > box > button:hover { + background-color: @magenta_subtle_bg_darker; +} + +.widget-mpris > box > button { + /* Change player side buttons */ +} + +.widget-mpris > box > button:disabled { + /* Change player side buttons insensitive */ + color: @grey; +} + +.widget-title > label { + margin-top: 8px; + margin-left: 12px; + font-size: 1.8rem; + font-weight: bold; + color: @fg_dim; +} + +/* .widget-buttons-grid { */ +/* padding: 0 20px 12px 20px; */ +/* } */ + +.widget-buttons-grid flowboxchild > button { + padding: 12px 0; + margin: 8px; + background-color: @magenta_subtle_bg_darker; + color: @magenta_brighter; +} + +.widget-buttons-grid flowboxchild > button:hover { + padding: 12px 0; + background-color: @magenta_subtle_bg; + color: @fg; +} + +.widget-buttons-grid flowboxchild > button.toggle:checked { + /* style given to the active toggle button */ +}