hyprland configs: update the swaync, wofi, and wlogout configs

configs/hyprland/kitty/config.conf

@@ -86,7 +86,7 @@ color14              #98d3ee
 color7               #cbced3
 color15              #d0d3d8
 
-background_opacity 0.7
+background_opacity 0.85
 
 # Сочетания клавиш / Keyboard shortcuts
 map kitty_mod+t     new_tab

configs/hyprland/swaync/config.json

@@ -3,24 +3,27 @@
 	"positionX": "right",
 	"positionY": "top",
 	"layer": "overlay",
-	"control-center-layer": "top",
 	"layer-shell": true,
 	"cssPriority": "user",
+
 	"control-center-width": 380,
 	"control-center-height": 760,
 	"control-center-margin-top": 2,
 	"control-center-margin-bottom": 2,
 	"control-center-margin-right": 1,
 	"control-center-margin-left": 0,
+
 	"notification-2fa-action": true,
 	"notification-inline-replies": false,
 	"notification-window-width": 400,
 	"notification-icon-size": 45,
 	"notification-body-image-height": 160,
 	"notification-body-image-width": 200,
+
 	"timeout": 4,
 	"timeout-low": 2,
 	"timeout-critical": 6,
+
 	"fit-to-screen": false,
 	"keyboard-shortcuts": true,
 	"image-visibility": "when-available",
@@ -28,10 +31,10 @@
 	"hide-on-clear": false,
 	"hide-on-action": false,
 	"script-fail-notify": true,
+
 	"widgets": [
 		"menubar#label",
 		"buttons-grid",
-		"volume",
 		"mpris",
 		"title",
 		"dnd",
@@ -50,12 +53,6 @@
 			"image-size": 96,
 			"image-radius": 12
 		},
-		"volume": {
-			"label": "󰕾",
-			"show-per-app": true,
-			"show-per-app-label": true,
-			"show-per-app-icon": true
-		},
 		"menubar#label": {
 			"menu#powermode-buttons": {
 				"label": " ",
@@ -88,27 +85,26 @@
 		"buttons-grid": {
 			"actions": [
 				{
-					"label": "  󰀑  ",
-					"type": "toggle",
-					"command": "sh -c '[[ $SWAYNC_TOGGLE_STATE == true ]] && nmcli radio wwan on || nmcli radio wwannmnm off'",
-					"update-command": "sh -c '[[ $(nmcli radio wwan) == \"enabled\" ]] && echo true || echo false'"
+					"label": " ",
+					"command": "wpctl set-mute @DEFAULT_AUDIO_SINK@ toggle"
 				},
 				{
-					"label": "    ",
-					"type": "toggle",
-					"command": "sh -c '[[ $SWAYNC_TOGGLE_STATE == true ]] && nmcli radio wifi on || nmcli radio wifi off'",
-					"update-command": "sh -c '[[ $(nmcli radio wifi) == \"enabled\" ]] && echo true || echo false'"
+					"label": "",
+					"command": "wpctl set-mute @DEFAULT_AUDIO_SOURCE@ toggle"
 				},
 				{
-					"label": "  ",
-					"type": "toggle",
-					"command": "sh -c '[[ $SWAYNC_TOGGLE_STATE == true ]] && bluetoothctl power on || bluetoothctl power off'",
-					"update-command": "sh -c '[[ $(bluetoothctl show | grep 'PowerState: on') ]] && echo true || echo false'"
+					"label": " ",
+					"command": "nm-connection-editor"
 				},
 				{
-					"label": "    "
-				}
+					"label": "󰂯",
+					"command": "blueman-manager"
+				},
+        {
+          "label": "",
+          "command": "gtklock"
+        }
 			]
 		}
 	}
-}
+}
\ No newline at end of file

configs/hyprland/swaync/style.css

@@ -10,84 +10,164 @@
 @define-color unfocused #f85656;
 
 * {
-	font-size: 14px;
-}
+	color: @text;
 
-.notification {
-	border-radius: 15px;
-	background-color: @bg
+	all: unset;
+	font-size: 14px;
+	transition: 200ms;
 }
 
