Apply standard spacing across all components

[fbarl]

Follow-up on #400 - probably it makes sense starting with large sizes down to small ones:

• 64px xxl
• 48px xl
• 32px large
• 24px base medium
• 16px small base
• 12px small
• 8px xs
• 4px mini xxs

[bia]

I would go with xxs instead of mini to avoid confusion.

[bia]

We'll address #324 within the scope of this issue.
cc @guyfedwards

[rndstr]

base

my 2c: is base being used anywhere else? this seems more like a default to me. base tells me that's the value we are basing all the others on which could be something completely different than the 'usual' value to use.

maybe we can name it medium instead to go with the sizing names of the others?

[bia]

@rndstr But at this point we are basing all of the other values on the base.
From #432 :

[rndstr]

@bia that makes totally sense then, thanks for explaining!

Should we also define them in relation to base then instead of hardcoding?

ui-components/src/theme/spacings.js

Lines 3 to 11 in e019f6c

	export const spacing = {
	none: '0',
	xss: '4px',
	xs: '8px',
	small: '16px',
	base: '24px',
	large: '48px',
	xl: '64px',
	};