refactor: radii sizes and add keyframe

leather-io · Jan 11, 2024 · 814b3e4 · 814b3e4
1 parent a0c7482
commit 814b3e4
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 20 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/tokens/package.json b/packages/tokens/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@leather-wallet/tokens",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "Shared design tokens",
   "main": "src/index.ts",
   "homepage": "https://github.com/leather-wallet/mono/tree/dev/packages/tokens",

diff --git a/packages/tokens/src/keyframes.ts b/packages/tokens/src/keyframes.ts
@@ -15,15 +15,6 @@ export const keyframes = {
       backgroundPosition: '500px',
     },
   },
-  rotate: {
-    '0%': {
-      transform: 'rotate(0deg)',
-    },
-    '100%': {
-      transform: 'rotate(360deg)',
-    },
-  },
-  // TODO: identical to above, remove
   spin: {
     '0%': {
       transform: 'rotate(0deg)',
@@ -40,4 +31,14 @@ export const keyframes = {
       strokeDashoffset: 0,
     },
   },
+  slideUpAndFade: {
+    from: {
+      opacity: 0,
+      transform: 'translateY(2px)',
+    },
+    to: {
+      opacity: 1,
+      transform: 'translateY(0)',
+    },
+  },
 } as const;
diff --git a/packages/tokens/src/tokens.ts b/packages/tokens/src/tokens.ts
@@ -16,12 +16,10 @@ export const tokens = {
     xl: { value: '36px' },
   },
   radii: {
-    xs: { value: '8px' },
-    sm: { value: '10px' },
-    md: { value: '12px' },
-    lg: { value: '16px' },
-    xl: { value: '20px' },
-    xxl: { value: '24px' },
+    xs: { value: '2px' },
+    sm: { value: '4px' },
+    md: { value: '8px' },
+    lg: { value: '12px' },
   },
   spacing: {
     // Numbers are padded with 0 to ensure they are sorted correctly in TS