Globals 

The Globals Component Contains:

- Layout - Grids, Sections, Spacings, Layout Utilities
- Typography - All Global Headings, Paragraphs Styles
- Rich Text - Styles for Typography, Video Embed, Tables, Images, Lists etc
- Flex - Wrapper element for flex alignment and positioning

Installation

``shell
yarn add @berlitz/globals
`

Props

#### Headings Props

| Argument | Type | Required | Default | Example |
| ------------- | ------ | -------- | ------- | -------------- |
| inverse | bool | ❌ | false | |
| disableMargin | bool | ❌ | false | |
| highlight | string | ❌ | null | |
| color | string | ❌ | null | 'brandPrimary' |

#### Paragraphs Props

| Argument | Type | Required | Default | Example |
| -------- | ------ | -------- | ------- | -------------- |
| size | string | ❌ | md | sm / md / lg |
| color | string | ❌ | null | 'brandPrimary' |

#### RichText Props

| Argument | Type | Required | Default | Example |
| -------- | ---- | -------- | ------- | ------- |
| inverse | bool | ❌ | false | |

#### Flex Props

| Argument | Type | Required | Default | Example |
| -------- | ---- | -------- | ------- | ------- |
| alignItems | string | ❌ | | flex-end / flex-start |
| basis | string | ❌ | | auto / 0 / 200px |
| direction | string | ❌ | | row / column |
| grow | string | ❌ | | 1 / 0.5 / unset / inherit |
| inline | bool | ❌ | | |
| justifyContent | string | ❌ | | flex-end / flex-start / space-around, space-between |
| width | string | ❌ | | 200px / 50% |
| wrap | string | ❌ | | wrap / no-wrap |

Usage

`jsx
import { P, H1, H2, H3, H4, H5, RichText } from '@berlitz/globals/lib/components/typography'
import { Flex } from '@berlitz/globals/lib/components/Flex'

const MyApp = () => (
<>


Hello World