mirror of
https://github.com/storybookjs/storybook.git
synced 2025-04-04 13:31:19 +08:00
144 lines
3.1 KiB
Plaintext
144 lines
3.1 KiB
Plaintext
import { Meta } from '@storybook/addon-docs/blocks';
|
|
|
|
<Meta title="Addons/Docs/markdown-docs" />
|
|
|
|
# h1 Heading
|
|
|
|
## h2 Heading
|
|
|
|
### h3 Heading
|
|
|
|
#### h4 Heading
|
|
|
|
##### h5 Heading
|
|
|
|
###### h6 Heading
|
|
|
|
## Paragraphs
|
|
|
|
The Storybook design system codifies existing UI components into a central, well-maintained repository. It is built to address having to paste the same components into multiple projects again and again. This simplifies building UI's with Storybook's design patterns.
|
|
|
|
SDS was created by Kyle Suss, Dominic Nguyen (me!), and Michael Shilman with invaluable accessibility contributions from Jimmy Somsanith.
|
|
|
|
## Emphasis
|
|
|
|
**This is bold text**
|
|
|
|
**_This is bold italic text_**
|
|
|
|
_This is italic text_
|
|
|
|
_This is italic text_
|
|
|
|
~~Strikethrough~~
|
|
|
|
## Blockquotes
|
|
|
|
> Blockquotes can also be nested...
|
|
>
|
|
> > ...by using additional greater-than signs right next to each other...
|
|
> >
|
|
> > > ...or with spaces between arrows.
|
|
|
|
## Lists
|
|
|
|
Unordered
|
|
|
|
- Create a list by starting a line with `+`, `-`, or `*`
|
|
- Sub-lists are made by indenting 2 spaces:
|
|
- Marker character change forces new list start:
|
|
- Ac tristique libero volutpat at
|
|
* Facilisis in pretium nisl aliquet
|
|
- Nulla volutpat aliquam velit
|
|
- Very easy!
|
|
- Marker character change forces new list start:
|
|
- Ac tristique libero volutpat at
|
|
* Facilisis in pretium nisl aliquet
|
|
- Nulla volutpat aliquam velit
|
|
- Final item
|
|
|
|
Ordered
|
|
|
|
1. Lorem ipsum dolor sit amet
|
|
2. Consectetur adipiscing elit
|
|
3. Integer molestie lorem at massa
|
|
|
|
Start numbering with offset:
|
|
|
|
57. foo
|
|
1. bar
|
|
|
|
## Code
|
|
|
|
Inline `code`
|
|
|
|
Indented code
|
|
|
|
// Some comments
|
|
line 1 of code
|
|
line 2 of code
|
|
line 3 of code
|
|
|
|
Block code "fences"
|
|
|
|
```
|
|
Sample text here...
|
|
```
|
|
|
|
JS syntax highlighting
|
|
|
|
```js
|
|
var foo = function(bar) {
|
|
return bar++;
|
|
};
|
|
|
|
console.log(foo(5));
|
|
```
|
|
|
|
CSS syntax
|
|
|
|
```css
|
|
.foo {
|
|
color: #eee;
|
|
}
|
|
```
|
|
|
|
HTML syntax
|
|
|
|
```html
|
|
<h1>yo html</h1>
|
|
|
|
<p>And here we go</p>
|
|
```
|
|
|
|
## Tables
|
|
|
|
| Option | Description |
|
|
| ------ | ------------------------------------------------------------------------- |
|
|
| data | path to data files to supply the data that will be passed into templates. |
|
|
| engine | engine to be used for processing templates. Handlebars is the default. |
|
|
| ext | extension to be used for dest files. |
|
|
|
|
Right aligned columns
|
|
|
|
| Option | Description |
|
|
| -----: | ------------------------------------------------------------------------: |
|
|
| data | path to data files to supply the data that will be passed into templates. |
|
|
| engine | engine to be used for processing templates. Handlebars is the default. |
|
|
| ext | extension to be used for dest files. |
|
|
|
|
## Links
|
|
|
|
[link text](https://hichroma.com)
|
|
|
|
[link with title](https://hichroma.com 'Insert title!')
|
|
|
|
[link to in page anchor h1](#h1-heading)
|
|
|
|
[link to another story](/?path=/docs/addons-docs-docs-only--page#bottom)
|
|
|
|
## Images
|
|
|
|
|
|
|