Add "spacing.css" to @eventstore-ui/assets.

- Move `assets` to "packages" folder, as it's not a tool.
- Add spacing to `dev.css` for internal configs

.changeset/nasty-elephants-drive.md

@@ -0,0 +1,5 @@
+---
+'@eventstore-ui/assets': minor
+---
+
+Added "spacing" css file

tools/assets/package.json → packages/assets/package.json

@@ -6,11 +6,12 @@
     "files": [
         "assets/",
         "font-face.css",
+        "spacing.css",
         "index.ts"
     ],
     "repository": {
         "type": "git",
         "url": "[email protected]:EventStore/Design-System.git",
-        "directory": "tools/assets"
+        "directory": "packages/assets"
     }
 }

packages/assets/spacing.css

@@ -0,0 +1,15 @@
+:root {
+    /** The basic unit of spacing */
+    --spacing-base: 8px;
+
+    --spacing-0: 0;
+    --spacing-0_5: calc(var(--spacing-base) * 0.5);
+    --spacing-1: var(--spacing-base);
+    --spacing-1_5: calc(var(--spacing-base) * 1.5);
+    --spacing-2: calc(var(--spacing-base) * 2);
+    --spacing-2_5: calc(var(--spacing-base) * 2.5);
+    --spacing-3: calc(var(--spacing-base) * 3);
+    --spacing-4: calc(var(--spacing-base) * 4);
+    --spacing-5: calc(var(--spacing-base) * 5);
+    --spacing-6: calc(var(--spacing-base) * 6);
+}

tools/stencilConfig/dev/dev.css

@@ -1,3 +1,4 @@
+@import url('~@eventstore-ui/assets/spacing.css');
 @import url('~@eventstore-ui/layout/css/root.css');
 @import url('~@eventstore-ui/assets/font-face.css');
 

yarn.lock

@@ -2017,9 +2017,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@eventstore-ui/assets@workspace:*, @eventstore-ui/assets@workspace:tools/assets":
+"@eventstore-ui/assets@workspace:*, @eventstore-ui/assets@workspace:packages/assets":
   version: 0.0.0-use.local
-  resolution: "@eventstore-ui/assets@workspace:tools/assets"
+  resolution: "@eventstore-ui/assets@workspace:packages/assets"
   languageName: unknown
   linkType: soft