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

<Meta title={"Gordion App"} />

<style>
{`
    .gordionLogo{
        display:block;
        margin: 0 auto;
        margin-bottom: 4rem
    }

    .logoWrapper{
      width:100%;
      display: flex;
      justify-content: center;
      margin-bottom: 2rem
    }
`}
</style>

<div class="logoWrapper">
  <svg width="162" height="33" viewBox="0 0 162 33"><defs><path id="prefix__a" d="M0 32.233L161.986 32.233 161.986 0 0 0z"></path></defs><g fill="none" fill-rule="evenodd"><path fill="#E42028" d="M32.233 16.116c0 8.901-7.216 16.116-16.117 16.116S0 25.017 0 16.116C0 7.216 7.215 0 16.116 0s16.117 7.215 16.117 16.116"></path><path fill="#FEFEFE" d="M10.444 17.422c-.09-.383-.14-.781-.14-1.19 0-2.968 2.488-5.374 5.554-5.374 2.052 0 3.84 1.077 4.803 2.677 1.886-.433 3.905-.488 3.94-.488-1.302-3.438-4.724-5.894-8.743-5.894-5.138 0-9.302 4.013-9.302 8.964 0 1.136.222 2.222.62 3.222 1.02-.665 2.122-1.31 3.268-1.917"></path><path fill="#FEFEFE" d="M24.894 13.985c-1.429-.059-3.713.318-3.844.34l.004.01c-7.402 1.542-14.8 5.972-17.328 8.804-.16.18.068.428.268.29 3.136-2.182 8.33-4.734 16.844-4.819-.906 1.775-2.795 2.997-4.98 2.997-1.287 0-2.472-.425-3.414-1.138-1.33.346-2.6.778-3.808 1.295 1.706 2.023 4.307 3.316 7.222 3.316 5.138 0 9.303-4.013 9.303-8.964 0-.735-.094-1.448-.267-2.13"></path><g class="text" fill="#222323"><path d="M55.86 14.009v1.96c0 2.835-.89 5.131-2.664 6.888-1.776 1.758-4.082 2.637-6.916 2.637-3.02 0-5.5-.966-7.441-2.899-1.942-1.932-2.913-4.316-2.913-7.15 0-2.834.967-5.228 2.9-7.179 1.932-1.95 4.325-2.926 7.178-2.926 1.803 0 3.456.405 4.956 1.214 1.5.811 2.672 1.888 3.519 3.231l-4.196 2.402c-.386-.608-.952-1.095-1.697-1.464-.747-.367-1.588-.552-2.527-.552-1.528 0-2.78.497-3.755 1.491-.975.994-1.463 2.264-1.463 3.81 0 1.491.483 2.752 1.45 3.783.965 1.03 2.323 1.546 4.072 1.546 2.245 0 3.726-.847 4.444-2.541h-4.693v-4.251h9.746zM63.811 19.185c.994.985 2.236 1.478 3.728 1.478 1.49 0 2.733-.493 3.726-1.478.994-.984 1.491-2.24 1.491-3.768 0-1.528-.497-2.784-1.49-3.769-.994-.984-2.237-1.477-3.727-1.477-1.492 0-2.734.493-3.728 1.477-.994.985-1.49 2.241-1.49 3.77 0 1.527.496 2.783 1.49 3.767m10.92 3.396c-1.96 1.942-4.358 2.913-7.192 2.913-2.835 0-5.233-.97-7.193-2.913-1.96-1.94-2.94-4.33-2.94-7.164 0-2.835.98-5.223 2.94-7.165 1.96-1.942 4.358-2.912 7.193-2.912 2.834 0 5.231.97 7.192 2.912 1.96 1.942 2.94 4.33 2.94 7.165 0 2.834-.98 5.223-2.94 7.164M84.904 10.31v4.333h2.733c.608.02 1.105-.174 1.49-.579.387-.405.58-.929.58-1.574 0-.644-.193-1.168-.58-1.574-.385-.404-.882-.607-1.49-.607h-2.733zm5.136 14.77l-3.37-6.24h-1.766v6.24h-4.942V5.754h7.73c1.97 0 3.622.63 4.956 1.891 1.334 1.261 2.002 2.857 2.002 4.79 0 1.16-.295 2.223-.884 3.188-.59.967-1.39 1.736-2.402 2.306l3.977 7.151H90.04zM104.948 20.304c1.343 0 2.438-.446 3.285-1.34.846-.892 1.27-2.074 1.27-3.547 0-1.472-.424-2.655-1.27-3.548-.847-.892-1.942-1.34-3.285-1.34h-2.79v9.775h2.79zm0-14.55c2.668 0 4.9.925 6.694 2.775 1.795 1.85 2.693 4.146 2.693 6.888 0 2.743-.898 5.038-2.693 6.888-1.794 1.85-4.026 2.775-6.694 2.775h-7.87V5.754h7.87z"></path><path d="M116.626 25.081L121.568 25.081 121.568 5.755 116.626 5.755zM130.264 19.185c.994.985 2.236 1.478 3.727 1.478 1.491 0 2.733-.493 3.727-1.478.994-.984 1.491-2.24 1.491-3.768 0-1.528-.497-2.784-1.49-3.769-.995-.984-2.237-1.477-3.728-1.477-1.49 0-2.733.493-3.727 1.477-.994.985-1.49 2.241-1.49 3.77 0 1.527.496 2.783 1.49 3.767m10.92 3.396c-1.96 1.942-4.358 2.913-7.193 2.913-2.834 0-5.232-.97-7.192-2.913-1.96-1.94-2.94-4.33-2.94-7.164 0-2.835.98-5.223 2.94-7.165 1.96-1.942 4.358-2.912 7.192-2.912 2.835 0 5.232.97 7.192 2.912s2.94 4.33 2.94 7.165c0 2.834-.98 5.223-2.94 7.164M157.072 5.754L161.986 5.754 161.986 25.08 158.176 25.08 151.357 15.361 151.357 25.08 146.415 25.08 146.415 5.754 150.253 5.754 157.072 15.472z" mask="url(#prefix__b)"></path></g></g></svg>
</div>


## Welcome to **GORDION Core** Storybook

Storybook helps you build UI components in isolation from your app's business logic, data, and context.
That makes it easy to develop hard-to-reach states. Save these UI states as **stories** to revisit during development, testing, or QA.

Browse example stories now by navigating to them in the sidebar.
View their code in the `src/components/**/*.stories.tsx` directory to learn how they work.
We recommend building UIs with a [**component-driven**](https://componentdriven.org) process starting with atomic components and ending with pages.

---

#### For Detail Info, You can contact:
Author : Gordion Frontend Team