From a617d4091cd90d645a1181a5a6f6f500a36639b9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rodrigo=20Gir=C3=A3o=20Serr=C3=A3o?=
 <5621605+rodrigogiraoserrao@users.noreply.github.com>
Date: Wed, 21 Dec 2022 16:48:43 +0000
Subject: [PATCH] Add example with all margin rules.

---
 docs/examples/styles/margin_all.css | 54 +++++++++++++++++++++++++++++
 docs/examples/styles/margin_all.py  | 20 +++++++++++
 2 files changed, 74 insertions(+)
 create mode 100644 docs/examples/styles/margin_all.css
 create mode 100644 docs/examples/styles/margin_all.py

diff --git a/docs/examples/styles/margin_all.css b/docs/examples/styles/margin_all.css
new file mode 100644
index 000000000..a6b1e7dc3
--- /dev/null
+++ b/docs/examples/styles/margin_all.css
@@ -0,0 +1,54 @@
+Screen {
+    background: $background;
+}
+
+Grid {
+    grid-size: 4;
+    grid-gutter: 1 2;
+}
+
+Placeholder {
+    width: 100%;
+    height: 100%;
+}
+
+Container {
+    width: 100%;
+    height: 100%;
+}
+
+.bordered {
+    border: white round;
+}
+
+#p1 {
+    /* default is no margin */
+}
+
+#p2 {
+    margin: 1;
+}
+
+#p3 {
+    margin: 1 5;
+}
+
+#p4 {
+    margin: 1 1 2 6;
+}
+
+#p5 {
+    margin-top: 4;
+}
+
+#p6 {
+    margin-right: 3;
+}
+
+#p7 {
+    margin-bottom: 4;
+}
+
+#p8 {
+    margin-left: 3;
+}
diff --git a/docs/examples/styles/margin_all.py b/docs/examples/styles/margin_all.py
new file mode 100644
index 000000000..b88705f26
--- /dev/null
+++ b/docs/examples/styles/margin_all.py
@@ -0,0 +1,20 @@
+from textual.app import App
+from textual.containers import Container, Grid
+from textual.widgets import Placeholder
+
+
+class MarginAllApp(App):
+    def compose(self):
+        yield Grid(
+            Container(Placeholder("no margin", id="p1"), classes="bordered"),
+            Container(Placeholder("margin: 1", id="p2"), classes="bordered"),
+            Container(Placeholder("margin: 1 5", id="p3"), classes="bordered"),
+            Container(Placeholder("margin: 1 1 2 6", id="p4"), classes="bordered"),
+            Container(Placeholder("margin-top: 4", id="p5"), classes="bordered"),
+            Container(Placeholder("margin-right: 3", id="p6"), classes="bordered"),
+            Container(Placeholder("margin-bottom: 4", id="p7"), classes="bordered"),
+            Container(Placeholder("margin-left: 3", id="p8"), classes="bordered"),
+        )
+
+
+app = MarginAllApp(css_path="margin_all.css")