kylefang/react
1
0
Fork 0
mirror of https://github.com/zhigang1992/react.git synced 2026-03-26 22:42:51 +08:00
Code Issues Packages Projects Releases Wiki Activity

docs: fix display & badge spacing (#548)

Browse Source
This commit is contained in:
l1shen
2021-05-28 17:18:35 +08:00
committed by GitHub
parent de483cdfbd
commit af111f469f
4 changed files with 54 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
pages/en-us/components/badge.mdx
View File

@@ -15,12 +15,12 @@ Display an indicator that requires attention.
scope={{ Badge, Spacer }}
desc="Show number or text."
code={`
<>
<Badge>1</Badge> <Spacer y={.5} />
<Badge>50</Badge> <Spacer y={.5} />
<Badge>100</Badge> <Spacer y={.5} />
<Badge>2020</Badge>
</>
<>
<Badge>1</Badge> <Spacer y={.5} />
<Badge>50</Badge> <Spacer y={.5} />
<Badge>100</Badge> <Spacer y={.5} />
<Badge>2020</Badge>
</>
`}
/>
@@ -29,12 +29,12 @@ Display an indicator that requires attention.
desc="Express state in different colors."
scope={{ Badge, Spacer }}
code={`
<>
<Badge type="success">Success</Badge> <Spacer y={.5} />
<Badge type="warning">Warning</Badge> <Spacer y={.5} />
<Badge type="error">Error</Badge> <Spacer y={.5} />
<Badge type="secondary">Secondary</Badge>
</>
<>
<Badge type="success">Success</Badge> <Spacer y={.5} />
<Badge type="warning">Warning</Badge> <Spacer y={.5} />
<Badge type="error">Error</Badge> <Spacer y={.5} />
<Badge type="secondary">Secondary</Badge>
</>
`}
/>
@@ -72,12 +72,12 @@ Display an indicator that requires attention.
desc="Components of different sizes."
scope={{ Badge, Spacer }}
code={`
<>
<Badge size="mini">Mini</Badge> <Spacer y={.5} />
<Badge size="small">Small</Badge> <Spacer y={.5} />
<Badge size="medium">Medium</Badge> <Spacer y={.5} />
<Badge size="large">Large</Badge>
</>
<>
<Badge size="mini">Mini</Badge> <Spacer y={.5} />
<Badge size="small">Small</Badge> <Spacer y={.5} />
<Badge size="medium">Medium</Badge> <Spacer y={.5} />
<Badge size="large">Large</Badge>
</>
`}
/>

18
pages/en-us/components/display.mdx
View File

@@ -15,9 +15,9 @@ To display important information or images in a central alignment.
desc="Describe the main part with a paragraph."
scope={{ Display, Image }}
code={`
<Display shadow caption="An open-source design system for building modern websites and applications.">
<Image width={435} height={200} src="/images/geist-banner.png" />
</Display>
<Display shadow caption="An open-source design system for building modern websites and applications.">
<Image width={435} height={200} src="/images/geist-banner.png" />
</Display>
`}
/>
@@ -48,9 +48,9 @@ To display important information or images in a central alignment.
desc="Show shell codes."
scope={{ Display, Snippet }}
code={`
<Display width="500px" caption="Run this command to install the library.">
<Snippet type="dark">yarn add @geist-ui/react</Snippet>
</Display>
<Display width="500px" caption="Run this command to install the library.">
<Snippet type="dark">yarn add @geist-ui/react</Snippet>
</Display>
`}
/>
@@ -59,9 +59,9 @@ To display important information or images in a central alignment.
desc="Use component on `caption` prop."
scope={{ Display, Code, Image }}
code={`
<Display shadow caption={<p>Browse <Code>react.geist-ui.dev</Code> for more documentation.</p>}>
<Image width={650} height={297} src="/images/geist-banner.png" />
</Display>
<Display shadow caption={<p>Browse <Code>react.geist-ui.dev</Code> for more documentation.</p>}>
<Image width={650} height={297} src="/images/geist-banner.png" />
</Display>
`}
/>

36
pages/zh-cn/components/badge.mdx
View File

@@ -15,12 +15,12 @@ export const meta = {
scope={{ Badge, Spacer }}
desc="展示一个数字或一段文字。"
code={`
<>
<Badge>1</Badge> <Spacer y={.5} />
<Badge>50</Badge> <Spacer y={.5} />
<Badge>100</Badge> <Spacer y={.5} />
<Badge>2020</Badge>
</>
<>
<Badge>1</Badge> <Spacer y={.5} />
<Badge>50</Badge> <Spacer y={.5} />
<Badge>100</Badge> <Spacer y={.5} />
<Badge>2020</Badge>
</>
`}
/>
@@ -29,12 +29,12 @@ export const meta = {
desc="以不同的色彩表达不同的状态。"
scope={{ Badge, Spacer }}
code={`
<>
<Badge type="success">成功</Badge> <Spacer y={.5} />
<Badge type="warning">警告</Badge> <Spacer y={.5} />
<Badge type="error">错误</Badge> <Spacer y={.5} />
<Badge type="secondary">次要的</Badge>
</>
<>
<Badge type="success">成功</Badge> <Spacer y={.5} />
<Badge type="warning">警告</Badge> <Spacer y={.5} />
<Badge type="error">错误</Badge> <Spacer y={.5} />
<Badge type="secondary">次要的</Badge>
</>
`}
/>
@@ -72,12 +72,12 @@ export const meta = {
desc="不同大小的徽章组件。"
scope={{ Badge, Spacer }}
code={`
<>
<Badge size="mini">极小</Badge> <Spacer y={.5} />
<Badge size="small">较小</Badge> <Spacer y={.5} />
<Badge size="medium">中等</Badge> <Spacer y={.5} />
<Badge size="large">最大</Badge>
</>
<>
<Badge size="mini">极小</Badge> <Spacer y={.5} />
<Badge size="small">较小</Badge> <Spacer y={.5} />
<Badge size="medium">中等</Badge> <Spacer y={.5} />
<Badge size="large">最大</Badge>
</>
`}
/>

18
pages/zh-cn/components/display.mdx
View File

@@ -14,9 +14,9 @@ export const meta = {
desc="为一张图片添加描述文本。"
scope={{ Display, Image }}
code={`
<Display shadow caption="用于构建现代应用的开源设计系统。">
<Image width={435} height={200} src="/images/geist-banner.png" />
</Display>
<Display shadow caption="用于构建现代应用的开源设计系统。">
<Image width={435} height={200} src="/images/geist-banner.png" />
</Display>
`}
/>
@@ -47,9 +47,9 @@ export const meta = {
desc="展示 Shell 代码片段。"
scope={{ Display, Snippet }}
code={`
<Display width="500px" caption="运行此命令以下载库。">
<Snippet type="dark">yarn add @geist-ui/react</Snippet>
</Display>
<Display width="500px" caption="运行此命令以下载库。">
<Snippet type="dark">yarn add @geist-ui/react</Snippet>
</Display>
`}
/>
@@ -58,9 +58,9 @@ export const meta = {
desc="在 `caption` 属性上使用组件表达更丰富的信息。"
scope={{ Display, Code, Image }}
code={`
<Display shadow caption={<p>访问地址 <Code>react.geist-ui.dev</Code> 获取更多的文档信息。</p>}>
<Image width={650} height={297} src="/images/geist-banner.png" />
</Display>
<Display shadow caption={<p>访问地址 <Code>react.geist-ui.dev</Code> 获取更多的文档信息。</p>}>
<Image width={650} height={297} src="/images/geist-banner.png" />
</Display>
`}
/>