-.notification-content {
-	padding: 10px;
-	background-color: @bg;
+.blank-window {
+	background: transparent;
 }
 
+/* CONTROL CENTER ------------------------------------------------------------------------ */
 
-.notification-default-action:hover,
-.notification-action:hover {
-	-gtk-icon-effect: none;
-	background: @selected_bg;
+.control-center {
+	background: alpha(@bg, 0.750);
+	border-radius: 24px;
+	-gtk-outline-radius: 1.705rem;
+	border: 1px solid @border;
+	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.6);
+	margin: 18px;
+	padding: 12px;
 }
 
-.body-image {
-	margin-top: 6px;
-	background-color: @bg;
+/* Notifications  */
+.control-center .notification-row .notification-background,
+.control-center
+	.notification-row
+	.notification-background
+	.notification.critical {
+	background-color: @selected_bg;
+	border-radius: 16px;
+	border: 0.5px solid @border;
+	margin: 4px 0px;
+	padding: 4px;
+}
+
+.control-center
+	.notification-row
+	.notification-background
+	.notification.critical {
+	color: @unfocused;
+}
+
+.control-center
+	.notification-row
+	.notification-background
+	.notification
+	.notification-content {
+	margin: 6px;
+	padding: 8px 6px 2px 2px;
+}
+
+.control-center
+	.notification-row
+	.notification-background
+	.notification
+	> *:last-child
+	> * {
+	min-height: 3.4em;
+}
+
+.control-center
+	.notification-row
+	.notification-background
+	.notification
+	> *:last-child
+	> *
+	.notification-action {
+	background: alpha(@bg, 0.6);
+	color: @text;
 	border-radius: 12px;
+	margin: 6px;
 }
 
-.summary {
-	color: @noti-text-color;
-	text-shadow: none;
+.control-center
+	.notification-row
+	.notification-background
+	.notification
+	> *:last-child
+	> *
+	.notification-action:hover {
+	background: @selected_bg;
+	border: 0.5px solid @selected_text;
 }
 
-.time {
-	color: @noti-text-color;
-	text-shadow: none;
-	margin-right: 18px;
+.control-center
+	.notification-row
+	.notification-background
+	.notification
+	> *:last-child
+	> *
+	.notification-action:active {
+	background: @selected_bg;
+	border: 0.5px solid @border;
 }
 
-.body {
-	background: @bg;
+/* Buttons */
+
+.control-center .notification-row .notification-background .close-button {
+	background: transparent;
+	border-radius: 6px;
 	color: @text;
-	text-shadow: none;
+	margin: 0px;
+	padding: 4px;
 }
 
-.control-center {
-	border-radius: 15px;
-	-gtk-outline-radius: 1.705rem;
-	border: 1px solid @border;
-	margin: 5px;
-	background-color: @bg;
-	padding: 5px;
+.control-center .notification-row .notification-background .close-button:hover {
+	background: @selected_bg;
+	border: 0.5px solid @border;
 }
 
-.control-center-dnd {
-	border-radius: 15px;
-	background: @bg;
-	border: 1px solid @border;
+.control-center
+	.notification-row
+	.notification-background
+	.close-button:active {
+	background: @selected_bg;
+	border: 0.5px solid @border;
 }
 
+/* Notifications expanded-group */
 
+.notification-group {
+	margin: 2px 8px 2px 8px;
+}
+.notification-group-headers {
+	font-weight: bold;
+	font-size: 1.25rem;
+	color: @text;
+	letter-spacing: 2px;
+}
 
-.control-center-dnd slider:checked {
-	background: @border;
-	border-radius: 15px;
+.notification-group-icon {
+	color: @selected_text;
+}
+
+.notification-group-collapse-button,
+.notification-group-close-all-button {
+	background: transparent;
+	color: @text;
+	margin: 4px;
+	border-radius: 6px;
+	padding: 4px;
 }
 
-/* title widget */
+.notification-group-collapse-button:hover,
+.notification-group-close-all-button:hover {
+	background: @selected_bg;
+	border: 0.5px solid @border;
+}
 
+/* WIDGETS --------------------------------------------------------------------------- */
+
+/* Notification clear button */
 .widget-title {
 	padding: 0.341rem;
 	margin: unset;
 }
 
-.widget-title label {
-	font-size: 1.364rem;
-	color: @text;
-	margin-left: 0.941rem;
-}
-
 .widget-title button {
 	border: unset;
 	background-color: unset;
@@ -97,99 +177,97 @@
 	margin-right: 0.841rem;
 }
 
-.widget-title button label {
-	font-size: 1.0409rem;
-	color: @text;
-	margin-right: 0.841rem;
-	font-family: FiraCode Nerd Font;
-}
 
 .widget-title button:hover {
 	background-color: @selected_bg;
-}
+	border: 1px solid @selected_text;
 
-.widget-title button:active {
-	background-color: @selected_bg;
 }
 
-/* Buttons widget */
-
-.widget-buttons-grid {
-	border-radius: 15px;
-	padding: unset;
+.widget-title button:active {
 	background-color: @selected_bg;
-	font-family: FiraCode Nerd Font;
+	border: 1px solid @selected_text;
 }
 
-.widget-buttons-grid>flowbox {
-	padding: unset;
+.widget-dnd > switch {
+	background: @selected_bg;;
+	font-size: initial;
+	border-radius: 8px;
+	box-shadow: none;
+	padding: 2px;
 }
 
-
-.widget-buttons-grid>flowbox>flowboxchild>button {
-	border: none;
-	background-color: unset;
-	min-width: 7.5rem;
-	min-height: 2.9rem;
-	padding: unset;
-	margin: unset;
+.widget-dnd > switch:hover {
+	background: @selected_bg;
 }
 
-.widget-buttons-grid>flowbox>flowboxchild>button label {
-	font-size: 20px;
-	color: @text;
-
+.widget-dnd > switch:checked {
+	background: @selected_bg;
 }
 
-.widget-buttons-grid>flowbox>flowboxchild>button:hover {
-	background-color: @hover_bg;
+.widget-dnd > switch:checked:hover {
+	background: @selected_bg;
 }
 
-.widget-buttons-grid>flowbox>flowboxchild>button:checked {
-	background-color: @accent;
+.widget-dnd > switch slider {
+	background: @selected_text;
+	border-radius: 6px;
 }
 
-.widget-buttons-grid>flowbox>flowboxchild>button:checked label {
-	color: @bg;
+.widget-dnd > switch slider:checked {
+	background: @border;
+	border-radius: 6px;
 }
 
-/* Volume widget */
 
-.widget-volume {
-	background-color: @selected_bg;
-	padding: 8px;
-	margin: 8px;
-	-gtk-outline-radius: 1.159rem;
-	-gtk-outline-radius: 1.159rem;
+/* Buttons menu */
+.widget-buttons-grid {
+	font-size: x-large;
+	padding: 6px 2px;
+	margin: 6px;
+	border-radius: 12px;
+	background: alpha(@selected_bg, 0.80);
 	font-family: FiraCode Nerd Font;
 }
 
-.widget-volume trough {
-	border: unset;
-	background-color: @selected_text;
+.widget-buttons-grid > flowbox > flowboxchild > button {
+	border: none;
+	margin: 4px 10px;
+	padding: 6px 12px;
+	background: transparent;
+	border-radius: 8px;
 }
 
+.widget-buttons-grid > flowbox > flowboxchild > button:hover {
+	background: @hover_bg;
+}
 
-.widget-volume trough slider {
-	color: unset;
-	background-color: @border;
-	border-radius: 100%;
-	min-height: 1.25rem;
+/* Music player */
+.widget-mpris {
+	background: @selected_bg;
+	border-radius: 16px;
+	color: @text;
+	margin: 20px 6px;
 }
 
+/* NOTE: Background need *opacity 1* otherwise will turn into the album art blurred  */
+.widget-mpris-player {
+	background: @selected_bg;
+	border-radius: 22px;
+	padding: 10px;
+	margin: 5px;
+}
 
-/* Mpris widget */
+.widget-mpris button {
+	color: alpha(@text, 0.9);
+}
 
-.widget-mpris {
-	background-color: @selected_bg;
-	padding: 8px;
-	margin: 8px;
-	border-radius: 15px;
+.widget-mpris button:hover {
+	color: alpha(@text, 0.5);
 }
 
-.widget-mpris-player {
-	padding: 0px;
-	margin: 0px;
+.widget-mpris-album-art {
+	border-radius: 16px;
 }
 
 .widget-mpris-title {
@@ -206,8 +284,8 @@
 }
 
 .powermode-buttons {
-	background-color: @bg;
-	padding: 8px;
+	background: alpha(@bg, 0.60);
+	padding: 10px;
 	margin: 8px;
 	border-radius: 15px;
 }
@@ -215,8 +293,85 @@
 .powermode-buttons>button {
 	background: transparent;
 	border: none;
+	padding: 5px;
 }
 
 .powermode-buttons>button:hover {
 	color: @selected_text;
 }
+
+.notification-row {
+  outline: none;
+  margin: 0;
+  padding: 0px;
+}
+
+.floating-notifications.background .notification-row .notification-background {
+  background: alpha(@selected_bg, .55);
+  box-shadow: 0 0 8px 0 rgba(0,0,0,.6);
+  border: 1px solid @border;
+  border-radius: 24px;
+  margin: 16px;
+  padding: 0;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification {
+  padding: 6px;
+  border-radius: 12px;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification .notification-content {
+  margin: 13px;
+}
+
+.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: 8px;
+  background-color: @hover_bg;
+  margin: 6px;
+  border: 1px solid transparent;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification > *:last-child > * .notification-action:hover {
+  background-color: @selected_bg;
+  border: 1px solid @border;
+}
+
+.floating-notifications.background .notification-row .notification-background .notification > *:last-child > * .notification-action:active {
+  background-color: @selected_bg;
+  color: @text;
+}
+
+.image {
+  margin: 10px 20px 10px 0px;
+}
+
+.summary {
+  font-weight: 800;
+  font-size: 1rem;
+}
+
+.body {
+  font-size: 0.8rem;
+}
+
+.floating-notifications.background .notification-row .notification-background .close-button {
+  margin: 6px;
+  padding: 2px;
+  border-radius: 6px;
+  background-color: transparent;
+  border: 1px solid transparent;
+}
+
+.floating-notifications.background .notification-row .notification-background .close-button:hover {
+  background-color: @hover_bg;
+}
+
+.floating-notifications.background .notification-row .notification-background .close-button:active {
+	background-color: @hover_bg;
+	color: @text;
+}
+

configs/hyprland/wlogout/layout

 {
     "label" : "lock",
     "action" : "gtklock",
-    "text": "Заблокировать"
+    "text": "Заблокировать",
+    "keybind" : "l"
 }
 
 {
     "label" : "hibernate",
     "action" : "systemctl hibernate",
-    "text": "Гибернация"
+    "text": "Гибернация",
+    "keybind" : "h"
 }
 
 {
     "label" : "logout",
-    "action" : "loginctl terminate-user $USER",
-    "text": "Выйти"
+    "action" : "loginctl kill-session $XDG_SESSION_ID",
+    "text": "     Выйти     ",
+    "keybind" : "e"
 }
 
 {
     "label" : "shutdown",
     "action" : "systemctl poweroff",
-    "text": "Выключение"
-}
-
-{
-    "label" : "suspend",
-    "action" : "systemctl suspend",
-    "text": "Сон"
+    "text": "Выключение",
+    "keybind" : "s"
 }
 
 {
     "label" : "reboot",
     "action" : "systemctl reboot",
-    "text": "Перезагрузка"
+    "text": "Перезагрузка",
+    "keybind" : "r"
 }

configs/hyprland/wlogout/style.css

-* {
-	background-image: none;
-	box-shadow: none;
-}
-
 window {
-	background-color: rgba(12, 12, 12, 0.9);
+	font-size: 16pt;
+	color: #fff;
+	background-color: rgba(12, 12, 12, 0.6);
 }
 
 button {
-    border-radius: 0;
-    border-color: #101322;
-	text-decoration-color: #FFFFFF;
-    color: #FFFFFF;
-	background-color: #0B0E1D;
-	border-style: solid;
-	border-width: 1px;
 	background-repeat: no-repeat;
 	background-position: center;
-	background-size: 25%;
-	font-size: 17px;
+	background-size: 20%;
+	background-color: transparent;
+	animation: gradient_f 20s ease-in infinite;
+	transition: all 0.3s ease-in;
+	box-shadow: 0 0 10px 2px transparent;
+	border-radius: 36px;
+	margin: 10px;
 }
 
-button:focus, button:active, button:hover {
-	background-color: #371c77;
-	outline-style: none;
+button:focus {
+	box-shadow: none;
+	background-size: 20%;
 }
 
-#lock {
-	border-radius: 15px 0px 0px 0px;
-    background-image: image(url("/usr/share/wlogout/icons/lock.png"));
+button:hover {
+	background-size: 50%;
+	border: 2px solid #a6a7ac;
+	color: transparent;
+	transition: all 0.4s cubic-bezier(0.55, 0, 0.28, 1.682), box-shadow 1s ease-in;
 }
 
-#logout {
-    background-image: image(url("/usr/share/wlogout/icons/logout.png"));
+#shutdown {
+	background-image: image(url("/etc/ximperdistro/hyprland/wlogout/icons/power.png"));
 }
 
-#suspend {
-	border-radius: 0px 15px 0px 0px;
-    background-image: image(url("/usr/share/wlogout/icons/suspend.png"));
+#logout {
+	background-image: image(url("/etc/ximperdistro/hyprland/wlogout/icons/logout.png"));
 }
 
-#hibernate {
-	border-radius: 0px 0px 0px 15px;
-    background-image: image(url("/usr/share/wlogout/icons/hibernate.png"));
+#reboot {
+	background-image: image(url("/etc/ximperdistro/hyprland/wlogout/icons/restart.png"));
 }
 
-#shutdown {
-    background-image: image(url("/usr/share/wlogout/icons/shutdown.png"));
+#lock {
+	background-image: image(url("/etc/ximperdistro/hyprland/wlogout/icons/lock.png"));
 }
 
-#reboot {
-	border-radius: 0px 0px 15px 0px;
-    background-image: image(url("/usr/share/wlogout/icons/reboot.png"));
+#hibernate {
+	background-image: image(url("/etc/ximperdistro/hyprland/wlogout/icons/hibernate.png"));
 }

configs/hyprland/wofi/style.css

 window {
     margin: 1px;
-    border: 10px solid #7E01FF;
+    border: 2px solid #7E01FF;
     border-radius: 13px;
 }