style: add 4px margins to window and workspaces modules

These modules, unlike others, have no horizontal margins by default.
This means that they'll appear uncomfortably close together in any
config that puts them side-by-side. In general, the default style should
make configs with any module ordering look good. Add the same 4px
horizontal margins that other module have to these.

To preserve the current default appearance, exempt the workspace module
from a margin on the appropriate side when it's the leftmost or
rightmost module on the bar.

resources/style.css

@@ -83,6 +83,21 @@ window#waybar.chromium {
     color: #ffffff;
 }
 
+#window,
+#workspaces {
+    margin: 0 4px;
+}
+
+/* If workspaces is the leftmost module, omit left margin */
+.modules-left > widget:first-child > #workspaces {
+    margin-left: 0;
+}
+
+/* If workspaces is the rightmost module, omit right margin */
+.modules-right > widget:last-child > #workspaces {
+    margin-right: 0;
+}
+
 #clock {
     background-color: #64727D;
 }