From e5021187e96b78b53203bd95d08d6818aea47d17 Mon Sep 17 00:00:00 2001
From: "Thomas F. K. Jorna" <thomasfkjorna@gmail.com>
Date: Wed, 14 Jul 2021 15:10:31 +0200
Subject: New Ignite 7.0.6 app

---
 app/theme/spacing.ts | 41 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 app/theme/spacing.ts

(limited to 'app/theme/spacing.ts')

diff --git a/app/theme/spacing.ts b/app/theme/spacing.ts
new file mode 100644
index 0000000..b1b7935
--- /dev/null
+++ b/app/theme/spacing.ts
@@ -0,0 +1,41 @@
+/**
+ * NOTE TO DEVS:
+ *
+ * Spacing should be consistent and whitespace thought of as a first class technique up
+ * there with color and typefaces.
+ *
+ * Which type of scale you use is based on the design.
+ *
+ * If you've got simpler app, you may only need 6 items.  Or maybe you want a spacing scale
+ * to be named:
+ *
+ * export const spacing = {
+ *   tiny: 4,
+ *   small: 8,
+ *   medium: 12,
+ *   large: 24,
+ *   huge: 64
+ * }
+ *
+ * Whatever you choose, try to stick with these, and not freestyle it everywhere.
+ *
+ * Feel free to delete this block.
+ */
+
+/**
+ * The available spacing.
+ *
+ * Here's the rough guideline.  Customize this for you usage.  It's ok to put exceptions
+ * within the components themselves if they are truly exceptions.
+ *
+ * 0 = none    - nothing. only here to bust out of a zero-based array.
+ * 1 = tiny    - elements contextually close to each other
+ * 2 = smaller - for groups of closely related items or perhaps borders
+ * 3 = small   - ?
+ * 4 = medium  - ?
+ * 5 = medium+ - ?
+ * 6 = large   - between groups of content that aren't related?
+ * 7 = huge    - ?
+ * 8 = massive - an uncomfortable amount of whitespace
+ */
+export const spacing = [0, 4, 8, 12, 16, 24, 32, 48, 64]
-- 
cgit v1.2.3