github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: update layout

pull/309/head
tangjinzhou 2018-12-09 11:53:32 +08:00
parent cb0a927273
commit 0b17ebbb19
1 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
components/layout/demo/index.vue
View File

@ -81,10 +81,10 @@ The first level navigation is inclined left near a logo, and the secondary menu
### Interaction rules
- The first level navigation and the last level navigation should be distincted by visualization;
- The first level navigation and the last level navigation should be distinguishable by visualization;
- The current item should have the highest priority of visualization;
- When the current navigation item is collapsed, the stlye of the current navigation item will be applied to its parent level;
- The left side navigation bar has support for both the accordion and expanding styles, you can choose the one that fits your case best.
- When the current navigation item is collapsed, the style of the current navigation item is applied to its parent level;
- The left side navigation bar has support for both the accordion and expanding styles; you can choose the one that fits your case the best.
## Visualization rules
@ -92,27 +92,27 @@ The first level navigation is inclined left near a logo, and the secondary menu
- **Emphasis by colorblock**
When background color is a deep color, you can use this pattern for the parent level navigation item of current page.
When background color is a deep color, you can use this pattern for the parent level navigation item of the current page.
- **The highlight match stick**
When background color is a light color, you can use this pattern for the current page navigation item, we recommed using it for the last item of the navigation path.
When background color is a light color, you can use this pattern for the current page navigation item; we recommend using it for the last item of the navigation path.
- **Hightlighted font**
- **Highlighted font**
From the visualization aspect, hightlighted font is stronger than colorblock, this pattern is often used for the parent level of the current item.
From the visualization aspect, a highlighted font is stronger than colorblock; this pattern is often used for the parent level of the current item.
- **Enlarge the size of the font**
\`12px\`、\`14px\` is a standard font size of navigations，\`14px\` is used for the first and the second level of the navigation. You can choose a appropriate font size in terms of the level of your navigation.
\`12px\`、\`14px\` is a standard font size of navigations，\`14px\` is used for the first and the second level of the navigation. You can choose an appropriate font size regarding the level of your navigation.
## Component Overview
- \`Layout\`: The layout wrapper, in which \`Header\` \`Sider\` \`Content\` \`Footer\` or \`Layout\` itself can be nested, and can be placed in any parent container.
- \`Header\`: The top layout with default style, in which any element can be nested, and must be placed in \`Layout\`.
- \`Header\`: The top layout with the default style, in which any element can be nested, and must be placed in \`Layout\`.
- \`Sider\`: The sidebar with default style and basic functions, in which any element can be nested, and must be placed in \`Layout\`.
- \`Content\`: The content layout with default style, in which any element can be nested, and must be placed in \`Layout\`.
- \`Footer\`: The bottom layout with default style, in which any element can be nested, and must be placed in \`Layout\`.
- \`Content\`: The content layout with the default style, in which any element can be nested, and must be placed in \`Layout\`.
- \`Footer\`: The bottom layout with the default style, in which any element can be nested, and must be placed in \`Layout\`.
> Based on \`flex layout\`, please pay attention to the [compatibility](http://caniuse.com/#search=flex).