docs(alert, legacy-grid): fix demo

This commit is contained in:
07akioni 2021-03-05 13:39:42 +08:00
parent cab5894c15
commit 288dfe6514
4 changed files with 54 additions and 46 deletions

View File

@ -1,28 +1,26 @@
# Closable
```html
<n-space vertical :size="12">
<n-alert title="Default Text" type="default" closable>
<template #icon>
<n-icon>
<ios-airplane />
</n-icon>
</template>
Gee it's good to be back home
</n-alert>
<n-alert title="Info Text" type="info" closable>
Gee it's good to be back home
</n-alert>
<n-alert title="Success Text" type="success" closable>
Leave it till tomorrow to unpack my case
</n-alert>
<n-alert title="Warning Text" type="warning" closable>
Honey disconnect the phone
</n-alert>
<n-alert title="Error Text" type="error" closable>
I'm back in the U.S.S.R.
</n-alert>
</n-space>
<n-alert title="Default Text" type="default" closable>
<template #icon>
<n-icon>
<ios-airplane />
</n-icon>
</template>
Gee it's good to be back home
</n-alert>
<n-alert title="Info Text" type="info" closable>
Gee it's good to be back home
</n-alert>
<n-alert title="Success Text" type="success" closable>
Leave it till tomorrow to unpack my case
</n-alert>
<n-alert title="Warning Text" type="warning" closable>
Honey disconnect the phone
</n-alert>
<n-alert title="Error Text" type="error" closable>
I'm back in the U.S.S.R.
</n-alert>
```
```js
@ -39,3 +37,9 @@ export default {
}
}
```
```css
.n-alert:not(:last-child) {
margin-bottom: 12px;
}
```

View File

@ -1,28 +1,26 @@
# 可以关掉
```html
<n-space vertical :size="12">
<n-alert title="Default 类型" type="default" closable>
<template #icon>
<n-icon>
<ios-airplane />
</n-icon>
</template>
Gee it's good to be back home
</n-alert>
<n-alert title="Info 类型" type="info" closable>
Gee it's good to be back home
</n-alert>
<n-alert title="Success 类型" type="success" closable>
Leave it till tomorrow to unpack my case
</n-alert>
<n-alert title="Warning 类型" type="warning" closable>
Honey disconnect the phone
</n-alert>
<n-alert title="Error 类型" type="error" closable>
I'm back in the U.S.S.R.
</n-alert>
</n-space>
<n-alert title="Default 类型" type="default" closable>
<template #icon>
<n-icon>
<ios-airplane />
</n-icon>
</template>
Gee it's good to be back home
</n-alert>
<n-alert title="Info 类型" type="info" closable>
Gee it's good to be back home
</n-alert>
<n-alert title="Success 类型" type="success" closable>
Leave it till tomorrow to unpack my case
</n-alert>
<n-alert title="Warning 类型" type="warning" closable>
Honey disconnect the phone
</n-alert>
<n-alert title="Error 类型" type="error" closable>
I'm back in the U.S.S.R.
</n-alert>
```
```js
@ -39,3 +37,9 @@ export default {
}
}
```
```css
.n-alert:not(:last-child) {
margin-bottom: 12px;
}
```

View File

@ -2,7 +2,7 @@
<!--single-column-->
<n-alert title="Caveat" type="warning" style="margin-bottom: 12px">
<n-alert title="Caveat" type="warning" style="margin-bottom: 16px">
The legacy grid won't add any new features. Only use it when you really need to work with a browser not supporting CSS Grid. <br /> Most of time you should use <n-a to="n-grid">Grid</n-a>.
</n-alert>

View File

@ -2,7 +2,7 @@
<!--single-column-->
<n-alert title="警告" type="warning" style="margin-bottom: 12px">
<n-alert title="警告" type="warning" style="margin-bottom: 16px">
此版栅格不会增加新功能。如果你一定需要栅格运行在不支持 CSS Grid 的浏览器中,再来使用它。<br />绝大多数情况下你应该使用<n-a to="n-grid">栅格</n-a>
</n-alert>