import {Meta, Story, Canvas} from '@storybook/addon-docs/blocks'

import Logo from '.'

<Meta title="Components/Atoms/Logo" component={Logo} />

# Logo

Use this component to display a button. Use it anywhere you would use an `<a>` or `<button>` element.

<Canvas>
  <Story name="Component">
    <div className="p-12" style={{backgroundColor: '#f9fbfd'}}>
      <Logo type="dark" className="m-auto" />
    </div>
  </Story>
</Canvas>

## Type

The logo can be `light` or `dark`. Use the `type` prop to control this.

<Canvas>
  <Story name="Type">
    <div className="p-12" style={{backgroundColor: '#414141'}}>
      <Logo type="light" className="m-auto" />
    </div>
  </Story>
</Canvas>
