Add Spacing Tokens to MetaMask Design System with Tailwind Preset Access for React and React Native Packages

[brianacnguyen]

Description:

This ticket aims to add spacing tokens from @metamask/design-tokens to the MetaMask Design System Tailwind preset, ensuring that both the React and React Native packages can access and utilize these tokens through Tailwind CSS presets. This will standardize spacing across both platforms, aligning with MetaMask design principles.

Requirements:

• Add spacing tokens to the @metamask/metamask-design-system monorepo to provide consistent spacing across components.
• Update both React and React Native packages to access the spacing tokens through their respective Tailwind presets.
• Ensure that the Tailwind preset configuration in both packages includes the correct mapping of MetaMask spacing tokens to Tailwind spacing utilities (m, p, mt, mb, etc.).
• Verify the tokens are usable in both web (React) and mobile (React Native) environments.
• Ensure theme compatibility for both light and dark themes when using the spacing tokens.

Acceptance Criteria:

• Spacing tokens are added to the @metamask/metamask-design-system monorepo
• Both React and React Native packages have Tailwind presets that map spacing tokens correctly.