feat: swaync styling and config

config/matugen/config.toml

@@ -12,11 +12,6 @@ input_path = '~/.config/matugen/templates/gtk/colors.css'
 output_path = '~/.config/gtk-4.0/colors.css'
 post_hook = '~/.config/matugen/post-hook-scripts/gtk-themes-reload.sh'
 
-[templates.swaync-colors]
-input_path = '~/.config/matugen/templates/colors.css'
-output_path = "~/.config/swaync/colors.css"
-post_hook = "swaync-client -rs"
-
 [templates.waybar-colors]
 input_path = '~/.config/matugen/templates/colors.css'
 output_path = "~/.config/waybar/colors.css"
@@ -38,6 +33,12 @@ output_path = '~/.config/alacritty/colors.toml'
 input_path = '~/.config/matugen/templates/vesktop/midnight.css'
 output_path = '~/.config/vesktop/themes/midnight-discord.css'
 
+# From https://github.com/ErikReider/Linux/blob/master/dotfiles/.config/swaync/style.css
+[templates.swaync]
+input_path = '~/.config/matugen/templates/swaync/style.css'
+output_path = "~/.config/swaync/style.css"
+post_hook = "swaync-client -rs"
+
 
 # My own
 [templates.hyprland]

config/matugen/templates/swaync/style.css

@@ -0,0 +1,61 @@
+:root {
+    --border-radius: 22px;
+    --cc-bg: transparent;
+
+    --widget-background: {{ colors.surface.default.rgba | set_alpha: 0.7 }};
+    --noti-bg-alpha: 0.6;
+
+    --padding: calc(var(--border-radius) / 2);
+}
+
+.control-center {
+    border-radius: 0;
+}
+
+.widgets>.widget,
+.widget-mpris>carouselindicatordots,
+.widget-mpris>box>button {
+    background: var(--widget-background);
+    border-radius: var(--border-radius);
+    padding: calc(var(--border-radius) / 2);
+    border: var(--border);
+}
+
+.control-center-list-placeholder {
+    padding: var(--border-radius);
+}
+
+.notification-group {
+    border-radius: var(--border-radius);
+    padding: 8px;
+}
+
+.widget.widget-mpris {
+    background: transparent;
+    border-radius: 0;
+    padding: 0;
+    border: none;
+}
+
+.widget.widget-mpris>carouselindicatordots {
+    --dots-padding: 4px;
+    padding: var(--dots-padding);
+    padding-left: var(--dots-padding);
+    padding-right: calc(6px + var(--dots-padding));
+    margin: 0;
+    margin-top: var(--padding);
+}
+
+.widget-mpris>box>button:hover {
+    background: rgba(46, 46, 46, 1);
+}
+
+.widget-mpris-player {
+    box-shadow: none;
+    border: var(--border);
+    margin: 0 var(--padding);
+}
+
+.widget-mpris-player:only-child {
+    margin: 0;
+}

config/matugen/templates/waybar/style.css

@@ -63,6 +63,7 @@ tooltip {
 
 #clock,
 #tray,
+#submap,
 #workspaces {
     background-color: @surface;
     color: @primary;

config/swaync/config.jsonc

@@ -0,0 +1,101 @@
+{
+  "$schema": "/etc/xdg/swaync/configSchema.json",
+  "ignore-gtk-theme": true,
+  "positionX": "right",
+  "positionY": "top",
+  "layer": "overlay",
+  "control-center-layer": "top",
+  "layer-shell": true,
+  "layer-shell-cover-screen": true,
+  "cssPriority": "user",
+  "control-center-margin-top": 3,
+  "control-center-margin-bottom": 3,
+  "control-center-margin-right": 3,
+  "control-center-margin-left": 3,
+  "notification-2fa-action": true,
+  "notification-inline-replies": false,
+  "notification-body-image-height": 100,
+  "notification-body-image-width": 200,
+  "timeout": 10,
+  "timeout-low": 5,
+  "timeout-critical": 0,
+  "fit-to-screen": true,
+  "relative-timestamps": true,
+  "control-center-width": 500,
+  "control-center-height": 600,
+  "notification-window-width": 500,
+  "keyboard-shortcuts": true,
+  "notification-grouping": true,
+  "image-visibility": "when-available",
+  "transition-time": 200,
+  "hide-on-clear": false,
+  "hide-on-action": true,
+  "text-empty": "No Notifications",
+  "script-fail-notify": true,
+  // "scripts": {
+  //   "example-script": {
+  //     "app-name": "example.app.id",
+  //     "exec": "echo 'Do something...'",
+  //     "urgency": "Normal"
+  //   },
+  //   "example-action-script": {
+  //     "app-name": "example.app.id",
+  //     "exec": "echo 'Do something actionable!'",
+  //     "urgency": "Normal",
+  //     "run-on": "action"
+  //   }
+  // },
+  // "notification-visibility": {
+  //   "example-name": {
+  //     "state": "muted",
+  //     "urgency": "Normal",
+  //     "app-name": "example.app.id"
+  //   }
+  // },
+  "widgets": [
+    "inhibitors",
+    "title",
+    "dnd",
+    "notifications"
+  ],
+  "widget-config": {
+    "notifications": {
+      "vexpand": true
+    },
+    "inhibitors": {
+      "text": "Inhibitors",
+      "button-text": "Clear All",
+      "clear-all-button": true
+    },
+    "title": {
+      "text": "Notifications",
+      "clear-all-button": true,
+      "button-text": "Clear All"
+    },
+    "dnd": {
+      "text": "Do Not Disturb"
+    },
+    "label": {
+      "max-lines": 5,
+      "text": "Label Text"
+    },
+    "mpris": {
+      "blacklist": [],
+      "autohide": false,
+      "show-album-art": "always",
+      "loop-carousel": false
+    },
+    "buttons-grid": {
+      "buttons-per-row": 7,
+      "actions": [
+        {
+          "label": "直",
+          "type": "toggle",
+          "active": true,
+          "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'"
+        }
+      ]
+    }
+  }
+}

config/swaync/style.css

@@ -1 +0,0 @@
-@import "colors.css";