diff --git a/CHANGELOG.md b/CHANGELOG.md index e49fa09b5d..36c292e7ad 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,22 @@ --- +## 0.12.11 + +`2016-03-16` + +- 全新的设计文档 `语言` 部分。 +- 修复 Popconfirm `onConfirm` 和 `onCancel` 时没有触发 `onVisibleChange` 的问题。 +- TreeSelect 组件补充 `showCheckedStrategy` 属性,支持回填数据的不同展示方式。 +- 补充 Modal `align` 属性的文档。 +- 修复 Menu 弹出菜单 `z-index` 丢失的问题。 +- Progress 的默认颜色固定,不再随着主色变化。 +- 优化 Button 点击动画在 Chrome 下的效果。 +- 修复一个 Affix 的 `z-index` 太低的问题。 +- 修复 Table 树形数据的二级节点列前无法选择的问题。[#1212](https://github.com/ant-design/ant-design/issues/1212) +- 修复 Table 修改 `pageSize` 没有触发 `onChange` 的问题。[#1206](https://github.com/ant-design/ant-design/issues/1206) +- 修复 Table 指定 `rowKey` 时导致 `rowSelection.onChange` 的 `selectedRows` 参数为空的问题。 + ## 0.12.10 - 修复 0.12.9 版本 npm 包打包错误的问题。 diff --git a/LICENSE b/LICENSE index c208f57b6a..12189b627d 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT LICENSE -Copyright (c) 2015 Alipay.com, https://www.alipay.com/ +Copyright (c) 2015-present Alipay.com, https://www.alipay.com/ Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the diff --git a/components/alert/index.jsx b/components/alert/index.jsx index 566718731e..ed3637d1e8 100644 --- a/components/alert/index.jsx +++ b/components/alert/index.jsx @@ -9,7 +9,8 @@ export default React.createClass({ return { prefixCls: 'ant-alert', showIcon: false, - onClose() {} + onClose() {}, + type: 'info', }; }, getInitialState() { diff --git a/components/alert/index.md b/components/alert/index.md index 3ea71340a7..ba0e1b9c22 100644 --- a/components/alert/index.md +++ b/components/alert/index.md @@ -17,7 +17,7 @@ | 参数 | 说明 | 类型 | 默认值 | |----------- |--------------------------------------------------------- | ---------- |-------| -| type | 必选参数,指定警告提示的样式,有四种选择`success`、`info`、`warn`、`error` | String | 无 | +| type | 必选参数,指定警告提示的样式,有四种选择`success`、`info`、`warn`、`error` | String | `info` | | closable | 可选参数,默认不显示关闭按钮 | Boolean | 无 | | closeText | 可选参数,自定义关闭按钮 | React.Node | 无 | | message | 必选参数,警告提示内容 | React.Node | 无 | diff --git a/components/button/button-group.jsx b/components/button/button-group.jsx index 46829114f3..e166885054 100644 --- a/components/button/button-group.jsx +++ b/components/button/button-group.jsx @@ -24,5 +24,5 @@ export default class ButtonGroup extends React.Component { } } ButtonGroup.propTypes = { - size: React.PropTypes.string, + size: React.PropTypes.oneOf(['large', 'small']), }; diff --git a/components/button/button.jsx b/components/button/button.jsx index f139d96059..73e82e2f3e 100644 --- a/components/button/button.jsx +++ b/components/button/button.jsx @@ -2,7 +2,7 @@ import React from 'react'; import classNames from 'classnames'; import { findDOMNode } from 'react-dom'; -const rxTwoCNChar = /^[\u4e00-\u9fa5]{2,2}$/; +const rxTwoCNChar = /^[\u4e00-\u9fa5]{2}$/; const isTwoCNChar = rxTwoCNChar.test.bind(rxTwoCNChar); function isString(str) { return typeof str === 'string'; @@ -73,10 +73,10 @@ export default class Button extends React.Component { } Button.propTypes = { - type: React.PropTypes.string, - shape: React.PropTypes.string, - size: React.PropTypes.string, - htmlType: React.PropTypes.string, + type: React.PropTypes.oneOf(['primary', 'ghost', 'dashed']), + shape: React.PropTypes.oneOf(['circle', 'circle-outline']), + size: React.PropTypes.oneOf(['large', 'small']), + htmlType: React.PropTypes.oneOf(['submit', 'button', 'reset']), onClick: React.PropTypes.func, loading: React.PropTypes.bool, className: React.PropTypes.string, diff --git a/components/cascader/index.md b/components/cascader/index.md index 3d5462ecbc..1857abff10 100644 --- a/components/cascader/index.md +++ b/components/cascader/index.md @@ -36,3 +36,5 @@ | size | 输入框大小,可选 `large` `default` `small` | string | `default` | | disabled | 禁用 | boolean | false | | allowClear | 是否支持清除 | boolean | true | +| expandTrigger | 次级菜单的展开方式,可选 'click' 和 'hover' | string | 'click' | +| changeOnSelect | 当此项为 true 时,点选每级菜单选项值都会发生变化,具体见上面的演示 | boolean | false | diff --git a/components/form/index.md b/components/form/index.md index d680a6de83..7b6bebe9fb 100644 --- a/components/form/index.md +++ b/components/form/index.md @@ -85,6 +85,8 @@ CustomizedForm = Form.create({})(CustomizedForm); #### this.props.form.getFieldProps(id, options) +`getFieldProps` 返回的属性包括 `id`、`value`(或你设置的其它 `valuePropName`)、`ref`、`onChange`(或者你设置的其它 `trigger` `validateTrigger`),所以不应再设置同样的属性,以免冲突。如果对其返回值的细节有兴趣,可以 `console.log` 出来查看。 + | 参数 | 说明 | 类型 | 可选值 |默认值 | |-----------|------------------------------------------|------------|-------|--------| | options.id | 必填输入控件唯一标志 | string | | | diff --git a/components/popconfirm/demo/placement.md b/components/popconfirm/demo/placement.md index 3ce9735121..1f89c8d57e 100644 --- a/components/popconfirm/demo/placement.md +++ b/components/popconfirm/demo/placement.md @@ -2,7 +2,7 @@ - order: 1 -位置有四个方向。 +位置有十二个方向。 --- diff --git a/components/popconfirm/index.jsx b/components/popconfirm/index.jsx index fabf426ffc..c3fcc3baa2 100644 --- a/components/popconfirm/index.jsx +++ b/components/popconfirm/index.jsx @@ -73,7 +73,7 @@ export default React.createClass({ } const overlay = (
-
+
{title}
diff --git a/components/popconfirm/index.md b/components/popconfirm/index.md index 491d21135c..9cfd85810c 100644 --- a/components/popconfirm/index.md +++ b/components/popconfirm/index.md @@ -19,7 +19,7 @@ | 参数 | 说明 | 类型 | 默认值 | |-----------|------------------------------------------|---------------|--------| -| placement | 气泡框位置,可选 `top/left/right/bottom` | string | top | +| placement | 气泡框位置,可选 `top/left/right/bottom` `topLeft/topRight/bottomLeft/bottomRight` `leftTop/leftBottom/rightTop/rightBottom` | string | top | | title | 确认框的描述 | string | 无 | | onConfirm | 点击确认的回调 | function | 无 | | onCancel | 卡片内容 | function | 无 | diff --git a/components/popover/index.jsx b/components/popover/index.jsx index 730aef6c02..44aef07df2 100644 --- a/components/popover/index.jsx +++ b/components/popover/index.jsx @@ -52,7 +52,7 @@ const Popover = React.createClass({ return (
{this.props.title &&
{this.props.title}
} -
+
{this.props.overlay}
diff --git a/components/slider/index.md b/components/slider/index.md index 15c49e3f72..7a2d7b1657 100644 --- a/components/slider/index.md +++ b/components/slider/index.md @@ -16,15 +16,16 @@ | 参数 | 类型 | 默认值 |说明 | |------------|----------------|-------------|--------------| +| range | Boolean | false | 双滑块模式 | min | Number | 0 | 最小值 | max | Number | 100 | 最大值 | step | Number or null | 1 | 步长,取值必须大于 0,并且可被 (max - min) 整除。当 `marks` 不为空对象时,可以设置 `step` 为 `null`,此时 Slider 的可选值仅有 marks 标出来的部分。 -| marks | Object {Number: String} | {} | 分段标记,key 的类型必须为 `Number` 且取值在闭区间 [min, max] 内 +| marks | Object {Number: String} | {} | 刻度标记,key 的类型必须为 `Number` 且取值在闭区间 [min, max] 内 +| dots | Boolean | false | 是否只能拖拽到刻度上 | value | Number or [Number, Number]| | 设置当前取值。当 `range` 为 `false` 时,使用 `Number`,否则用 `[Number, Number]` | defaultValue | Number or [Number, Number]| 0 or [0, 0] | 设置初始取值。当 `range` 为 `false` 时,使用 `Number`,否则用 `[Number, Number]` | included | Boolean | true | `marks` 不为空对象时有效,值为 true 时表示值为包含关系,false 表示并列 | disabled | Boolean | false | 值为 `true` 时,滑块为禁用状态 -| allowCross | Boolean | true | 当 `range` 为 `true` 时,该属性可以设置是否允许两个滑块交换位置。 | onChange | Function | NOOP | 当 Slider 的值发生改变时,会触发 onChange 事件,并把改变后的值作为参数传入。 | onAfterChange | Function | NOOP | 与 `onmouseup` 触发时机一致,把当前值作为参数传入。 | tipFormatter | Function or null | IDENTITY | Slider 会把当前值传给 `tipFormatter`,并在 Tooltip 中显示 `tipFormatter` 的返回值,若为 null,则隐藏 Tooltip。 diff --git a/components/table/demo/expand-children.md b/components/table/demo/expand-children.md index 7577deb3ab..5dc9c1e529 100644 --- a/components/table/demo/expand-children.md +++ b/components/table/demo/expand-children.md @@ -4,6 +4,8 @@ 表格支持树形数据的展示,可以通过设置 `indentSize` 以控制每一层的缩进宽度。 +> 注:暂不支持父子数据递归关联选择。 + --- ````jsx @@ -77,8 +79,21 @@ const data = [{ address: '我是b', }]; +// 通过 rowSelection 对象表明需要行选择 +const rowSelection = { + onChange(selectedRowKeys, selectedRows) { + console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows); + }, + onSelect(record, selected, selectedRows) { + console.log(record, selected, selectedRows); + }, + onSelectAll(selected, selectedRows, changeRows) { + console.log(selected, selectedRows, changeRows); + } +}; + ReactDOM.render( - , +
, mountNode ); ```` diff --git a/components/table/filterDropdown.jsx b/components/table/filterDropdown.jsx index 97e2921dd7..79671bdaa2 100644 --- a/components/table/filterDropdown.jsx +++ b/components/table/filterDropdown.jsx @@ -96,6 +96,7 @@ let FilterMenu = React.createClass({ let menus = (
this.props.rowSelection.getCheckboxProps(item).defaultChecked) .map((record, rowIndex) => this.getRecordKey(record, rowIndex)); }, @@ -122,8 +123,10 @@ let AntTable = React.createClass({ this.setState({ selectedRowKeys }); } if (this.props.rowSelection && this.props.rowSelection.onChange) { - const data = this.getCurrentPageData(); - const selectedRows = data.filter(row => selectedRowKeys.indexOf(row.key) >= 0); + const data = this.getFlatCurrentPageData(); + const selectedRows = data.filter( + (row, i) => selectedRowKeys.indexOf(this.getRecordKey(row, i)) >= 0 + ); this.props.rowSelection.onChange(selectedRowKeys, selectedRows); } }, @@ -164,9 +167,7 @@ let AntTable = React.createClass({ sorter, }; this.setState(newState); - this.props.onChange.apply(this, this.prepareParamsArguments( - objectAssign({}, this.state, newState) - )); + this.props.onChange(...this.prepareParamsArguments({ ...this.state, ...newState })); }, handleFilter(column, nextFilters) { @@ -186,9 +187,7 @@ let AntTable = React.createClass({ }; this.setState(newState); this.setSelectedRowKeys([]); - this.props.onChange.apply(this, this.prepareParamsArguments( - objectAssign({}, this.state, newState) - )); + this.props.onChange(...this.prepareParamsArguments({ ...this.state, ...newState })); }, handleSelect(record, rowIndex, e) { @@ -208,7 +207,7 @@ let AntTable = React.createClass({ }); this.setSelectedRowKeys(selectedRowKeys); if (this.props.rowSelection.onSelect) { - let data = this.getCurrentPageData(); + let data = this.getFlatCurrentPageData(); let selectedRows = data.filter((row, i) => { return selectedRowKeys.indexOf(this.getRecordKey(row, i)) >= 0; }); @@ -228,7 +227,7 @@ let AntTable = React.createClass({ }); this.setSelectedRowKeys(selectedRowKeys); if (this.props.rowSelection.onSelect) { - let data = this.getCurrentPageData(); + let data = this.getFlatCurrentPageData(); let selectedRows = data.filter((row, i) => { return selectedRowKeys.indexOf(this.getRecordKey(row, i)) >= 0; }); @@ -238,7 +237,7 @@ let AntTable = React.createClass({ handleSelectAllRow(e) { const checked = e.target.checked; - const data = this.getCurrentPageData(); + const data = this.getFlatCurrentPageData(); const defaultSelection = this.state.selectionDirty ? [] : this.getDefaultSelection(); const selectedRowKeys = this.state.selectedRowKeys.concat(defaultSelection); const changableRowKeys = data.filter(item => @@ -290,9 +289,7 @@ let AntTable = React.createClass({ pagination }; this.setState(newState); - this.props.onChange.apply(this, this.prepareParamsArguments( - objectAssign({}, this.state, newState) - )); + this.props.onChange(...this.prepareParamsArguments({ ...this.state, ...newState })); }, onRadioChange(ev) { @@ -350,7 +347,7 @@ let AntTable = React.createClass({ renderRowSelection() { let columns = this.props.columns.concat(); if (this.props.rowSelection) { - let data = this.getCurrentPageData().filter((item) => { + let data = this.getFlatCurrentPageData().filter((item) => { if (this.props.rowSelection.getCheckboxProps) { return !this.props.rowSelection.getCheckboxProps(item).disabled; } @@ -471,11 +468,12 @@ let AntTable = React.createClass({ handleShowSizeChange(current, pageSize) { const pagination = this.state.pagination; pagination.onShowSizeChange(current, pageSize); - - let nextPagination = objectAssign(pagination, { - pageSize, - }); + const nextPagination = { ...pagination, pageSize, current }; this.setState({ pagination: nextPagination }); + this.props.onChange(...this.prepareParamsArguments({ + ...this.state, + pagination: nextPagination, + })); }, renderPagination() { @@ -516,8 +514,8 @@ let AntTable = React.createClass({ return this.props.columns.filter(c => this.getColumnKey(c) === myKey)[0]; }, - getCurrentPageData(dataSource) { - let data = this.getLocalData(dataSource); + getCurrentPageData() { + let data = this.getLocalData(); let current; let pageSize; let state = this.state; @@ -541,9 +539,13 @@ let AntTable = React.createClass({ return data; }, - getLocalData(dataSource) { + getFlatCurrentPageData() { + return flatArray(this.getCurrentPageData()); + }, + + getLocalData() { let state = this.state; - let data = dataSource || this.props.dataSource || []; + let data = this.props.dataSource || []; // 排序 if (state.sortOrder && state.sorter) { data = data.slice(0); diff --git a/components/table/util.js b/components/table/util.js new file mode 100644 index 0000000000..f2dfcec48a --- /dev/null +++ b/components/table/util.js @@ -0,0 +1,15 @@ +export function flatArray(data = [], childrenName = 'children') { + const result = []; + const loop = (array) => { + array.forEach(item => { + const newItem = { ...item }; + delete newItem[childrenName]; + result.push(newItem); + if (item[childrenName] && item[childrenName].length > 0) { + loop(item[childrenName]); + } + }); + }; + loop(data); + return result; +} diff --git a/components/tabs/index.md b/components/tabs/index.md index 1a0127b9f2..ace73874b0 100644 --- a/components/tabs/index.md +++ b/components/tabs/index.md @@ -30,6 +30,7 @@ Ant Design 依次提供了三级选项卡,分别用于不同的场景。 | onTabClick | tab 被点击的回调 | Function | 无 | | tabBarExtraContent | tab bar 上额外的元素 | React Node | 无 | | type | 页签的基本样式,可选 `line`、`card` `editable-card` 类型 | String | 'line' | +| size | 大小,提供 `default` 和 `small` 两种大小 | String | 'default' | | tabPosition | 页签位置,可选值有 `top` `right` `bottom` `left` | String | 'top' | | onEdit | 新增和删除页签的回调,在 `type="editable-card"` 时有效 | Function(targetKey, action) | 无 | diff --git a/components/upload/index.md b/components/upload/index.md index 6fba743b8f..a81217d52c 100644 --- a/components/upload/index.md +++ b/components/upload/index.md @@ -1,7 +1,7 @@ # Upload - category: Components -- chinese: 文件上传 +- chinese: 上传 - type: 表单 --- diff --git a/docs/react/getting-started.md b/docs/react/getting-started.md index 478f5ce6bc..562a620acf 100644 --- a/docs/react/getting-started.md +++ b/docs/react/getting-started.md @@ -129,10 +129,6 @@ Ant Design React 支持所有的现代浏览器和 IE8+。 ``` -另外,由于 babel 对 IE8 的支持不佳,你可能会遇到类似 [#28](https://github.com/ant-tool/atool-build/issues/28) 和 [#858](https://github.com/ant-design/ant-design/issues/858) 的 default 报错的问题。 - -[antd-init](http://github.com/ant-design/antd-init) 脚手架已经解决了这个问题,你也可以参照这个 [webpack 配置](https://github.com/ant-design/antd-init/blob/8c4a55d205c82a6ad87814bbf997696051713d58/boilerplate/webpack.config.js#L10-L14)。 - > 更多 IE8 下使用 React 的相关问题可以参考:https://github.com/xcatliu/react-ie8 ## 自行构建 diff --git a/docs/spec/feature.md b/docs/spec/feature.md index 748aa3a04d..155582a759 100644 --- a/docs/spec/feature.md +++ b/docs/spec/feature.md @@ -31,6 +31,16 @@ font-size: 14px; margin-top: 16px; } +@media only screen and (min-width: 320px) and (max-width: 767px) { + .features { + width: 100%; + text-align: center; + margin-bottom: 20px;; + } + .features img { + width: 80%; + } +} --- diff --git a/docs/spec/stay.md b/docs/spec/stay.md index f3c9baef63..a9a511a8db 100644 --- a/docs/spec/stay.md +++ b/docs/spec/stay.md @@ -2,7 +2,7 @@ - category: 十大原则 - order: 6 -- subtitle: Stay in the Page +- subtitle: Stay on the Page 能在这个页面解决的问题,就不要去其它页面解决,因为任何页面刷新和跳转都会引起变化盲视(Change Blindness),导致用户心流(Flow)被打断。频繁的页面刷新和跳转,就像在看戏时,演员说完一行台词就安排一次谢幕一样。 diff --git a/package.json b/package.json index 99eafb262c..4519db81f5 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "antd", - "version": "0.12.11-beta", + "version": "0.12.11", "title": "Ant Design", "description": "一个 UI 设计语言", "homepage": "http://ant.design/", @@ -58,7 +58,7 @@ "rc-steps": "~1.4.1", "rc-switch": "~1.3.2", "rc-table": "~3.11.1", - "rc-tabs": "~5.7.0", + "rc-tabs": "~5.8.0", "rc-time-picker": "~1.1.0", "rc-tooltip": "~3.3.1", "rc-tree": "~1.1.0", @@ -98,8 +98,8 @@ "eslint-plugin-react": "^4.0.0", "eslint-tinker": "^0.3.1", "extract-text-webpack-plugin": "^1.0.1", - "gh-pages": "^0.9.0", "gsap": "^1.18.2", + "gh-pages": "^0.11.0", "history": "^1.17.0", "instantclick": "^3.1.0", "jest-cli": "~0.8.0", diff --git a/style/components/button.less b/style/components/button.less index db2626fda5..43a1e7d3c8 100644 --- a/style/components/button.less +++ b/style/components/button.less @@ -46,10 +46,6 @@ .btn-circle(@btn-prefix-cls); } - &-circle-outline { - .btn-circle-outline; - } - &:after { font-family: anticon; content: "\e6a1"; diff --git a/style/components/popover.less b/style/components/popover.less index de6f6c12dc..cf24939d73 100644 --- a/style/components/popover.less +++ b/style/components/popover.less @@ -93,7 +93,7 @@ color: #666; } - &-content { + &-inner-content { padding: 8px 16px; color: @text-color; } @@ -143,9 +143,9 @@ content: ""; } - &-placement-top > &-arrow, - &-placement-topLeft > &-arrow, - &-placement-topRight > &-arrow { + &-placement-top &-arrow, + &-placement-topLeft &-arrow, + &-placement-topRight &-arrow { border-bottom-width: 0; border-top-color: @popover-arrow-outer-color; bottom: 0; @@ -157,20 +157,20 @@ border-top-color: @popover-arrow-color; } } - &-placement-top > &-arrow { + &-placement-top &-arrow { left: 50%; margin-left: -@popover-arrow-outer-width; } - &-placement-topLeft > &-arrow { + &-placement-topLeft &-arrow { left: 16px; } - &-placement-topRight > &-arrow { + &-placement-topRight &-arrow { right: 16px; } - &-placement-right > &-arrow, - &-placement-rightTop > &-arrow, - &-placement-rightBottom > &-arrow { + &-placement-right &-arrow, + &-placement-rightTop &-arrow, + &-placement-rightBottom &-arrow { left: 0; border-left-width: 0; border-right-color: @popover-arrow-outer-color; @@ -182,20 +182,20 @@ border-right-color: @popover-arrow-color; } } - &-placement-right > &-arrow { + &-placement-right &-arrow { top: 50%; margin-top: -@popover-arrow-outer-width; } - &-placement-rightTop > &-arrow { + &-placement-rightTop &-arrow { top: 12px; } - &-placement-rightBottom > &-arrow { + &-placement-rightBottom &-arrow { bottom: 12px; } - &-placement-bottom > &-arrow, - &-placement-bottomLeft > &-arrow, - &-placement-bottomRight > &-arrow { + &-placement-bottom &-arrow, + &-placement-bottomLeft &-arrow, + &-placement-bottomRight &-arrow { border-top-width: 0; border-bottom-color: @popover-arrow-outer-color; top: 0; @@ -207,20 +207,20 @@ border-bottom-color: @popover-arrow-color; } } - &-placement-bottom > &-arrow { + &-placement-bottom &-arrow { left: 50%; margin-left: -@popover-arrow-outer-width; } - &-placement-bottomLeft > &-arrow { + &-placement-bottomLeft &-arrow { left: 16px; } - &-placement-bottomRight > &-arrow { + &-placement-bottomRight &-arrow { right: 16px; } - &-placement-left > &-arrow, - &-placement-leftTop > &-arrow, - &-placement-leftBottom > &-arrow { + &-placement-left &-arrow, + &-placement-leftTop &-arrow, + &-placement-leftBottom &-arrow { right: 0; border-right-width: 0; border-left-color: @popover-arrow-outer-color; @@ -232,14 +232,14 @@ bottom: -@popover-arrow-width; } } - &-placement-left > &-arrow { + &-placement-left &-arrow { top: 50%; margin-top: -@popover-arrow-outer-width; } - &-placement-leftTop > &-arrow { + &-placement-leftTop &-arrow { top: 12px; } - &-placement-leftBottom > &-arrow { + &-placement-leftBottom &-arrow { bottom: 12px; } } diff --git a/style/components/table.less b/style/components/table.less index 2b8a5d947f..9369b54eb3 100644 --- a/style/components/table.less +++ b/style/components/table.less @@ -82,6 +82,7 @@ th, td { padding: 16px 8px; + word-break: break-all; } th.@{table-prefix-cls}-selection-column, @@ -193,7 +194,7 @@ border-bottom: 1px solid @border-color-split; } - tr:last-child { + tbody tr:last-child { th, td { border-bottom: 0; @@ -332,11 +333,6 @@ } } - // Hide selection component in children data - &[class*="@{table-prefix-cls}-row-level-"] .@{table-prefix-cls}-selection-column > span { - display: none; - } - &[class*="@{table-prefix-cls}-row-level-0"] .@{table-prefix-cls}-selection-column > span { display: inline-block; } diff --git a/style/components/tabs.less b/style/components/tabs.less index b4284b2833..f47ce3481d 100644 --- a/style/components/tabs.less +++ b/style/components/tabs.less @@ -3,13 +3,16 @@ @effect-duration: .3s; .@{tab-prefix-cls} { - outline: none; box-sizing: border-box; position: relative; overflow: hidden; .clearfix; color: @text-color; + &-bar { + outline: none; + } + &-ink-bar { z-index: 1; position: absolute; @@ -32,7 +35,7 @@ } } - &-tabs-bar { + &-bar { border-bottom: 1px solid @border-color-base; margin-bottom: 16px; } @@ -292,7 +295,7 @@ width: auto; } - .@{tab-prefix-cls}-tabs-bar { + .@{tab-prefix-cls}-bar { border-bottom: 0; } @@ -329,7 +332,7 @@ } &-vertical&-left { - .@{tab-prefix-cls}-tabs-bar { + .@{tab-prefix-cls}-bar { float: left; border-right: 1px solid @border-color-split; margin-right: -1px; @@ -356,7 +359,7 @@ } &-vertical&-right { - .@{tab-prefix-cls}-tabs-bar { + .@{tab-prefix-cls}-bar { float: right; border-left: 1px solid @border-color-split; margin-left: -1px; @@ -377,7 +380,7 @@ } } - &-bottom &-tabs-bar { + &-bottom &-bar { margin-bottom: 0; margin-top: 16px; } diff --git a/style/mixins/button.less b/style/mixins/button.less index e3456baba6..cc9b90c035 100644 --- a/style/mixins/button.less +++ b/style/mixins/button.less @@ -192,50 +192,6 @@ } } -// circle button with stroke border -.btn-circle-outline() { - position: relative; - - &:not([disabled]):before { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - display: inline-block; - .opacity(0); - border-radius: 50% 50%; - content: " "; - .scale(0, 0); - .transition(all .3s @ease-in-out); - z-index: 0; - background-color: @primary-color; - } - - &:not([disabled]):hover, - &:not([disabled]):focus, - &:not([disabled]):active, - &:not([disabled]).active { - > .@{iconfont-css-prefix} { - color: @btn-primary-color; - position: relative; - } - } - - &:not([disabled]):hover:before, - &:not([disabled]):focus:before, - &:not([disabled]):active:before, - &:not([