feat: add mango modules: workspace,language,keymode,window,layout

2026-05-29 12:56:40 +08:00
parent 05945748dc
commit 3eeffbe389
21 changed files with 1597 additions and 0 deletions
@@ -0,0 +1,75 @@
+waybar-mango-layout(5)
+
+# NAME
+
+waybar - mango layout module
+
+# DESCRIPTION
+
+The *layout* module displays the current layout symbol of the monitor (e.g. "S", "M") in the Mango compositor.
+It supports dynamic CSS classes and custom formats based on the active layout symbol.
+
+# CONFIGURATION
+
+Addressed by *mango/layout*
+
+*format*: ++
+	typeof: string ++
+	default: {symbol} ++
+	The default format, how the layout symbol should be displayed. *{symbol}* is replaced by the current layout symbol.
+
+*format-<symbol>*: ++
+	typeof: string ++
+	default: *none* ++
+	The custom format to use when a specific layout symbol is active (e.g., *format-S*, *format-M*). Note that the symbol string is strictly case-sensitive. If no match is found, it falls back to *format*.
+
+*expand*: ++
+	typeof: bool ++
+	default: false ++
+	Enables the module to consume all leftover space.
+
+# FORMAT REPLACEMENTS
+
+*{symbol}*: The layout symbol reported by Mango (e.g., "S", "M", "Dwindle").
+
+# CUSTOM FORMATS
+
+You can define specific formats for different layouts by appending the exact layout symbol to the *format-* key in your configuration.
+
+For example, if your Mango compositor reports the symbol "S" for a spiral layout and "M" for a master layout, you can use *format-S* and *format-M* to define unique icons or text for each. Keep in mind that JSON keys are case-sensitive, so if the compositor sends "S", the key must be exactly *format-S*.
+
+# STYLE
+
+The layout module provides dynamic CSS classes based on the current layout symbol, allowing you to style each layout differently.
+
+* *#mango-layout*
+* *.<symbol>* - The current layout symbol is dynamically added as a CSS class name (e.g., *.S*, *.M*).
+
+# EXAMPLES
+
+```
+"mango/layout": {
+    "format": "[] {symbol}",
+    "format-S": "󰌌 {symbol}",
+    "format-M": "󰕰 {symbol}"
+}
+```
+
+## CSS Example
+
+```
+#mango-layout {
+    color: #ffffff;
+    padding: 0 5px;
+}
+
+/* Specific color for the "S" layout */
+#mango-layout.S {
+    color: #a6e3a1;
+}
+
+/* Specific color for the "M" layout */
+#mango-layout.M {
+    color: #f38ba8;
+}
+```