import { Meta } from '@storybook/addon-docs/blocks';

<Meta title="Docs/Intro" />

<div style={{ margin: '0 auto', maxWidth: '600px', color: 'white', textAlign: 'center' }}>
  <img
    style={{ width: '75%', margin: '0 auto 2em auto' }}
    src="https://raw.githubusercontent.com/ChamsBouzaiene/react-component-lib-boilerplate/main/stories/assets/logo.png"
  />
  <br />
  <br />
  <a href="https://github.com/ChamsBouzaiene/react-component-lib-boilerplate/actions/workflows/chromatic.yml">
    <img src="https://github.com/ChamsBouzaiene/react-component-lib-boilerplate/actions/workflows/chromatic.yml/badge.svg?branch=main" />
  </a>
  &nbsp;&nbsp;
  <a href="https://npm.im/react-component-lib-boilerplate">
    <img src="https://img.shields.io/npm/v/react-component-lib-boilerplate.svg" />
  </a>&nbsp;&nbsp;
  <a href="https://npm.im/react-component-lib-boilerplate">
    <img src="https://badgen.net/npm/dw/react-component-lib-boilerplate" />
  </a>&nbsp;&nbsp;
  <a href="https://github.com/ChamsBouzaiene/react-component-lib-boilerplate/blob/main/LICENSE">
    <img src="https://badgen.now.sh/badge/license/apache2" />
  </a>&nbsp;&nbsp;
  <a href="https://bundlephobia.com/result?p=react-component-lib-boilerplate">
    <img src="https://badgen.net/bundlephobia/minzip/react-component-lib-boilerplate" />
  </a>&nbsp;&nbsp;
  <a href="https://github.com/ChamsBouzaiene/react-component-lib-boilerplate/reaviz">
    <img alt="GitHub stars" src="https://img.shields.io/github/stars/ChamsBouzaiene/react-component-lib-boilerplate?style=social" />
  </a>&nbsp;&nbsp;
  <a href="https://discord.gg/ATTvQVug">
    <img src="https://img.shields.io/discord/844715176895840286?label=discord" />
  </a>

---

React Component Library boilerplate is component library that leverages React and github to create
a custome template for developpers that want to start building their component libraries the easy way

If you are looking for more information, checkout the get started docs.

</div>
