1 files changed, 41 insertions, 0 deletions
diff --git a/app_expo/theme/spacing.ts b/app_expo/theme/spacing.ts
new file mode 100644
index 0000000..b1b7935
--- /dev/null
+++ b/app_expo/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]