swaync: add sway notification daemon

modules/hyprland.nix

@@ -52,5 +52,6 @@
     helvum
     ulauncher
     playerctl
+    swaynotificationcenter
   ];
 }

stow/.config/hypr/hyprland.conf

@@ -30,6 +30,7 @@ $menu = ulauncher-toggle
 exec-once = swww-daemon &
 exec-once = ulauncher --hide-window &
 exec-once = waybar &
+exec-once = swaync &
 
 
 #############################

stow/.config/swaync/style.css

@@ -0,0 +1,367 @@
+/* MIT License
+
+Copyright (c) 2021 Catppuccin
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.*/
+
+@define-color yellow #e0af68;
+@define-color background #1a1b26;
+@define-color text #c0caf5;
+@define-color blue #7aa2f7;
+@define-color red #f7768e;
+
+* {
+  all: unset;
+  font-size: 14px;
+  font-family: "JetBrainsMono Nerd Font";
+  transition: 200ms;
+}
+
+trough highlight {
+    background: @text;
+}
+
+scale trough {
+    margin: 0rem 1rem;
+    background-color: @background;
+    min-height: 8px;
+    min-width: 70px;
+}
+
+slider {
+    background-color: @blue;
+}
+
+.floating-notifications.background .notification-row .notification-background {
+  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.8), inset 0 0 0 1px @background;
+  border-radius: 12.6px;
+  margin: 18px;
+  background-color: @background;
+  color: @text;
+  padding: 0;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification {
+  padding: 7px;
+  border-radius: 12.6px;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification.critical {
+  box-shadow: inset 0 0 7px 0 @red;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification .notification-content {
+  margin: 7px;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification .notification-content .summary {
+  color: @text;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification .notification-content .time {
+  color: @subtext0;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification .notification-content .body {
+  color: @text;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification>*:last-child>* {
+  min-height: 3.4em;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification>*:last-child>* .notification-action {
+  border-radius: 7px;
+  color: @text;
+  background-color: @background;
+  box-shadow: inset 0 0 0 1px @surface1;
+  margin: 7px;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification>*:last-child>* .notification-action:hover {
+  box-shadow: inset 0 0 0 1px @surface1;
+  background-color: @background;
+  color: @text;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification>*:last-child>* .notification-action:active {
+  box-shadow: inset 0 0 0 1px @surface1;
+  background-color: @red;
+  color: @text;
+}
+
+.floating-notifications.background .notification-row .notification-background .close-button {
+  margin: 7px;
+  padding: 2px;
+  border-radius: 6.3px;
+  color: @background;
+  background-color: @red;
+}
+
+.floating-notifications.background .notification-row .notification-background .close-button:hover {
+  background-color: @maroon;
+  color: @background;
+}
+
+.floating-notifications.background .notification-row .notification-background .close-button:active {
+  background-color: @red;
+  color: @background;
+}
+
+.control-center {
+  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.8), inset 0 0 0 1px @background;
+  border-radius: 12.6px;
+  margin: 18px;
+  background-color: @background;
+  color: @text;
+  padding: 14px;
+}
+
+.control-center .widget-title>label {
+  color: @text;
+  font-size: 1.3em;
+}
+
+.control-center .widget-title button {
+  border-radius: 7px;
+  color: @text;
+  background-color: @background;
+  box-shadow: inset 0 0 0 1px @surface1;
+  padding: 8px;
+}
+
+.control-center .widget-title button:hover {
+  box-shadow: inset 0 0 0 1px @surface1;
+  background-color: @surface2;
+  color: @text;
+}
+
+.control-center .widget-title button:active {
+  box-shadow: inset 0 0 0 1px @surface1;
+  background-color: @red;
+  color: @background;
+}
+
+.control-center .notification-row .notification-background {
+  border-radius: 7px;
+  color: @text;
+  background-color: @background;
+  box-shadow: inset 0 0 0 1px @surface1;
+  margin-top: 14px;
+}
+
+.control-center .notification-row .notification-background .notification {
+  padding: 7px;
+  border-radius: 7px;
+}
+
+.control-center .notification-row .notification-background .notification.critical {
+  box-shadow: inset 0 0 7px 0 @red;
+}
+
+.control-center .notification-row .notification-background .notification .notification-content {
+  margin: 7px;
+}
+
+.control-center .notification-row .notification-background .notification .notification-content .summary {
+  color: @text;
+}
+
+.control-center .notification-row .notification-background .notification .notification-content .time {
+  color: @subtext0;
+}
+
+.control-center .notification-row .notification-background .notification .notification-content .body {
+  color: @text;
+}
+
+.control-center .notification-row .notification-background .notification>*:last-child>* {
+  min-height: 3.4em;
+}
+
+.control-center .notification-row .notification-background .notification>*:last-child>* .notification-action {
+  border-radius: 7px;
+  color: @text;
+  background-color: @crust;
+  box-shadow: inset 0 0 0 1px @surface1;
+  margin: 7px;
+}
+
+.control-center .notification-row .notification-background .notification>*:last-child>* .notification-action:hover {
+  box-shadow: inset 0 0 0 1px @surface1;
+  background-color: @background;
+  color: @text;
+}
+
+.control-center .notification-row .notification-background .notification>*:last-child>* .notification-action:active {
+  box-shadow: inset 0 0 0 1px @surface1;
+  background-color: @red;
+  color: @text;
+}
+
+.control-center .notification-row .notification-background .close-button {
+  margin: 7px;
+  padding: 2px;
+  border-radius: 6.3px;
+  color: @background;
+  background-color: @maroon;
+}
+
+.close-button {
+  border-radius: 6.3px;
+}
+
+.control-center .notification-row .notification-background .close-button:hover {
+  background-color: @red;
+  color: @background;
+}
+
+.control-center .notification-row .notification-background .close-button:active {
+  background-color: @red;
+  color: @background;
+}
+
+.control-center .notification-row .notification-background:hover {
+  box-shadow: inset 0 0 0 1px @surface1;
+  background-color: @overlay1;
+  color: @text;
+}
+
+.control-center .notification-row .notification-background:active {
+  box-shadow: inset 0 0 0 1px @surface1;
+  background-color: @red;
+  color: @text;
+}
+
+.notification.critical progress {
+  background-color: @red;
+}
+
+.notification.low progress,
+.notification.normal progress {
+  background-color: @blue;
+}
+
+.control-center-dnd {
+  margin-top: 5px;
+  border-radius: 8px;
+  background: @background;
+  border: 1px solid @surface1;
+  box-shadow: none;
+}
+
+.control-center-dnd:checked {
+  background: @background;
+}
+
+.control-center-dnd slider {
+  background: @surface1;
+  border-radius: 8px;
+}
+
+.widget-dnd {
+  margin: 0px;
+  font-size: 1.1rem;
+}
+
+.widget-dnd>switch {
+  font-size: initial;
+  border-radius: 8px;
+  background: @background;
+  border: 1px solid @surface1;
+  box-shadow: none;
+}
+
+.widget-dnd>switch:checked {
+  background: @background;
+}
+
+.widget-dnd>switch slider {
+  background: @surface1;
+  border-radius: 8px;
+  border: 1px solid @overlay0;
+}
+
+.widget-mpris .widget-mpris-player {
+    background: @background;
+    padding: 7px;
+}
+
+.widget-mpris .widget-mpris-title {
+    font-size: 1.2rem;
+}
+
+.widget-mpris .widget-mpris-subtitle {
+    font-size: 0.8rem;
+}
+
+.widget-menubar>box>.menu-button-bar>button>label {
+    font-size: 3rem;
+    padding: 0.5rem 2rem;
+}
+
+.widget-menubar>box>.menu-button-bar>:last-child {
+    color: @red;
+}
+
+.power-buttons button:hover,
+.powermode-buttons button:hover,
+.screenshot-buttons button:hover {
+    background: @background;
+}
+
+.control-center .widget-label>label {
+  color: @text;
+  font-size: 2rem;
+}
+
+.widget-buttons-grid {
+    padding-top: 1rem;
+}
+
+.widget-buttons-grid>flowbox>flowboxchild>button label {
+    font-size: 2.5rem;
+}
+
+.widget-volume {
+    padding-top: 1rem;
+}
+
+.widget-volume label {
+    font-size: 1.5rem;
+    color: @red;
+}
+
+.widget-volume trough highlight {
+    background: @red;
+}
+
+.widget-backlight trough highlight {
+    background: @yellow;
+}
+
+.widget-backlight label {
+    font-size: 1.5rem;
+    color: @yellow;
+}
+
+.widget-backlight .KB {
+    padding-bottom: 1rem;
+}
+
+.image {
+  padding-right: 0.5rem;
+}

stow/.config/waybar/config.jsonc

@@ -38,7 +38,7 @@
     "backlight",
     "battery",
     "network",
-    "custom/power"
+    "custom/swaync"
   ],
 
   // Modules configuration
@@ -180,9 +180,9 @@
     "on-click": "helvum",
     "format-icons": ["", "", ""]
   },
-  "custom/power": {
+  "custom/swaync": {
-    "format": "⏻",
+    "format": " ",
-    "on-click": "poweroff", // just dont accidentally press this..
+    "on-click": "swaync-client -t",
     "tooltip": false
   }
 }

stow/.config/waybar/style.css

@@ -115,7 +115,7 @@ window#waybar {
 #pulseaudio,
 #mode,
 #tray,
-#custom-power,
+#custom-swaync,
 #custom-pacman,
 #custom-media,
 #mpd {
@@ -284,7 +284,7 @@ window#waybar {
 }
 
 #custom-media,
-#custom-power {}
+#custom-swaync {}
 
 #custom-media{
     background-color: @red;
@@ -294,7 +294,7 @@ window#waybar {
     margin-left: 15px;
 }
 
-#custom-power {
+#custom-swaync {
     color: @background;
     background-color: @red;
     border-radius: 10px;