Browse Source

css: the style should follow design

pull/3638/head
Benjy Cui 8 years ago
parent
commit
a3ec948dcd
  1. 2
      components/tabs/index.en-US.md
  2. 2
      components/tabs/index.zh-CN.md
  3. 6
      components/tabs/style/index.less

2
components/tabs/index.en-US.md

@ -28,7 +28,7 @@ Ant Design has 3 types Tabs for different situation.
| onTabClick | Callback when tab is clicked | Function | - | | onTabClick | Callback when tab is clicked | Function | - |
| tabBarExtraContent | Extra element in tab bar | React.ReactNode | - | | tabBarExtraContent | Extra element in tab bar | React.ReactNode | - |
| type | Basic style of tabs. Options: line, card & editable-card | string | line | | type | Basic style of tabs. Options: line, card & editable-card | string | line |
| size | Tab bar size. Options: default, small | string | default | | size | Tab bar size. Options: default, small. Only works while `type="line"`. | string | default |
| tabPosition | Position of tabs. Options: top, right, bottom & left | string | top | | tabPosition | Position of tabs. Options: top, right, bottom & left | string | top |
| onEdit | Callback when tab is added or removed, which is executing when set type as editable-card | (targetKey, action): void | - | | onEdit | Callback when tab is added or removed, which is executing when set type as editable-card | (targetKey, action): void | - |
| hideAdd | Hide plus icon or not, which is effective when set type as editable-card | boolean | false | | hideAdd | Hide plus icon or not, which is effective when set type as editable-card | boolean | false |

2
components/tabs/index.zh-CN.md

@ -29,7 +29,7 @@ Ant Design 依次提供了三级选项卡,分别用于不同的场景。
| onTabClick | tab 被点击的回调 | Function | 无 | | onTabClick | tab 被点击的回调 | Function | 无 |
| tabBarExtraContent | tab bar 上额外的元素 | React.ReactNode | 无 | | tabBarExtraContent | tab bar 上额外的元素 | React.ReactNode | 无 |
| type | 页签的基本样式,可选 `line`、`card` `editable-card` 类型 | string | 'line' | | type | 页签的基本样式,可选 `line`、`card` `editable-card` 类型 | string | 'line' |
| size | 大小,提供 `default``small` 两种大小 | string | 'default' | | size | 大小,提供 `default``small` 两种大小,仅当 `type="line"` 时生效。 | string | 'default' |
| tabPosition | 页签位置,可选值有 `top` `right` `bottom` `left` | string | 'top' | | tabPosition | 页签位置,可选值有 `top` `right` `bottom` `left` | string | 'top' |
| onEdit | 新增和删除页签的回调,在 `type="editable-card"` 时有效 | (targetKey, action): void | 无 | | onEdit | 新增和删除页签的回调,在 `type="editable-card"` 时有效 | (targetKey, action): void | 无 |
| hideAdd | 是否隐藏加号图标,在 `type="editable-card"` 时有效 | boolean | false | | hideAdd | 是否隐藏加号图标,在 `type="editable-card"` 时有效 | boolean | false |

6
components/tabs/style/index.less

@ -304,7 +304,7 @@
// card style // card style
&&-card > &-bar &-nav-container { &&-card > &-bar &-nav-container {
height: 36px; height: 32px;
} }
&&-card > &-bar &-ink-bar { &&-card > &-bar &-ink-bar {
visibility: hidden; visibility: hidden;
@ -319,7 +319,7 @@
margin-right: 2px; margin-right: 2px;
} }
&&-card > &-bar &-tab { &&-card > &-bar &-tab {
padding: 7px 16px 6px; padding: 5px 16px 4px;
transition: all 0.3s @ease-in-out; transition: all 0.3s @ease-in-out;
} }
&&-card > &-bar &-tab-active { &&-card > &-bar &-tab-active {
@ -329,7 +329,7 @@
color: @primary-color; color: @primary-color;
} }
&&-card > &-bar &-tab-active { &&-card > &-bar &-tab-active {
padding-bottom: 7px; padding-bottom: 5px;
transform: translateZ(0); transform: translateZ(0);
} }
&&-card > &-bar &-nav-wrap { &&-card > &-bar &-nav-wrap {

Loading…
Cancel
Save