@mozaic-ds/vue/src/components/Introduction.mdx

Mozaic-Vue is the Vue.js implementation of ADEO Design system

import { Meta, Source } from '@storybook/addon-docs/blocks';
import ads from '../../.storybook/assets/logo.svg';
import vue from '../../.storybook/assets/vue.svg';

<Meta title="Introduction" />

<p
  style={{
    display: 'flex',
    alignItems: 'center',
    justifyContent: 'center',
    gap: '1rem',
  }}
>
  <img src={ads} alt="ADEO Design system logo" style={{ height: '80px' }} />
  <span style={{ fontSize: '32px' }}>x</span>
  <img src={vue} alt="Vue.js logo" style={{ height: '80px' }} />
</p>

<h1 align="center">ADEO Design system - Vue.js library</h1>

<p align="center">
  A library of **Vue.js** components implementing **ADEO Design system**
  guidelines.
</p>

<div
  style={{
    display: 'flex',
    alignItems: 'center',
    justifyContent: 'center',
    gap: '0.5rem',
  }}
>
  <a href="https://www.npmjs.com/package/@mozaic-ds/vue">
    <img
      src="https://img.shields.io/npm/v/@mozaic-ds/vue?label=NPM&logo=npm&color=yellow"
      alt="npm version"
    />
  </a>
  <a href="https://github.com/adeo/mozaic-vue/blob/main/CONTRIBUTING.md">
    <img
      src="https://img.shields.io/badge/PRs-welcome-blue.svg?logo=github"
      alt="PRs welcome"
    />
  </a>
  <a href="https://app.slack.com/client/T4R6RCZFA/CN4K3A99R">
    <img
      src="https://img.shields.io/badge/Slack-mozaic_vue-611f69.svg?logo=slack"
      alt="Slack mozaic-vue"
    />
  </a>
  <a href="https://keys.adeo.com/keys/ls/space/2583429798460717/adeo-adeo-design-system">
    <img
      src="https://img.shields.io/badge/KEYS-Adeo_Design_System-4526ce.svg"
      alt="KEYS ADEO Design system"
    />
  </a>
</div>

<br />
<br />

## 🪄 Introduction

ADEO Design system is a global and collaborative design system
that facilitates the designer and developer experience,
enabling them to create universal interfaces
perfectly aligned with the business strategy of Adeo.

## 🎨 Getting Started

Ready to begin using Mozaic in your project?\
Our Getting Started guide will walk you through the basics, \
from setting up the system to implementing core components in your application.

Whether you're new to Mozaic or just need a refresher, \
this guide has everything you need to hit the ground running.

Read how to **[Setup your application](/docs/getting-started--docs)**!

## 🤝 Contributing

Be part of something bigger!

**Mozaic-Vue** is made possible by an incredible community that finds issues and creates pull requests.\
It is our job to enable you to create amazing applications.

To do so, see our **[contributing process](/docs/contributing--docs)**.

## ℹ️ Support

If you have any questions or need assistance,\
we are here to help.

Whether you're troubleshooting, looking for documentation,\
or need to get in touch with our team,\
you'll find all the resources you need to get the most out of **Mozaic-Vue**.

Visit our **[Support page](/docs/support--docs)** for more information.