|
import { Meta } from "@storybook/blocks"; |
|
|
|
<Meta title="Introduction" /> |
|
|
|
<style> |
|
{` |
|
img { |
|
margin: 1rem; |
|
display: flex; |
|
justify-content: left; |
|
|
|
@media (max-width: 600px) { |
|
width: 200px; |
|
} |
|
} |
|
|
|
.container { |
|
margin: 0 auto; |
|
padding: 0 1rem; |
|
} |
|
|
|
.heading { |
|
font-size: 2rem; |
|
margin: 0 auto; |
|
} |
|
|
|
.subheading { |
|
font-size: 1rem; |
|
margin: 1rem auto; |
|
} |
|
|
|
ul { |
|
list-style: none; |
|
padding-left: 0; |
|
margin: 0; |
|
} |
|
|
|
li a { |
|
color: #ff7c01 !important; |
|
} |
|
`} |
|
</style> |
|
|
|
<img src="./gradio.svg" alt="Gradio Logo" /> |
|
<div class="container"> |
|
|
|
<div class="heading">Welcome to the Gradio Storybook</div> |
|
|
|
This is Gradio's component library. It is a collection of reusable components that are used to build Gradio interfaces. |
|
Here you'll find documentation for each component, the props they take, and the visual variations they have, as well as some examples of how they can be used. |
|
This is still a work in progress and we welcome any contributions. |
|
|
|
<div class="divider" /> |
|
|
|
<div class="subheading">Resources</div> |
|
<ul> |
|
|
|
<li><a href="https://gradio.app">Documentation</a></li> |
|
<li><a href="https://gradio.app/guides/">Guides</a></li> |
|
<li><a href="https://github.com/gradio-app/gradio">GitHub</a></li> |
|
<li><a href="https://discord.com/invite/feTf9x3ZSB">Discord</a></li> |
|
<li><a href="https://discuss.huggingface.co/c/gradio/26">Hugging Face Forum</a></li> |
|
</ul> |
|
|
|
<div class="subheading">Feedback</div> |
|
If you have any questions, issues, or feedback on our components, please refer to our Discord or raise an issue in our GitHub repo. |
|
</div> |
|
|
