文档样式没问题了,
This commit is contained in:
parent
03e8a88385
commit
2bcf987201
|
@ -16,86 +16,12 @@ import {
|
||||||
Redirect,
|
Redirect,
|
||||||
withRouter
|
withRouter
|
||||||
} from 'react-router';
|
} from 'react-router';
|
||||||
import makeSchemaRenderer from './SchemaRender';
|
|
||||||
|
|
||||||
import SimplePageSchema from './Page/Simple';
|
|
||||||
import ErrorPageSchema from './Page/Error';
|
|
||||||
import FormPageSchema from './Page/Form';
|
|
||||||
import ModeFormSchema from './Form/Mode';
|
|
||||||
import FieldSetFormSchema from './Form/FieldSet';
|
|
||||||
import TabsFormSchema from './Form/Tabs';
|
|
||||||
import RemoteFormSchema from './Form/Remote';
|
|
||||||
import ReactionFormSchema from './Form/Reaction';
|
|
||||||
import ValidationFormSchema from './Form/Validation';
|
|
||||||
import FullFormSchema from './Form/Full';
|
|
||||||
import StaticFormSchema from './Form/Static';
|
|
||||||
import HintFormSchema from './Form/Hint';
|
|
||||||
import FieldSetInTabsFormSchema from './Form/FieldSetInTabs';
|
|
||||||
import ComboFormSchema from './Form/Combo';
|
|
||||||
import SubFormSchema from './Form/SubForm';
|
|
||||||
import RichTextSchema from './Form/RichText';
|
|
||||||
import EditorSchema from './Form/Editor';
|
|
||||||
import TestFormSchema from './Form/Test';
|
|
||||||
import TransferFormSchema from './Form/Transfer';
|
|
||||||
import TableFormSchema from './Form/Table';
|
|
||||||
import PickerFormSchema from './Form/Picker';
|
|
||||||
import FormulaFormSchema from './Form/Formula';
|
|
||||||
import CustomFormSchema from './Form/Custom';
|
|
||||||
import FormLayoutTestSchema from './Form/layoutTest';
|
|
||||||
import Definitions from './Form/Definitions';
|
|
||||||
import Docs from './Doc';
|
|
||||||
|
|
||||||
import TableCrudSchema from './CRUD/Table';
|
|
||||||
import ItemActionsSchema from './CRUD/ItemActions';
|
|
||||||
import GridCrudSchema from './CRUD/Grid';
|
|
||||||
import ListCrudSchema from './CRUD/List';
|
|
||||||
import LoadMoreSchema from './CRUD/LoadMore';
|
|
||||||
import TestCrudSchema from './CRUD/test';
|
|
||||||
import FixedCrudSchema from './CRUD/Fix';
|
|
||||||
import AsideCrudSchema from './CRUD/Aside';
|
|
||||||
import FieldsCrudSchema from './CRUD/Fields';
|
|
||||||
import JumpNextCrudSchema from './CRUD/JumpNext';
|
|
||||||
import KeyboardsCrudSchema from './CRUD/Keyboards';
|
|
||||||
import FootableCrudSchema from './CRUD/Footable';
|
|
||||||
import NestedCrudSchema from './CRUD/Nested';
|
|
||||||
import MergeCellSchema from './CRUD/MergeCell';
|
|
||||||
import HeaderGroupSchema from './CRUD/HeaderGroup';
|
|
||||||
import HeaderHideSchema from './CRUD/HeaderHide';
|
|
||||||
import LoadOnceTableCrudSchema from './CRUD/LoadOnce';
|
|
||||||
import SdkTest from './Sdk/Test';
|
|
||||||
import JSONSchemaForm from './Form/Schem';
|
|
||||||
import SimpleDialogSchema from './Dialog/Simple';
|
|
||||||
import DrwaerSchema from './Dialog/Drawer';
|
|
||||||
|
|
||||||
import PageLinkPageSchema from './Linkage/Page';
|
|
||||||
import FormLinkPageSchema from './Linkage/Form';
|
|
||||||
import Form2LinkPageSchema from './Linkage/Form2';
|
|
||||||
import CRUDLinkPageSchema from './Linkage/CRUD';
|
|
||||||
import OptionsPageSchema from './Linkage/Options';
|
|
||||||
import OptionsLocalPageSchema from './Linkage/OptionsLocal';
|
|
||||||
import WizardSchema from './Wizard';
|
|
||||||
import ChartSchema from './Chart';
|
|
||||||
import HorizontalSchema from './Horizontal';
|
|
||||||
import VideoSchema from './Video';
|
|
||||||
import AudioSchema from './Audio';
|
|
||||||
import CarouselSchema from './Carousel';
|
|
||||||
import TasksSchema from './Tasks';
|
|
||||||
import ServicesDataSchema from './Services/Data';
|
|
||||||
import ServicesSchemaSchema from './Services/Schema';
|
|
||||||
import ServicesFormSchema from './Services/Form';
|
|
||||||
import IFrameSchema from './IFrame';
|
|
||||||
|
|
||||||
import NormalTabSchema from './Tabs/Normal';
|
|
||||||
import FormTabSchema from './Tabs/Form';
|
|
||||||
import Tab1Schema from './Tabs/Tab1';
|
|
||||||
import Tab2Schema from './Tabs/Tab2';
|
|
||||||
import Tab3Schema from './Tabs/Tab3';
|
|
||||||
import TestComponent from './Test';
|
|
||||||
import Select from '../../src/components/Select';
|
import Select from '../../src/components/Select';
|
||||||
import Button from '../../src/components/Button';
|
|
||||||
import DocSearch from './DocSearch';
|
import DocSearch from './DocSearch';
|
||||||
import {groupBy} from 'lodash';
|
import {groupBy} from 'lodash';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
|
import Doc, {docs} from './Doc';
|
||||||
|
import Example, {examples} from './Example';
|
||||||
|
|
||||||
let PathPrefix = '/examples';
|
let PathPrefix = '/examples';
|
||||||
let ContextPath = '';
|
let ContextPath = '';
|
||||||
|
@ -105,452 +31,6 @@ if (process.env.NODE_ENV === 'production') {
|
||||||
ContextPath = '/amis';
|
ContextPath = '/amis';
|
||||||
}
|
}
|
||||||
|
|
||||||
const navigations = [
|
|
||||||
Docs,
|
|
||||||
{
|
|
||||||
prefix: ({classnames: cx}) => <li className={cx('AsideNav-divider')} />,
|
|
||||||
label: '示例',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
label: '页面',
|
|
||||||
icon: 'glyphicon glyphicon-th',
|
|
||||||
badge: 3,
|
|
||||||
badgeClassName: 'bg-info',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
label: '简单页面',
|
|
||||||
path: 'pages/simple',
|
|
||||||
component: makeSchemaRenderer(SimplePageSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '初始化出错',
|
|
||||||
path: 'pages/error',
|
|
||||||
component: makeSchemaRenderer(ErrorPageSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '表单页面',
|
|
||||||
path: 'pages/form',
|
|
||||||
component: makeSchemaRenderer(FormPageSchema)
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '表单',
|
|
||||||
icon: 'fa fa-list-alt',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
label: '表单展示模式',
|
|
||||||
path: 'form/mode',
|
|
||||||
component: makeSchemaRenderer(ModeFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '所有类型汇总',
|
|
||||||
path: 'form/full',
|
|
||||||
component: makeSchemaRenderer(FullFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '静态展示',
|
|
||||||
path: 'form/static',
|
|
||||||
component: makeSchemaRenderer(StaticFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '输入提示',
|
|
||||||
path: 'form/hint',
|
|
||||||
component: makeSchemaRenderer(HintFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: 'FieldSet',
|
|
||||||
path: 'form/fieldset',
|
|
||||||
component: makeSchemaRenderer(FieldSetFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: 'Tabs',
|
|
||||||
path: 'form/tabs',
|
|
||||||
component: makeSchemaRenderer(TabsFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: 'FieldSet Tabs 组合',
|
|
||||||
path: 'form/fields-tabs',
|
|
||||||
component: makeSchemaRenderer(FieldSetInTabsFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '动态数据',
|
|
||||||
path: 'form/remote',
|
|
||||||
component: makeSchemaRenderer(RemoteFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '显隐状态联动',
|
|
||||||
path: 'form/reaction',
|
|
||||||
component: makeSchemaRenderer(ReactionFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '表单验证',
|
|
||||||
path: 'form/validation',
|
|
||||||
component: makeSchemaRenderer(ValidationFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '组合类型',
|
|
||||||
path: 'form/combo',
|
|
||||||
component: makeSchemaRenderer(ComboFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '穿梭器',
|
|
||||||
path: 'form/transfer',
|
|
||||||
component: makeSchemaRenderer(TransferFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '多功能选择器',
|
|
||||||
path: 'form/picker',
|
|
||||||
component: makeSchemaRenderer(PickerFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '子表单',
|
|
||||||
path: 'form/sub-form',
|
|
||||||
component: makeSchemaRenderer(SubFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: 'JSon Schema表单',
|
|
||||||
path: 'form/json-schema',
|
|
||||||
component: JSONSchemaForm
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '富文本',
|
|
||||||
path: 'form/rich-text',
|
|
||||||
component: makeSchemaRenderer(RichTextSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '代码编辑器',
|
|
||||||
path: 'form/ide',
|
|
||||||
component: makeSchemaRenderer(EditorSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '自定义组件',
|
|
||||||
path: 'form/custom',
|
|
||||||
component: makeSchemaRenderer(CustomFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '表格编辑',
|
|
||||||
path: 'form/table',
|
|
||||||
component: makeSchemaRenderer(TableFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '公式示例',
|
|
||||||
path: 'form/formula',
|
|
||||||
component: makeSchemaRenderer(FormulaFormSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '引用',
|
|
||||||
path: 'form/definitions',
|
|
||||||
component: makeSchemaRenderer(Definitions)
|
|
||||||
}
|
|
||||||
|
|
||||||
// {
|
|
||||||
// label: '布局测试',
|
|
||||||
// path: 'form/layout-test',
|
|
||||||
// component: makeSchemaRenderer(FormLayoutTestSchema)
|
|
||||||
// },
|
|
||||||
|
|
||||||
// {
|
|
||||||
// label: '测试',
|
|
||||||
// path: 'form/test',
|
|
||||||
// component: makeSchemaRenderer(TestFormSchema)
|
|
||||||
// },
|
|
||||||
]
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '增删改查',
|
|
||||||
icon: 'fa fa-table',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
label: '表格模式',
|
|
||||||
path: 'crud/table',
|
|
||||||
component: makeSchemaRenderer(TableCrudSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '卡片模式',
|
|
||||||
path: 'crud/grid',
|
|
||||||
component: makeSchemaRenderer(GridCrudSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '列表模式',
|
|
||||||
path: 'crud/list',
|
|
||||||
component: makeSchemaRenderer(ListCrudSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '加载更多模式',
|
|
||||||
path: 'crud/load-more',
|
|
||||||
component: makeSchemaRenderer(LoadMoreSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '操作交互显示',
|
|
||||||
path: 'crud/item-actions',
|
|
||||||
component: makeSchemaRenderer(ItemActionsSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '列类型汇总',
|
|
||||||
path: 'crud/columns',
|
|
||||||
component: makeSchemaRenderer(FieldsCrudSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '可折叠',
|
|
||||||
path: 'crud/footable',
|
|
||||||
component: makeSchemaRenderer(FootableCrudSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '嵌套',
|
|
||||||
path: 'crud/nested',
|
|
||||||
component: makeSchemaRenderer(NestedCrudSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '合并单元格',
|
|
||||||
path: 'crud/merge-cell',
|
|
||||||
component: makeSchemaRenderer(MergeCellSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '表头分组',
|
|
||||||
path: 'crud/header-group',
|
|
||||||
component: makeSchemaRenderer(HeaderGroupSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '表头隐藏',
|
|
||||||
path: 'crud/header-hide',
|
|
||||||
component: makeSchemaRenderer(HeaderHideSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '带边栏',
|
|
||||||
path: 'crud/aside',
|
|
||||||
component: makeSchemaRenderer(AsideCrudSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '固定表头/列',
|
|
||||||
path: 'crud/fixed',
|
|
||||||
component: makeSchemaRenderer(FixedCrudSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '键盘操作编辑',
|
|
||||||
path: 'crud/keyboards',
|
|
||||||
component: makeSchemaRenderer(KeyboardsCrudSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '操作并下一个',
|
|
||||||
path: 'crud/jump-next',
|
|
||||||
component: makeSchemaRenderer(JumpNextCrudSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '一次性加载',
|
|
||||||
path: 'crud/load-once',
|
|
||||||
component: makeSchemaRenderer(LoadOnceTableCrudSchema)
|
|
||||||
}
|
|
||||||
// {
|
|
||||||
// label: '测试',
|
|
||||||
// path: 'crud/test',
|
|
||||||
// component: makeSchemaRenderer(TestCrudSchema)
|
|
||||||
// }
|
|
||||||
]
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '弹框',
|
|
||||||
icon: 'fa fa-bomb',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
label: '对话框',
|
|
||||||
path: 'dialog/simple',
|
|
||||||
component: makeSchemaRenderer(SimpleDialogSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '侧边弹出',
|
|
||||||
path: 'dialog/drawer',
|
|
||||||
component: makeSchemaRenderer(DrwaerSchema)
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '选项卡',
|
|
||||||
icon: 'fa fa-clone',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
label: '常规选项卡',
|
|
||||||
path: 'tabs/normal',
|
|
||||||
component: makeSchemaRenderer(NormalTabSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '表单中选项卡分组',
|
|
||||||
path: 'tabs/form',
|
|
||||||
component: makeSchemaRenderer(FormTabSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '选项卡页面1',
|
|
||||||
path: 'tabs/tab1',
|
|
||||||
component: makeSchemaRenderer(Tab1Schema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '选项卡页面2',
|
|
||||||
path: 'tabs/tab2',
|
|
||||||
component: makeSchemaRenderer(Tab2Schema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '选项卡页面3',
|
|
||||||
path: 'tabs/tab3',
|
|
||||||
component: makeSchemaRenderer(Tab3Schema)
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '联动',
|
|
||||||
icon: 'fa fa-bolt',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
label: '地址栏变化自动更新',
|
|
||||||
path: 'linkpage/page',
|
|
||||||
component: makeSchemaRenderer(PageLinkPageSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '选项联动',
|
|
||||||
path: 'linkpage/options-local',
|
|
||||||
component: makeSchemaRenderer(OptionsLocalPageSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '选项远程联动',
|
|
||||||
path: 'linkpage/options',
|
|
||||||
component: makeSchemaRenderer(OptionsPageSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '表单和表单联动',
|
|
||||||
path: 'linkpage/form',
|
|
||||||
component: makeSchemaRenderer(FormLinkPageSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '表单自动更新',
|
|
||||||
path: 'linkpage/form2',
|
|
||||||
component: makeSchemaRenderer(Form2LinkPageSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '表单和列表联动',
|
|
||||||
path: 'linkpage/crud',
|
|
||||||
component: makeSchemaRenderer(CRUDLinkPageSchema)
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '动态加载',
|
|
||||||
icon: 'fa fa-magic',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
label: '动态加载数据',
|
|
||||||
path: 'services/data',
|
|
||||||
component: makeSchemaRenderer(ServicesDataSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '动态加载页面',
|
|
||||||
path: 'services/schema',
|
|
||||||
component: makeSchemaRenderer(ServicesSchemaSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '动态加载部分表单',
|
|
||||||
path: 'services/form',
|
|
||||||
component: makeSchemaRenderer(ServicesFormSchema)
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '向导',
|
|
||||||
icon: 'fa fa-desktop',
|
|
||||||
path: 'wizard',
|
|
||||||
component: makeSchemaRenderer(WizardSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '排版',
|
|
||||||
icon: 'fa fa-columns',
|
|
||||||
path: 'horizontal',
|
|
||||||
component: makeSchemaRenderer(HorizontalSchema)
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '图表',
|
|
||||||
icon: 'fa fa-bar-chart',
|
|
||||||
path: 'chart',
|
|
||||||
component: makeSchemaRenderer(ChartSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '轮播图',
|
|
||||||
icon: 'fa fa-pause',
|
|
||||||
path: 'carousel',
|
|
||||||
component: makeSchemaRenderer(CarouselSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '音频',
|
|
||||||
icon: 'fa fa-volume-up',
|
|
||||||
path: 'audio',
|
|
||||||
component: makeSchemaRenderer(AudioSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '视频',
|
|
||||||
icon: 'fa fa-video-camera',
|
|
||||||
path: 'video',
|
|
||||||
component: makeSchemaRenderer(VideoSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '异步任务',
|
|
||||||
icon: 'fa fa-tasks',
|
|
||||||
path: 'task',
|
|
||||||
component: makeSchemaRenderer(TasksSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'IFrame',
|
|
||||||
icon: 'fa fa-cloud',
|
|
||||||
path: 'iframe',
|
|
||||||
component: makeSchemaRenderer(IFrameSchema)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'SDK',
|
|
||||||
icon: 'fa fa-rocket',
|
|
||||||
path: 'sdk',
|
|
||||||
component: SdkTest
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: 'Test',
|
|
||||||
icon: 'fa fa-code',
|
|
||||||
path: 'test',
|
|
||||||
component: TestComponent
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
function isActive(link, location) {
|
|
||||||
return !!(link && link === location.pathname);
|
|
||||||
}
|
|
||||||
|
|
||||||
const themes = [
|
const themes = [
|
||||||
{
|
{
|
||||||
label: '默认主题',
|
label: '默认主题',
|
||||||
|
@ -592,7 +72,7 @@ export class App extends React.PureComponent {
|
||||||
themes: themes,
|
themes: themes,
|
||||||
theme: themes[localStorage.getItem('themeIndex') || 0],
|
theme: themes[localStorage.getItem('themeIndex') || 0],
|
||||||
locale: localStorage.getItem('locale') || '',
|
locale: localStorage.getItem('locale') || '',
|
||||||
docs: Docs.children
|
navigations: []
|
||||||
};
|
};
|
||||||
|
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
|
@ -601,6 +81,7 @@ export class App extends React.PureComponent {
|
||||||
this.toggleAside = this.toggleAside.bind(this);
|
this.toggleAside = this.toggleAside.bind(this);
|
||||||
this.setAsideFolded = this.setAsideFolded.bind(this);
|
this.setAsideFolded = this.setAsideFolded.bind(this);
|
||||||
this.setHeaderVisible = this.setHeaderVisible.bind(this);
|
this.setHeaderVisible = this.setHeaderVisible.bind(this);
|
||||||
|
this.setNavigations = this.setNavigations.bind(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
|
@ -666,6 +147,33 @@ export class App extends React.PureComponent {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
setNavigations(items) {
|
||||||
|
this.setState({
|
||||||
|
navigations: items
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleOpen(e, item) {
|
||||||
|
e.stopPropagation();
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
const navigations = mapTree(this.state.navigations, i => {
|
||||||
|
const defaultOpen =
|
||||||
|
i.isOpen ??
|
||||||
|
(Array.isArray(i.children) &&
|
||||||
|
i.children.length &&
|
||||||
|
!!~i.children.findIndex(item => item.path === location.pathname));
|
||||||
|
return {
|
||||||
|
...i,
|
||||||
|
isOpen: item.label === i.label ? !defaultOpen : defaultOpen
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
this.setState({
|
||||||
|
navigations
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
renderHeader() {
|
renderHeader() {
|
||||||
const location = this.props.location;
|
const location = this.props.location;
|
||||||
const theme = this.state.theme;
|
const theme = this.state.theme;
|
||||||
|
@ -696,8 +204,12 @@ export class App extends React.PureComponent {
|
||||||
|
|
||||||
<div className={`${theme.ns}Layout-headerBar`}>
|
<div className={`${theme.ns}Layout-headerBar`}>
|
||||||
<ul className={`${theme.ns}Layout-headerBar-links pull-left`}>
|
<ul className={`${theme.ns}Layout-headerBar-links pull-left`}>
|
||||||
<Link to="/docs">文档</Link>
|
<Link to="/docs" activeClassName="is-active">
|
||||||
<Link to="/examples">示例</Link>
|
文档
|
||||||
|
</Link>
|
||||||
|
<Link to="/examples" activeClassName="is-active">
|
||||||
|
示例
|
||||||
|
</Link>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<div className="hidden-xs p-t pull-right m-l-sm">
|
<div className="hidden-xs p-t pull-right m-l-sm">
|
||||||
|
@ -735,50 +247,41 @@ export class App extends React.PureComponent {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
toggleOpen(e, item) {
|
renderNavigation(navs, parent?: any) {
|
||||||
e.stopPropagation();
|
const pathname = location.pathname;
|
||||||
e.preventDefault();
|
return navs.map(nav => {
|
||||||
|
const path = nav.path;
|
||||||
const docs = mapTree(this.state.docs, i => ({
|
const hasChildren = Array.isArray(nav.children) && nav.children.length;
|
||||||
...i,
|
const isOpen =
|
||||||
isOpen: item.id === i.id ? !i.isOpen : i.isOpen
|
nav.isOpen ||
|
||||||
}));
|
(nav.isOpen !== false &&
|
||||||
|
hasChildren &&
|
||||||
this.setState({
|
!!~nav.children.findIndex(item => item.path === pathname));
|
||||||
docs
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
renderNavigation(children, parent) {
|
|
||||||
return children.map(child => {
|
|
||||||
const path = child.path;
|
|
||||||
const hasChildren =
|
|
||||||
Array.isArray(child.children) && child.children.length;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
key={child.id}
|
key={nav.label}
|
||||||
className={classnames('Doc-navigation-item', {
|
className={classnames('Doc-navigation-item', {
|
||||||
'is-active': path === location.pathname,
|
'is-active': path === location.pathname,
|
||||||
'is-top': !parent,
|
'is-top': !parent,
|
||||||
'is-open': child.isOpen
|
'is-open': isOpen
|
||||||
})}
|
})}
|
||||||
>
|
>
|
||||||
<Link to={path}>
|
<Link to={`${path || (hasChildren && nav.children[0].path)}`}>
|
||||||
{child.label}
|
{nav.label}
|
||||||
{hasChildren ? (
|
{hasChildren ? (
|
||||||
<i
|
<i
|
||||||
className={`iconfont icon-down-arrow ${
|
className={`iconfont icon-down-arrow ${
|
||||||
child.isOpen ? '' : 'is-flipped'
|
isOpen ? '' : 'is-flipped'
|
||||||
}`}
|
}`}
|
||||||
onClick={e => this.toggleOpen(e, child)}
|
onClick={e => this.toggleOpen(e, nav)}
|
||||||
></i>
|
></i>
|
||||||
) : null}
|
) : null}
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
{hasChildren && child.isOpen
|
{isOpen
|
||||||
? this.renderNavigation(child.children, {
|
? this.renderNavigation(nav.children || [], {
|
||||||
...child,
|
...nav,
|
||||||
path
|
path
|
||||||
})
|
})
|
||||||
: null}
|
: null}
|
||||||
|
@ -788,10 +291,8 @@ export class App extends React.PureComponent {
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
// const pathname = this.props.location.pathname;
|
|
||||||
const theme = this.state.theme;
|
const theme = this.state.theme;
|
||||||
const groups = groupBy(this.state.docs, d => d.group);
|
const navigations = this.state.navigations;
|
||||||
groups['组件'] = groups['undefined'][0].children;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Layout
|
<Layout
|
||||||
|
@ -808,12 +309,12 @@ export class App extends React.PureComponent {
|
||||||
<div className="Doc">
|
<div className="Doc">
|
||||||
<div className="Doc-nav">
|
<div className="Doc-nav">
|
||||||
<div className="Doc-navigation">
|
<div className="Doc-navigation">
|
||||||
{Object.keys(groups).map(groupName => (
|
{navigations.map(item => (
|
||||||
<div className="Doc-navigationGroup" key={groupName}>
|
<div className="Doc-navigationGroup" key={item.label}>
|
||||||
<div className="Doc-navigationGroup-name">
|
<div className="Doc-navigationGroup-name">
|
||||||
{groupName || '其他'}
|
{item.label || '其他'}
|
||||||
</div>
|
</div>
|
||||||
{this.renderNavigation(groups[groupName])}
|
{this.renderNavigation(item.children)}
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
@ -821,6 +322,7 @@ export class App extends React.PureComponent {
|
||||||
|
|
||||||
{React.cloneElement(this.props.children, {
|
{React.cloneElement(this.props.children, {
|
||||||
...this.props.children.props,
|
...this.props.children.props,
|
||||||
|
setNavigations: this.setNavigations,
|
||||||
setAsideFolded: this.setAsideFolded,
|
setAsideFolded: this.setAsideFolded,
|
||||||
setHeaderVisible: this.setHeaderVisible,
|
setHeaderVisible: this.setHeaderVisible,
|
||||||
theme: theme.value,
|
theme: theme.value,
|
||||||
|
@ -833,7 +335,7 @@ export class App extends React.PureComponent {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function navigations2route(pathPrefix = PathPrefix) {
|
function navigations2route(pathPrefix = PathPrefix, navigations) {
|
||||||
let routes = [];
|
let routes = [];
|
||||||
|
|
||||||
navigations.forEach(root => {
|
navigations.forEach(root => {
|
||||||
|
@ -872,20 +374,21 @@ function navigations2route(pathPrefix = PathPrefix) {
|
||||||
|
|
||||||
export default function entry({pathPrefix}) {
|
export default function entry({pathPrefix}) {
|
||||||
PathPrefix = pathPrefix || PathPrefix;
|
PathPrefix = pathPrefix || PathPrefix;
|
||||||
let history = browserHistory;
|
|
||||||
|
|
||||||
// if (process.env.NODE_ENV === 'production') {
|
|
||||||
// history = hashHistory;
|
|
||||||
// }
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Router history={history}>
|
<Router history={browserHistory}>
|
||||||
<Route component={App}>
|
<Route component={App}>
|
||||||
<Redirect from={`${ContextPath}/`} to={`${ContextPath}/docs/intro`} />
|
<Redirect from={`${ContextPath}/`} to={`${ContextPath}/docs/intro`} />
|
||||||
<Redirect from={`${PathPrefix}/`} to={`/docs/intro`} />
|
<Redirect from={`/examples`} to={`/examples/pages/simple`} />
|
||||||
{navigations2route(PathPrefix)}
|
<Redirect from={`/docs`} to={`/docs/intro`} />
|
||||||
<Route path="*" component={NotFound} />
|
<Route path="/docs" component={Doc}>
|
||||||
|
{navigations2route('/docs', docs)}
|
||||||
</Route>
|
</Route>
|
||||||
|
<Route path="/examples" component={Example}>
|
||||||
|
{navigations2route('/examples', examples)}
|
||||||
|
</Route>
|
||||||
|
</Route>
|
||||||
|
|
||||||
|
<Route path="*" component={NotFound} />
|
||||||
</Router>
|
</Router>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,87 +0,0 @@
|
||||||
import React from 'react';
|
|
||||||
import makeMarkdownRenderer from './MdRenderer';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
// prefix: ({classnames: cx}) => <li className={cx('AsideNav-divider')} />,
|
|
||||||
label: '文档',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
label: 'AMIS 是什么?',
|
|
||||||
group: '开始',
|
|
||||||
icon: 'fa fa-home',
|
|
||||||
path: '/docs/intro',
|
|
||||||
getComponent: (location, cb) =>
|
|
||||||
require(['../../docs/intro.md'], doc => {
|
|
||||||
cb(null, makeMarkdownRenderer(doc));
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '快速开始',
|
|
||||||
group: '开始',
|
|
||||||
icon: 'fa fa-flash',
|
|
||||||
path: '/docs/getting-started',
|
|
||||||
getComponent: (location, cb) =>
|
|
||||||
require(['../../docs/getting_started.md'], doc => {
|
|
||||||
cb(null, makeMarkdownRenderer(doc));
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '基本用法',
|
|
||||||
group: '开始',
|
|
||||||
icon: 'fa fa-file',
|
|
||||||
path: '/docs/basic',
|
|
||||||
getComponent: (location, cb) =>
|
|
||||||
require(['../../docs/basic.md'], doc => {
|
|
||||||
cb(null, makeMarkdownRenderer(doc));
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '高级用法',
|
|
||||||
group: '开始',
|
|
||||||
icon: 'fa fa-rocket',
|
|
||||||
path: '/docs/advanced',
|
|
||||||
getComponent: (location, cb) =>
|
|
||||||
require(['../../docs/advanced.md'], doc => {
|
|
||||||
cb(null, makeMarkdownRenderer(doc));
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
// {{renderer-docs}}
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '动态数据',
|
|
||||||
group: '开始',
|
|
||||||
path: '/docs/api',
|
|
||||||
icon: 'fa fa-cloud',
|
|
||||||
getComponent: (location, cb) =>
|
|
||||||
require(['../../docs/api.md'], doc => {
|
|
||||||
cb(null, makeMarkdownRenderer(doc));
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '定制功能',
|
|
||||||
group: '开始',
|
|
||||||
path: '/docs/custom',
|
|
||||||
icon: 'fa fa-cubes',
|
|
||||||
getComponent: (location, cb) =>
|
|
||||||
require(['../../docs/custom.md'], doc => {
|
|
||||||
cb(null, makeMarkdownRenderer(doc));
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
label: '定制样式',
|
|
||||||
group: '开始',
|
|
||||||
path: '/docs/style',
|
|
||||||
icon: 'fa fa-laptop',
|
|
||||||
getComponent: (location, cb) =>
|
|
||||||
require(['../../docs/style.md'], doc => {
|
|
||||||
cb(null, makeMarkdownRenderer(doc));
|
|
||||||
})
|
|
||||||
}
|
|
||||||
]
|
|
||||||
};
|
|
|
@ -0,0 +1,114 @@
|
||||||
|
import React from 'react';
|
||||||
|
import makeMarkdownRenderer from './MdRenderer';
|
||||||
|
|
||||||
|
export const docs = [
|
||||||
|
{
|
||||||
|
// prefix: ({classnames: cx}) => <li className={cx('AsideNav-divider')} />,
|
||||||
|
label: '开始',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
label: 'AMIS 是什么?',
|
||||||
|
icon: 'fa fa-home',
|
||||||
|
path: '/docs/intro',
|
||||||
|
getComponent: (location, cb) =>
|
||||||
|
require(['../../docs/intro.md'], doc => {
|
||||||
|
cb(null, makeMarkdownRenderer(doc));
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
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-file',
|
||||||
|
path: '/docs/basic',
|
||||||
|
getComponent: (location, cb) =>
|
||||||
|
require(['../../docs/basic.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: '概念',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
label: '动态数据',
|
||||||
|
path: '/docs/api',
|
||||||
|
icon: 'fa fa-cloud',
|
||||||
|
getComponent: (location, cb) =>
|
||||||
|
require(['../../docs/api.md'], doc => {
|
||||||
|
cb(null, makeMarkdownRenderer(doc));
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
label: '定制功能',
|
||||||
|
path: '/docs/custom',
|
||||||
|
icon: 'fa fa-cubes',
|
||||||
|
getComponent: (location, cb) =>
|
||||||
|
require(['../../docs/custom.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));
|
||||||
|
})
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
|
||||||
|
// {{renderer-docs}}
|
||||||
|
|
||||||
|
{
|
||||||
|
label: '其他',
|
||||||
|
children: []
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
export default class Doc extends React.PureComponent {
|
||||||
|
componentDidMount() {
|
||||||
|
this.props.setNavigations(docs);
|
||||||
|
}
|
||||||
|
|
||||||
|
componentDidUpdate() {
|
||||||
|
console.log('componentDidUpdate');
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{React.cloneElement(this.props.children, {
|
||||||
|
...this.props.children!.props,
|
||||||
|
theme: this.props.theme,
|
||||||
|
classPrefix: this.props.classPrefix,
|
||||||
|
locale: this.props.locale
|
||||||
|
})}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
File diff suppressed because it is too large
Load Diff
|
@ -45,7 +45,7 @@ class CodePreview extends React.Component {
|
||||||
show
|
show
|
||||||
>
|
>
|
||||||
<PopOver
|
<PopOver
|
||||||
offset={{x: 0, y: 50 - height}}
|
offset={{x: 0, y: -height}}
|
||||||
style={{height}}
|
style={{height}}
|
||||||
className=":MDPreview-shcema-preview-popover"
|
className=":MDPreview-shcema-preview-popover"
|
||||||
>
|
>
|
||||||
|
@ -64,8 +64,7 @@ function isActive(link, location) {
|
||||||
return !!(link.fullPath && link.fullPath === location.hash);
|
return !!(link.fullPath && link.fullPath === location.hash);
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function (doc) {
|
class Preview extends React.Component {
|
||||||
return class extends React.Component {
|
|
||||||
static displayName = 'MarkdownRenderer';
|
static displayName = 'MarkdownRenderer';
|
||||||
ref = null;
|
ref = null;
|
||||||
doms = [];
|
doms = [];
|
||||||
|
@ -111,7 +110,7 @@ export default function (doc) {
|
||||||
this.ref = ref;
|
this.ref = ref;
|
||||||
|
|
||||||
if (ref) {
|
if (ref) {
|
||||||
ref.innerHTML = doc.html;
|
ref.innerHTML = this.props.doc.html;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -139,6 +138,7 @@ export default function (doc) {
|
||||||
this,
|
this,
|
||||||
<LazyComponent
|
<LazyComponent
|
||||||
{...this.props}
|
{...this.props}
|
||||||
|
height={height}
|
||||||
container={() => ReactDOM.findDOMNode(this)}
|
container={() => ReactDOM.findDOMNode(this)}
|
||||||
height={height}
|
height={height}
|
||||||
component={CodePreview}
|
component={CodePreview}
|
||||||
|
@ -152,6 +152,19 @@ export default function (doc) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<div className="MDPreview">
|
||||||
|
<div className="markdown-body" ref={this.divRef}>
|
||||||
|
Doc
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function (doc) {
|
||||||
|
return class extends React.Component {
|
||||||
renderHeading(children) {
|
renderHeading(children) {
|
||||||
return children.map((child, idx) => (
|
return children.map((child, idx) => (
|
||||||
<div
|
<div
|
||||||
|
@ -170,8 +183,6 @@ export default function (doc) {
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const {location} = this.props;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="Doc-content">
|
<div className="Doc-content">
|
||||||
|
@ -180,73 +191,9 @@ export default function (doc) {
|
||||||
<h1>{doc.title}</h1>
|
<h1>{doc.title}</h1>
|
||||||
</div>
|
</div>
|
||||||
) : null}
|
) : null}
|
||||||
|
<Preview {...this.props} doc={doc} />
|
||||||
<div className="markdown-body" ref={this.divRef}>
|
|
||||||
Doc
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
{doc.toc && doc.toc.children && doc.toc.children.length > 1 ? (
|
{doc.toc && doc.toc.children && doc.toc.children.length > 1 ? (
|
||||||
// <Portal container={() => document.querySelector('#asideInner')}>
|
|
||||||
// <NestedLinks
|
|
||||||
// navigations={[doc.toc]}
|
|
||||||
// renderLink={({
|
|
||||||
// link,
|
|
||||||
// active,
|
|
||||||
// toggleExpand,
|
|
||||||
// depth,
|
|
||||||
// classnames: cx
|
|
||||||
// }) => {
|
|
||||||
// let children = [];
|
|
||||||
|
|
||||||
// if (link.children) {
|
|
||||||
// children.push(
|
|
||||||
// <span
|
|
||||||
// key="expand-toggle"
|
|
||||||
// className={cx(`AsideNav-itemArrow`)}
|
|
||||||
// />
|
|
||||||
// );
|
|
||||||
// }
|
|
||||||
|
|
||||||
// link.badge &&
|
|
||||||
// children.push(
|
|
||||||
// <b
|
|
||||||
// key="badge"
|
|
||||||
// className={cx(
|
|
||||||
// 'AsideNav-itemBadge',
|
|
||||||
// link.badgeClassName || 'bg-info'
|
|
||||||
// )}
|
|
||||||
// >
|
|
||||||
// {link.badge}
|
|
||||||
// </b>
|
|
||||||
// );
|
|
||||||
|
|
||||||
// depth === 1 &&
|
|
||||||
// children.push(
|
|
||||||
// <i
|
|
||||||
// key="icon"
|
|
||||||
// className={cx('AsideNav-itemIcon fa fa-flag')}
|
|
||||||
// />
|
|
||||||
// );
|
|
||||||
|
|
||||||
// children.push(
|
|
||||||
// <span key="label" className={cx('AsideNav-itemLabel')}>
|
|
||||||
// {link.label}
|
|
||||||
// </span>
|
|
||||||
// );
|
|
||||||
|
|
||||||
// return link.fragment ? (
|
|
||||||
// <a href={`#${link.fragment}`}>{children}</a>
|
|
||||||
// ) : (
|
|
||||||
// <a
|
|
||||||
// onClick={link.children ? () => toggleExpand(link) : null}
|
|
||||||
// >
|
|
||||||
// {children}
|
|
||||||
// </a>
|
|
||||||
// );
|
|
||||||
// }}
|
|
||||||
// isActive={link => isActive(link, location)}
|
|
||||||
// />
|
|
||||||
// </Portal>
|
|
||||||
<div className="Doc-toc">
|
<div className="Doc-toc">
|
||||||
<div className="Doc-headingList">
|
<div className="Doc-headingList">
|
||||||
{this.renderHeading(doc.toc.children)}
|
{this.renderHeading(doc.toc.children)}
|
||||||
|
|
|
@ -95,6 +95,10 @@ body {
|
||||||
}
|
}
|
||||||
|
|
||||||
.app-wrapper {
|
.app-wrapper {
|
||||||
|
// .#{$ns}Layout {
|
||||||
|
// background: #000;
|
||||||
|
// }
|
||||||
|
|
||||||
.a-Layout {
|
.a-Layout {
|
||||||
&-headerBar {
|
&-headerBar {
|
||||||
height: 64px;
|
height: 64px;
|
||||||
|
@ -120,9 +124,28 @@ body {
|
||||||
height: 64px;
|
height: 64px;
|
||||||
line-height: 64px;
|
line-height: 64px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
padding-left: 10px;
|
||||||
|
|
||||||
> a {
|
> a {
|
||||||
|
display: inline-block;
|
||||||
color: #333;
|
color: #333;
|
||||||
padding-right: 30px;
|
padding: 0px 22px;
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 500;
|
||||||
|
|
||||||
|
&.is-active {
|
||||||
|
color: #108cee;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
border-bottom: 2px solid #108cee;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -258,6 +281,7 @@ body {
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
display: block;
|
display: block;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
> a {
|
> a {
|
||||||
color: #333;
|
color: #333;
|
||||||
|
|
|
@ -691,7 +691,7 @@ if (fis.project.currentMedia() === 'publish') {
|
||||||
}
|
}
|
||||||
|
|
||||||
function docsGennerator(contents, file) {
|
function docsGennerator(contents, file) {
|
||||||
if (file.subpath !== '/examples/components/Doc.jsx') {
|
if (file.subpath !== '/examples/components/Doc.tsx') {
|
||||||
return contents;
|
return contents;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue