整理文档

This commit is contained in:
liaoxuezhi 2019-05-09 18:25:12 +08:00
parent f151321a71
commit 49d766e2f5
55 changed files with 826 additions and 4767 deletions

View File

@ -3,11 +3,11 @@ title: 高级用法
shortname: advanced
---
在开始阅读之前,希望你已经阅读 [快速开始文档](./getting-started) 。
在开始阅读之前,希望你已经阅读 [快速开始文档](./getting-started.md) 。
## 数据作用域
配置中很多地方都可以用变量如: [tpl](./renderers#tpl) 类型的渲染器、API 中的 Url、FormItem 中的 source 配置、visibleOn、disabledOn 以及 Form 中的 `redirect` 配置等等。
配置中很多地方都可以用变量如: [tpl](./renderers/Tpl.md) 类型的渲染器、API 中的 Url、FormItem 中的 source 配置、visibleOn、disabledOn 以及 Form 中的 `redirect` 配置等等。
那么都有哪些数据可以用?这取决于在哪个容器,关于容器中的数据说明如下:
@ -172,7 +172,7 @@ shortname: advanced
}
```
注意source 中的传参是通过 source 中的 data 关联的,不能写在 source 的 url 中,因为如果写了,就会自动监控值的变化而自动刷新,写在 data 里面关联则不会。如果对 source 中的配置规则不了解,请前往 [API 说明](./renderers#api)
注意source 中的传参是通过 source 中的 data 关联的,不能写在 source 的 url 中,因为如果写了,就会自动监控值的变化而自动刷新,写在 data 里面关联则不会。如果对 source 中的配置规则不了解,请前往 [API 说明](./renderers/类型说明.md#api)
另外注意 button 的 target 值,正好是这个 form 的 name 值 `lidong` 的 formItem 的 name 值 `select`。当按钮的对象是一个 formItem 时,会出发 formItem 的数据重新拉取。

View File

@ -3,22 +3,7 @@ title: 自定义组件
shortname: dev
---
AMis 平台中,支持了大部分的[通用组件](./renderers),基本需求都能满足。针对比较定制的需求,则需要通过在群组内添加自定义组件来实现。
## 如何添加
1. 自定义组件是群级别的,先进入你想要添加的自定义组件的群组。
2. 然后进入【组件管理】页面。(你需要拥有管理权限,一般管理员自带这个权限)
3. 然后点击右上角添加【新建】
![图片](http://bos.nj.bpc.baidu.com/v1/agroup/e3619506735bbec17ea83da71944fc447d709de4)
- `组件名` 随意。
- `组件代码` React Component 代码。
## 如何开发?
AMis 中自定义组件主要分两类。表单类和非表单类。
自定义组件主要分两类。表单类和非表单类。
### FormItem
@ -60,7 +45,7 @@ export default class CustomCheckbox extends React.PureComponent {
}
```
有了这个代码后,页面配置 form 的 controls 里面就可以通过这样的配置启动了。[在线 Demo](http://amis.baidu.com/group/demo/custom)。
有了这个代码后,页面配置 form 的 controls 里面就可以通过这样的配置启动了。
```js
{

View File

@ -8,7 +8,7 @@ title: 快速开始
```schema:height="300"
{
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"type": "page",
"title": "这是标题部分",
"subTitle": "这是子标题",
@ -25,7 +25,7 @@ title: 快速开始
简单说明以上配置信息。
- `$schema` 这个字段可以忽略,他是指定当前 JSON 配置是符合指定路径 http://amis.baidu.com/v2/schemas/page.json 的 JSON SCHEMA 文件描述的。PS: 编辑器就是靠这个描述文件提示的,可以 hover 到字段上看效果。
- `$schema` 这个字段可以忽略,他是指定当前 JSON 配置是符合指定路径 https://houtai.baidu.com/v2/schemas/page.json 的 JSON SCHEMA 文件描述的。PS: 编辑器就是靠这个描述文件提示的,可以 hover 到字段上看效果。
- `type` 指定渲染器类型,这里指定的类型为 `page`。 更多渲染器类型可以去[这里面查看](./renderers)。
- `title` 从 title 开始就是对应的渲染模型上的属性了。这里用来指定标题内容。
- `subTitle` 副标题.
@ -34,11 +34,11 @@ title: 快速开始
- `body` 内容区域的内容
- `toolbar` 工具栏部分的内容
这里有三个配置都是容器类型的。`aside`、`body` 和 `toolbar`。什么是容器类型?容器类型表示,他能够把其他渲染类型放进来。以上的例子为了简单,直接放了个字符串。字符串类型内部是把他当成了 [tpl](./renderers#tpl) 渲染器来处理,在这里也可以通过对象的形式指定,如以下的例子的 body 区域是完全等价的。
这里有三个配置都是容器类型的。`aside`、`body` 和 `toolbar`。什么是容器类型?容器类型表示,他能够把其他渲染类型放进来。以上的例子为了简单,直接放了个字符串。字符串类型内部是把他当成了 [tpl](./renderers/Tpl.md) 渲染器来处理,在这里也可以通过对象的形式指定,如以下的例子的 body 区域是完全等价的。
```schema:height="100"
{
"$schema": "http://amis.baidu.com/v2/schemas/page.json",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json",
"type": "page",
"body": {
"type": "tpl",
@ -51,7 +51,7 @@ title: 快速开始
```schema:height="130"
{
"$schema": "http://amis.baidu.com/v2/schemas/page.json",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json",
"type": "page",
"body": [
{
@ -73,7 +73,7 @@ title: 快速开始
```schema:height="440"
{
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"type": "page",
"body": {
"api": "/api/mock2/form/saveForm",
@ -117,7 +117,7 @@ title: 快速开始
```schema:height="600"
{
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"type": "page",
"title": "增删改查示例",
"toolbar": [
@ -403,6 +403,6 @@ title: 快速开始
这个栗子最主要的渲染器就是 CRUD 渲染器了,他的作用是配置了个 API把数据拉取过来后根据配置 columns 信息完成列表展示,列类型可以是静态文本、图片、映射或者日期等等。 `columns` 通过 `name` 与行数据关联。除了展示外还可以放置操作按钮。
这里相对复杂一点配置就是按钮了,按钮主要是通过 `actionType`来决定用户点下的行为。可以配置成 弹框、发送 ajax、页面跳转、复制内容到剪切板、刷新目标组件等等。具体请参考[Action 渲染器说明](./renderers#action)
这里相对复杂一点配置就是按钮了,按钮主要是通过 `actionType`来决定用户点下的行为。可以配置成 弹框、发送 ajax、页面跳转、复制内容到剪切板、刷新目标组件等等。具体请参考[Action 渲染器说明](./renderers/Action.md)
更多用法请参考[渲染器手册](./renderers)和示例。

File diff suppressed because it is too large Load Diff

View File

@ -1,87 +0,0 @@
## AMis 渲染器手册
- [Page](./renderers/Page.md): JSON 配置最外层的 Page 渲染器
- [Form](./renderers/Form.md): 表单渲染器
- [FormItem](./renderers/FormItem.md): Form 中主要是由各种 FormItem 组成
- [FormItem-List](./renderers/FormItem-List.md): 简单的列表选择框
- [FormItem-Button-Group](./renderers/FormItem-Button-Group.md): 按钮集合
- [FormItem-Service](./renderers/FormItem-Service.md): 动态配置,配置项由接口决定
- [FormItem-Tabs](./renderers/FormItem-Tabs.md): 多个输入框通过选项卡来分组
- [FormItem-Table](./renderers/FormItem-Table.md): 可以用来展示数组类型的数据
- [FormItem-HBox](./renderers/FormItem-HBox.md): 支持 form 内部再用 HBox 布局
- [FormItem-Grid](./renderers/FormItem-Grid.md): 支持 form 内部再用 grid 布局
- [FormItem-Panel](./renderers/FormItem-Panel.md): 还是为了布局,可以把一部分 FormItem 合并到一个 panel 里面单独展示
- [Hidden](./renderers/Hidden.md): 隐藏字段类型
- [Text](./renderers/Text.md): 普通的文本输入框
- [Textarea](./renderers/Textarea.md): 多行文本输入框
- [Url](./renderers/Url.md): URL 输入框
- [Email](./renderers/Email.md): Email 输入框
- [Password](./renderers/Password.md): 密码输入框
- [Number](./renderers/Number.md): 数字输入框
- [Divider](./renderers/Divider.md): 分割线
- [Select](./renderers/Select.md): 选项表单
- [Chained-Select](./renderers/Chained-Select.md): 无限级别下拉
- [Checkbox](./renderers/Checkbox.md): 勾选框
- [Checkboxes](./renderers/Checkboxes.md): 复选框
- [Radios](./renderers/Radios.md): 单选框
- [Switch](./renderers/Switch.md): 可选框,和 checkbox 完全等价
- [Date](./renderers/Date.md): 日期类型
- [Datetime](./renderers/Datetime.md): 日期时间类型
- [Time](./renderers/Time.md): 时间类型
- [Date-Range](./renderers/Date-Range.md): 日期范围类型
- [Color](./renderers/Color.md): 颜色选择器
- [Range](./renderers/Range.md): 范围输入框
- [Image](./renderers/Image.md): 图片格式输
- [File](./renderers/File.md): 文件输入
- [Matrix](./renderers/Matrix.md): 矩阵类型的输入框
- [Tree](./renderers/Tree.md): 树形结构输入框
- [TreeSelect](./renderers/TreeSelect.md): 树形结构选择框
- [NestedSelect](./renderers/NestedSelect.md): 树形结构选择框
- [Button](./renderers/Button.md): 按钮, 包含 button、submit 和 reset
- [Button-Toolbar](./renderers/Button-Toolbar.md): 让多个按钮在一起放置
- [Combo](./renderers/Combo.md): 组合模式
- [Array](./renderers/Array.md): 数组输入框配置
- [SubForm](./renderers/SubForm.md): formItem 还可以是子表单类型
- [Picker](./renderers/Picker.md): 列表选取
- [Formula](./renderers/Formula.md): 公式类型
- [Group](./renderers/Group.md): 表单项集合
- [FieldSet](./renderers/FieldSet.md): 多个输入框可以通过 fieldSet 捆绑在一起
- [Repeat](./renderers/Repeat.md): 可用来设置重复频率
- [Rich-Text](./renderers/Rich-Text.md): 富文本编辑器
- [Editor](./renderers/Editor.md): 编辑器
- [Static](./renderers/Static.md): 纯用来展现数据的
- [Wizard](./renderers/Wizard.md): 表单向导
- [Tpl](./renderers/Tpl.md): 支持用 JS 模板引擎来组织输出
- [Plain](./renderers/Plain.md): 单纯的文字输出
- [Html](./renderers/Html.md): html, 当需要用到变量时,请用 Tpl 代替
- [Action](./renderers/Action.md): 一种特殊的渲染器,它本身是一个按钮,同时它能触发事件
- [Dialog](./renderers/Dialog.md): Dialog 由 Action 触发。他是一个类似于 Page 的容器模型
- [Drawer](./renderers/Drawer.md): Drawer 由 Action 触发
- [CRUD](./renderers/CRUD.md): 增删改查模型,主要用来展现列表
- [CRUD-Table](./renderers/CRUD-Table.md): 请参考 Table
- [CRUD-Cards](./renderers/CRUD-Cards.md): 请参考 Cards
- [CRUD-List](./renderers/CRUD-List.md): 请参考 List
- [Panel](./renderers/Panel.md): 可以把相关信息以盒子的形式展示到一块。
- [Wrapper](./renderers/Wrapper.md): 简单的一个容器。
- [Service](./renderers/Service.md): 功能型容器,自身不负责展示内容,主要职责在于通过配置的 api 拉取数据
- [Chart](./renderers/Chart.md): 图表渲染器
- [Collapse](./renderers/Collapse.md): 折叠器
- [Audio](./renderers/Audio.md): 音频播放器
- [Video](./renderers/Video.md): 视频播放器
- [Table](./renderers/Table.md): 表格展示
- [Column](./renderers/Column.md): 表格中的列配置
- [List](./renderers/List.md): 列表展示
- [Card](./renderers/Card.md): 卡片的展示形式
- [Cards](./renderers/Cards.md): 卡片集合
- [Field](./renderers/Field.md): 主要用在 Table 的列配置 Column、List 的内容、Card 卡片的内容和表单的 Static-XXX 中
- [Tabs](./renderers/Tabs.md): 标签页
- [Grid](./renderers/Grid.md): Grid 布局
- [HBox](./renderers/HBox.md): HBox 布局
- [Button-Group](./renderers/Button-Group.md) 按钮集合
- [iFrame](./renderers/iFrame.md) 如果需要内嵌外部站点,可用 iframe 来实现
- [Nav](./renderers/Nav.md): 菜单栏
- [Tasks](./renderers/Tasks.md): 任务操作集合,类似于 orp 上线
- [QRCode](./renderers/QRCode.md): 二维码显示组件
- [类型说明](./renderers/类型说明.md): 类型说明文档

View File

@ -7,9 +7,8 @@ import {
mapTree
} from '../../src/utils/helper';
import { Router, Route, IndexRoute, browserHistory, Link, Redirect } from 'react-router';
import * as cx from 'classnames';
import makeSchemaRenderer from './SchemaRender';
import makeMarkdownRenderer from './MdRenderer';
import SimplePageSchema from './Page/Simple';
import ErrorPageSchema from './Page/Error';
@ -34,6 +33,7 @@ import PickerFormSchema from './Form/Picker';
import FormulaFormSchema from './Form/Formula';
import CustomFormSchema from './Form/Custom';
import FormLayoutTestSchema from './Form/layoutTest';
import Docs from './Doc';
import TableCrudSchema from './CRUD/Table';
import ItemActionsSchema from './CRUD/ItemActions';
@ -489,65 +489,7 @@ const navigations = [
]
},
{
prefix: ({classnames: cx}) => (<li className={cx('AsideNav-divider')}></li>),
label: '文档',
children: [
{
label: '快速开始',
icon: 'fa fa-flash',
path: '/v2/docs/getting-started',
getComponent: (location, cb) => require(['../../docs/getting_started.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
},
{
label: '高级用法',
icon: 'fa fa-rocket',
path: '/v2/docs/advanced',
getComponent: (location, cb) => require(['../../docs/advanced.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
},
{
label: '渲染器手册',
icon: 'fa fa-diamond',
path: '/v2/docs/renderers',
getComponent: (location, cb) => require(['../../docs/renderers.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
},
{
label: '开源渲染器',
path: '/v2/docs/sdk',
icon: 'fa fa-cubes',
getComponent: (location, cb) => require(['../../docs/sdk.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
},
{
label: '自定义组件',
path: '/v2/docs/dev',
icon: 'fa fa-code',
getComponent: (location, cb) => require(['../../docs/dev.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
},
{
label: '样式说明',
path: '/v2/docs/style',
icon: 'fa fa-laptop',
getComponent: (location, cb) => require(['../../docs/style.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
}
]
}
Docs
];
function isActive(link, location) {

View File

@ -1,5 +1,5 @@
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "音频播放器",
"body": [
{

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "带边栏联动",
aside: {
type: 'form',

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "增删改查列类型汇总",
body: {
type: "crud",

View File

@ -276,7 +276,7 @@ const table = {
};
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "固顶和列固定示例",
remark: "bla bla bla",
body: [

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "开启单条底部展示功能",
body: {
type: "crud",

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "增删改查示例",
remark: "bla bla bla",
body: {

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "增删改查示例",
remark: "bla bla bla",
body: {

View File

@ -1,5 +1,5 @@
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "操作并下一个",
"remark": "当存在下一条时,支持直接打开下一条操作。",
"body": {

View File

@ -1,5 +1,5 @@
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "Table 全键盘操作示例",
"remark": "bla bla bla",
"body": [

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "增删改查示例",
remark: "bla bla bla",
body: {

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "增删改查示例",
remark: "bla bla bla",
body: {

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "支持自动合并单元格,从左到右,可配置从左侧起多少列内启动自动合并单元格,当前配置 3",
body: {
type: "table",

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "支持多层嵌套,列数据中有 children 字段即可。建议不超过10层",
body: {
type: "crud",

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "增删改查示例",
remark: "bla bla bla",
toolbar: [

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "Test 信息:${page}",
body: {
"type": "crud",

View File

@ -1,5 +1,5 @@
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "图表示例",
"body": [
{

662
examples/components/Doc.jsx Normal file
View File

@ -0,0 +1,662 @@
import * as React from 'react';
import makeMarkdownRenderer from './MdRenderer';
export default {
prefix: ({classnames: cx}) => (<li className={cx('AsideNav-divider')}></li>),
label: '文档',
children: [
{
label: '快速开始',
icon: 'fa fa-flash',
path: '/docs/getting-started',
getComponent: (location, cb) => require(['../../docs/getting_started.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
},
{
label: '高级用法',
icon: 'fa fa-rocket',
path: '/docs/advanced',
getComponent: (location, cb) => require(['../../docs/advanced.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
},
{
label: '渲染器手册',
icon: 'fa fa-diamond',
path: '/docs/renderers',
getComponent: (location, cb) => require(['../../docs/renderers.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
children: [
{
label: 'Page',
path: '/docs/renderers/page',
getComponent: (location, cb) => require(['../../docs/renderers/Page.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Form',
path: '/docs/renderers/form',
getComponent: (location, cb) => require(['../../docs/renderers/Form.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
children: [
{
label: 'FormItem',
path: '/docs/renderers/FormItem',
getComponent: (location, cb) => require(['../../docs/renderers/FormItem.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'FormItem-List',
path: '/docs/renderers/FormItem-List',
getComponent: (location, cb) => require(['../../docs/renderers/FormItem-List.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'FormItem-Button-Group',
path: '/docs/renderers/FormItem-Button-Group',
getComponent: (location, cb) => require(['../../docs/renderers/FormItem-Button-Group.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'FormItem-Service',
path: '/docs/renderers/FormItem-Service',
getComponent: (location, cb) => require(['../../docs/renderers/FormItem-Service.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'FormItem-Tabs',
path: '/docs/renderers/FormItem-Tabs',
getComponent: (location, cb) => require(['../../docs/renderers/FormItem-Tabs.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'FormItem-Table',
path: '/docs/renderers/FormItem-Table',
getComponent: (location, cb) => require(['../../docs/renderers/FormItem-Table.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'FormItem-HBox',
path: '/docs/renderers/FormItem-HBox',
getComponent: (location, cb) => require(['../../docs/renderers/FormItem-HBox.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'FormItem-Grid',
path: '/docs/renderers/FormItem-Grid',
getComponent: (location, cb) => require(['../../docs/renderers/FormItem-Grid.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'FormItem-Panel',
path: '/docs/renderers/FormItem-Panel',
getComponent: (location, cb) => require(['../../docs/renderers/FormItem-Panel.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Hidden',
path: '/docs/renderers/Hidden',
getComponent: (location, cb) => require(['../../docs/renderers/Hidden.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Text',
path: '/docs/renderers/Text',
getComponent: (location, cb) => require(['../../docs/renderers/Text.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Textarea',
path: '/docs/renderers/Textarea',
getComponent: (location, cb) => require(['../../docs/renderers/Textarea.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Url',
path: '/docs/renderers/Url',
getComponent: (location, cb) => require(['../../docs/renderers/Url.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Email',
path: '/docs/renderers/Email',
getComponent: (location, cb) => require(['../../docs/renderers/Email.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Password',
path: '/docs/renderers/Password',
getComponent: (location, cb) => require(['../../docs/renderers/Password.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Number',
path: '/docs/renderers/Number',
getComponent: (location, cb) => require(['../../docs/renderers/Number.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Divider',
path: '/docs/renderers/Divider',
getComponent: (location, cb) => require(['../../docs/renderers/Divider.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Select',
path: '/docs/renderers/Select',
getComponent: (location, cb) => require(['../../docs/renderers/Select.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Chained-Select',
path: '/docs/renderers/Chained-Select',
getComponent: (location, cb) => require(['../../docs/renderers/Chained-Select.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Checkbox',
path: '/docs/renderers/Checkbox',
getComponent: (location, cb) => require(['../../docs/renderers/Checkbox.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Checkboxes',
path: '/docs/renderers/Checkboxes',
getComponent: (location, cb) => require(['../../docs/renderers/Checkboxes.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Radios',
path: '/docs/renderers/Radios',
getComponent: (location, cb) => require(['../../docs/renderers/Radios.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Switch',
path: '/docs/renderers/Switch',
getComponent: (location, cb) => require(['../../docs/renderers/Switch.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Date',
path: '/docs/renderers/Date',
getComponent: (location, cb) => require(['../../docs/renderers/Date.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Datetime',
path: '/docs/renderers/Datetime',
getComponent: (location, cb) => require(['../../docs/renderers/Datetime.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Time',
path: '/docs/renderers/Time',
getComponent: (location, cb) => require(['../../docs/renderers/Time.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Date-Range',
path: '/docs/renderers/Date-Range',
getComponent: (location, cb) => require(['../../docs/renderers/Date-Range.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Color',
path: '/docs/renderers/Color',
getComponent: (location, cb) => require(['../../docs/renderers/Color.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Range',
path: '/docs/renderers/Range',
getComponent: (location, cb) => require(['../../docs/renderers/Range.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Image',
path: '/docs/renderers/Image',
getComponent: (location, cb) => require(['../../docs/renderers/Image.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'File',
path: '/docs/renderers/File',
getComponent: (location, cb) => require(['../../docs/renderers/File.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Matrix',
path: '/docs/renderers/Matrix',
getComponent: (location, cb) => require(['../../docs/renderers/Matrix.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Tree',
path: '/docs/renderers/Tree',
getComponent: (location, cb) => require(['../../docs/renderers/Tree.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'TreeSelect',
path: '/docs/renderers/TreeSelect',
getComponent: (location, cb) => require(['../../docs/renderers/TreeSelect.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'NestedSelect',
path: '/docs/renderers/NestedSelect',
getComponent: (location, cb) => require(['../../docs/renderers/NestedSelect.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Button',
path: '/docs/renderers/Button',
getComponent: (location, cb) => require(['../../docs/renderers/Button.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Button-Toolbar',
path: '/docs/renderers/Button-Toolbar',
getComponent: (location, cb) => require(['../../docs/renderers/Button-Toolbar.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Combo',
path: '/docs/renderers/Combo',
getComponent: (location, cb) => require(['../../docs/renderers/Combo.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Array',
path: '/docs/renderers/Array',
getComponent: (location, cb) => require(['../../docs/renderers/Array.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'SubForm',
path: '/docs/renderers/SubForm',
getComponent: (location, cb) => require(['../../docs/renderers/SubForm.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Picker',
path: '/docs/renderers/Picker',
getComponent: (location, cb) => require(['../../docs/renderers/Picker.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Formula',
path: '/docs/renderers/Formula',
getComponent: (location, cb) => require(['../../docs/renderers/Formula.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Group',
path: '/docs/renderers/Group',
getComponent: (location, cb) => require(['../../docs/renderers/Group.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'FieldSet',
path: '/docs/renderers/FieldSet',
getComponent: (location, cb) => require(['../../docs/renderers/FieldSet.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Repeat',
path: '/docs/renderers/Repeat',
getComponent: (location, cb) => require(['../../docs/renderers/Repeat.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Rich-Text',
path: '/docs/renderers/Rich-Text',
getComponent: (location, cb) => require(['../../docs/renderers/Rich-Text.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Editor',
path: '/docs/renderers/Editor',
getComponent: (location, cb) => require(['../../docs/renderers/Editor.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Static',
path: '/docs/renderers/Static',
getComponent: (location, cb) => require(['../../docs/renderers/Static.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
]
},
{
label: 'Wizard',
path: '/docs/renderers/Wizard',
getComponent: (location, cb) => require(['../../docs/renderers/Wizard.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Tpl',
path: '/docs/renderers/Tpl',
getComponent: (location, cb) => require(['../../docs/renderers/Tpl.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Plain',
path: '/docs/renderers/Plain',
getComponent: (location, cb) => require(['../../docs/renderers/Plain.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Html',
path: '/docs/renderers/Html',
getComponent: (location, cb) => require(['../../docs/renderers/Html.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Action',
path: '/docs/renderers/Action',
getComponent: (location, cb) => require(['../../docs/renderers/Action.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Dialog',
path: '/docs/renderers/Dialog',
getComponent: (location, cb) => require(['../../docs/renderers/Dialog.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Drawer',
path: '/docs/renderers/Drawer',
getComponent: (location, cb) => require(['../../docs/renderers/Drawer.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'CRUD',
path: '/docs/renderers/CRUD',
getComponent: (location, cb) => require(['../../docs/renderers/CRUD.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
children: [
{
label: 'CRUD-Table',
path: '/docs/renderers/CRUD-Table',
getComponent: (location, cb) => require(['../../docs/renderers/CRUD-Table.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'CRUD-Cards',
path: '/docs/renderers/CRUD-Cards',
getComponent: (location, cb) => require(['../../docs/renderers/CRUD-Cards.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'CRUD-List',
path: '/docs/renderers/CRUD-List',
getComponent: (location, cb) => require(['../../docs/renderers/CRUD-List.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
}
]
},
{
label: 'Panel',
path: '/docs/renderers/Panel',
getComponent: (location, cb) => require(['../../docs/renderers/Panel.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Wrapper',
path: '/docs/renderers/Wrapper',
getComponent: (location, cb) => require(['../../docs/renderers/Wrapper.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Service',
path: '/docs/renderers/Service',
getComponent: (location, cb) => require(['../../docs/renderers/Service.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Chart',
path: '/docs/renderers/Chart',
getComponent: (location, cb) => require(['../../docs/renderers/Chart.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Collapse',
path: '/docs/renderers/Collapse',
getComponent: (location, cb) => require(['../../docs/renderers/Collapse.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Audio',
path: '/docs/renderers/Audio',
getComponent: (location, cb) => require(['../../docs/renderers/Audio.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Video',
path: '/docs/renderers/Video',
getComponent: (location, cb) => require(['../../docs/renderers/Video.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Table',
path: '/docs/renderers/Table',
getComponent: (location, cb) => require(['../../docs/renderers/Table.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
children: [
{
label: 'Column',
path: '/docs/renderers/Column',
getComponent: (location, cb) => require(['../../docs/renderers/Column.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
]
},
{
label: 'List',
path: '/docs/renderers/List',
getComponent: (location, cb) => require(['../../docs/renderers/List.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Card',
path: '/docs/renderers/Card',
getComponent: (location, cb) => require(['../../docs/renderers/Card.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Cards',
path: '/docs/renderers/Cards',
getComponent: (location, cb) => require(['../../docs/renderers/Cards.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Field',
path: '/docs/renderers/Field',
getComponent: (location, cb) => require(['../../docs/renderers/Field.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Tabs',
path: '/docs/renderers/Tabs',
getComponent: (location, cb) => require(['../../docs/renderers/Tabs.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Grid',
path: '/docs/renderers/Grid',
getComponent: (location, cb) => require(['../../docs/renderers/Grid.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'HBox',
path: '/docs/renderers/HBox',
getComponent: (location, cb) => require(['../../docs/renderers/HBox.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Button-Group',
path: '/docs/renderers/Button-Group',
getComponent: (location, cb) => require(['../../docs/renderers/Button-Group.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'iFrame',
path: '/docs/renderers/iFrame',
getComponent: (location, cb) => require(['../../docs/renderers/iFrame.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Nav',
path: '/docs/renderers/Nav',
getComponent: (location, cb) => require(['../../docs/renderers/Nav.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'Tasks',
path: '/docs/renderers/Tasks',
getComponent: (location, cb) => require(['../../docs/renderers/Tasks.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: 'QRCode',
path: '/docs/renderers/QRCode',
getComponent: (location, cb) => require(['../../docs/renderers/QRCode.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
{
label: '类型说明',
path: '/docs/renderers/Types',
getComponent: (location, cb) => require(['../../docs/renderers/Types.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
}),
},
]
},
{
label: '开源渲染器',
path: '/docs/sdk',
icon: 'fa fa-cubes',
getComponent: (location, cb) => require(['../../docs/sdk.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
},
{
label: '自定义组件',
path: '/docs/dev',
icon: 'fa fa-code',
getComponent: (location, cb) => require(['../../docs/dev.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
},
{
label: '样式说明',
path: '/docs/style',
icon: 'fa fa-laptop',
getComponent: (location, cb) => require(['../../docs/style.md'], (doc) => {
cb(null, makeMarkdownRenderer(doc));
})
}
]
}

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "Combo 示例",
body: [
{

View File

@ -39,7 +39,7 @@ class CustomRenderer extends React.Component {
}
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "自定义组件示例",
body: [
{

View File

@ -1,7 +1,7 @@
import * as React from 'react';
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "Editor",
body: [
{

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "FieldSet 示例",
body: [
{

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "FieldSet In Tabs",
remark: "",
body: {

View File

@ -1,5 +1,5 @@
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "公式示例",
"body": [
"<p>通过公式,可以动态的设置目标值。</p>",

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "所有 Form 元素列举",
data: {
id: 1,

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "其他类型演示",
body: [
{

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "表单各种展示模式汇总",
remark: "展示各种模式的 Form",
body: [

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "表格编辑",
body: {
type: "form",

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "显隐切换示例",
body: [
{

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "动态拉取选项",
name: "page-form-remote",
body: [

View File

@ -1,7 +1,7 @@
import * as React from 'react';
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "富文本编辑器",
body: [
{

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "所有 Form 元素列举",
data: {
id: 1,

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "SubForm 示例",
body: [
{

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "表格编辑",
body: {
type: "form",

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "Tabs 示例",
body: [
{

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "表单验证示例",
toolbar: "<a target='_blank' href='/docs/renderers#formitem'>文档</a>",
body: [

View File

@ -2020,7 +2020,7 @@ const options = [
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "各种表单项的不同模式样式测试,记得切到小屏幕测试",
"body": [

View File

@ -1,5 +1,5 @@
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "HBox & Grid",
"type": "page",
"body": [

View File

@ -1,5 +1,5 @@
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "IFrame 可以用来嵌入其他网站",
"body": [
{

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "表单与列表之间的联动",
body: [
{

View File

@ -1,5 +1,5 @@
export default {
$schema: "http://amis.baidu.com/v2/schemas/page.json#",
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
type: 'page',
title: "地址栏变化自动更新",
initApi: '/api/mock2/form/initData?id=${id}',

View File

@ -9,7 +9,7 @@ import * as stripJsonComments from 'strip-json-comments';
import CodeEditor from '../../src/components/Editor';
const DEFAULT_CONTENT = `{
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"type": "page",
"title": "Title",
"body": "Body",

View File

@ -13,7 +13,7 @@ function loadEditor() {
export default function(schema) {
if (!schema['$schema']) {
schema = {
'$schema': 'http://amis.baidu.com/v2/schemas/page.json',
'$schema': 'https://houtai.baidu.com/v2/schemas/page.json',
...schema
};
}

View File

@ -1,5 +1,5 @@
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "异步任务",
"body": [
'<p class="text-danger"></p>',

View File

@ -1,5 +1,5 @@
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "视频播放器",
"body": [
'<p class="text-danger">另外还支持直播流, flv 和 hls 格式</p>',

View File

@ -1,5 +1,5 @@
export default {
"$schema": "http://amis.baidu.com/v2/schemas/page.json#",
"$schema": "https://houtai.baidu.com/v2/schemas/page.json#",
"title": "表单向导",
"body": [
{

View File

@ -1,6 +1,7 @@
/**
* @file fis-conf.js 配置
*/
const path = require('path');
const parserMarkdown = require('./build/md-parser');
fis.get('project.ignore').push(
'public/**',
@ -36,7 +37,22 @@ fis.match('/node_modules/**.js', {
fis.match('/docs/**.md', {
rExt: 'js',
parser: parserMarkdown,
parser: [parserMarkdown, function(contents, file) {
return contents.replace(/\bhref=\\('|")(.+?)\\\1/g, function(_, quota, link) {
if (/\.md($|#)/.test(link)) {
let parts = link.split('#');
parts[0] = parts[0].replace('.md', '');
if (parts[0][0] !== '/') {
parts[0] = path.resolve(path.dirname(file.subpath), parts[0]);
}
return 'href=\\' + quota + parts.join('#') + '\\' + quota;
}
return _;
});
}],
isMod: true
});

View File

@ -1,4 +1,4 @@
rewrite ^\/(?:examples|v2\/docs)\/[a-z0-9\-_\/]+$ /examples/index.html
rewrite ^\/(?:examples|docs)\/[a-z0-9\-_\/]+$ /examples/index.html
rewrite ^\/play$ /examples/index.html
rewrite ^\/edit$ /examples/index.html

View File

@ -75,6 +75,7 @@
display: table;
table-layout: fixed;
width: 100%;
height: 100%;
border-spacing: 0;
.#{$ns}Page-aside,