2 files changed, 35 insertions, 43 deletions
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/foundations/tokens/spacing-tokens.ts b/desktop/packages/mullvad-vpn/src/renderer/lib/foundations/tokens/spacing-tokens.ts
index 4216dde90a..50ead721b1 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/foundations/tokens/spacing-tokens.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/foundations/tokens/spacing-tokens.ts
@@ -1,15 +1,15 @@
-export enum SpacingTokens {
-  spacing1 = '4px',
-  spacing2 = '6px',
-  spacing3 = '8px',
-  spacing4 = '12px',
-  spacing5 = '16px',
-  spacing6 = '24px',
-  spacing7 = '32px',
-  spacing8 = '40px',
-  spacing9 = '48px',
-  spacing10 = '56px',
-  spacing11 = '64px',
-  spacing12 = '72px',
-  spacing13 = '80px',
-}
+export const spacingTokens = {
+  spc4: '4px',
+  spc6: '6px',
+  spc8: '8px',
+  spc12: '12px',
+  spc16: '16px',
+  spc24: '24px',
+  spc32: '32px',
+  spc40: '40px',
+  spc48: '48px',
+  spc56: '56px',
+  spc64: '64px',
+  spc72: '72px',
+  spc80: '80px',
+} as const;
diff --git a/desktop/packages/mullvad-vpn/src/renderer/lib/foundations/variables/spacing-variables.ts b/desktop/packages/mullvad-vpn/src/renderer/lib/foundations/variables/spacing-variables.ts
index add1d0315c..7890450c13 100644
--- a/desktop/packages/mullvad-vpn/src/renderer/lib/foundations/variables/spacing-variables.ts
+++ b/desktop/packages/mullvad-vpn/src/renderer/lib/foundations/variables/spacing-variables.ts
@@ -1,33 +1,25 @@
-import { SpacingTokens } from '../tokens';
+import { spacingTokens } from '../tokens';
 
 export const spacings = {
-  '--spacing-1': SpacingTokens.spacing1,
-  '--spacing-2': SpacingTokens.spacing2,
-  '--spacing-3': SpacingTokens.spacing3,
-  '--spacing-4': SpacingTokens.spacing4,
-  '--spacing-5': SpacingTokens.spacing5,
-  '--spacing-6': SpacingTokens.spacing6,
-  '--spacing-7': SpacingTokens.spacing7,
-  '--spacing-8': SpacingTokens.spacing8,
-  '--spacing-9': SpacingTokens.spacing9,
-  '--spacing-10': SpacingTokens.spacing10,
-  '--spacing-11': SpacingTokens.spacing11,
-  '--spacing-12': SpacingTokens.spacing12,
-  '--spacing-13': SpacingTokens.spacing13,
-};
+  '--spc-4': spacingTokens.spc4,
+  '--spc-8': spacingTokens.spc8,
+  '--spc-16': spacingTokens.spc16,
+  '--spc-24': spacingTokens.spc24,
+  '--spc-32': spacingTokens.spc32,
+} as const;
 
 export enum Spacings {
-  spacing1 = 'var(--spacing-1)',
-  spacing2 = 'var(--spacing-2)',
-  spacing3 = 'var(--spacing-3)',
-  spacing4 = 'var(--spacing-4)',
-  spacing5 = 'var(--spacing-5)',
-  spacing6 = 'var(--spacing-6)',
-  spacing7 = 'var(--spacing-7)',
-  spacing8 = 'var(--spacing-8)',
-  spacing9 = 'var(--spacing-9)',
-  spacing10 = 'var(--spacing-10)',
-  spacing11 = 'var(--spacing-11)',
-  spacing12 = 'var(--spacing-12)',
-  spacing13 = 'var(--spacing-13)',
+  spacing1 = 'var(--spc-4)',
+  spacing2 = 'var(--spc-6)',
+  spacing3 = 'var(--spc-8)',
+  spacing4 = 'var(--spc-12)',
+  spacing5 = 'var(--spc-16)',
+  spacing6 = 'var(--spc-24)',
+  spacing7 = 'var(--spc-32)',
+  spacing8 = 'var(--spc-40)',
+  spacing9 = 'var(--spc-48)',
+  spacing10 = 'var(--spc-56)',
+  spacing11 = 'var(--spc-64)',
+  spacing12 = 'var(--spc-72)',
+  spacing13 = 'var(--spc-80)',
 }