Add mpris (media player) widget to waybar

desktop-gruvbox-sway/.config/waybar/config

@@ -3,7 +3,7 @@
 	"height": 40,
 	"modules-left": ["sway/workspaces", "sway/mode", "idle_inhibitor"],
 	"modules-center": ["tray"],
-	"modules-right": ["pulseaudio", "battery", "clock"],
+	"modules-right": ["mpris", "pulseaudio", "battery", "clock"],
 	"sway/workspaces": {
 		"disable-scroll": true,
 		"persistent_workspaces": {
@@ -46,6 +46,21 @@
 		"format-plugged": "{icon} {capacity}%",
 		"format-icons": ["", "", "", "", ""]
 	},
+	"mpris": {
+		"interval": 1,
+		"format": "{status_icon} {title} {player_icon}",
+		"ignored-players": [
+			"firefox"
+		],
+		"player-icons": {
+			"default": "♫"
+		},
+		"status-icons": {
+			"playing": "⏵",
+			"paused": "⏸",
+			"stopped": "⏹"
+		}
+	},
 	"pulseaudio": {
 		"scroll-step": 0,
 		"format": "{icon} {volume}%",

desktop-gruvbox-sway/.config/waybar/style.css

@@ -8,7 +8,7 @@
 * {
 	border: none;
 	border-radius: 0;
-	font-family: IBM Plex Sans Medium;
+	font-family: "IBM Plex Sans Medium";
 	font-size: 13px;
 }
 
@@ -48,6 +48,17 @@ window#waybar {
 	padding: 0 1em;
 	color: #ebdbb2;
 }
+#mpris {
+	padding: 0 1em;
+}
+#mpris.playing {
+	background: #d3869b;
+	color: #282828;
+}
+#mpris.paused, #mpris.stopped {
+	background: #32302f;
+	color: #282828;
+}
 #idle_inhibitor {
 	padding: 0 1em;
 }