This commit is contained in:
afc163
2015-09-16 20:58:37 +08:00
parent 7cc10fd838
commit 877fcda241
85 changed files with 3449 additions and 971 deletions
+3 -3
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Affix 固钉 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Affix 固钉 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Alert 警告提示 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Alert 警告提示 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Badge 徽标数 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Badge 徽标数 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Breadcrumb 面包屑 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Breadcrumb 面包屑 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Button 按钮 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Button 按钮 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Carousel 走马灯 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Carousel 走马灯 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Checkbox 多选框 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Checkbox 多选框 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Collapse 折叠面板 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Collapse 折叠面板 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Datepicker 日期选择框 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Datepicker 日期选择框 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Dropdown 下拉菜单 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Dropdown 下拉菜单 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ EnterAnimation 进场动画 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ EnterAnimation 进场动画 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Form 表单 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Form 表单 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Iconfont 字体图标 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Iconfont 字体图标 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ InputNumber 数字输入框 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ InputNumber 数字输入框 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Layout 布局 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Layout 布局 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Menu 导航菜单 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Menu 导航菜单 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Message 全局提示 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Message 全局提示 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Modal 对话框 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Modal 对话框 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Notification 通知提醒框 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Notification 通知提醒框 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Pagination 分页 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Pagination 分页 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Popconfirm 气泡确认框 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Popconfirm 气泡确认框 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Popover 气泡卡片 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Popover 气泡卡片 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Progress 进度条 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Progress 进度条 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Radio 单选框 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Radio 单选框 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+4
View File
@@ -33,11 +33,13 @@ var Test = React.createClass({
});
},
render: function render() {
// filterOption 需要设置为 false,数据是动态设置的
return React.createElement(
Select,
{ combobox: true,
style: { width: 200 },
onChange: this.handleChange,
filterOption: false,
searchPlaceholder: '请输入账户名' },
this.state.options
);
@@ -68,9 +70,11 @@ React.render(React.createElement(Test, null), document.getElementById('component
});
},
render() {
<span class="comment">// filterOption 需要设置为 false,数据是动态设置的</span>
<span class="keyword">return</span> <span class="xml"><span class="tag">&lt;<span class="title">Select</span> <span class="attribute">combobox</span>
<span class="attribute">style</span>=<span class="value">{{width:200}}</span>
<span class="attribute">onChange</span>=<span class="value">{this.handleChange}</span>
<span class="attribute">filterOption</span>=<span class="value">{false}</span>
<span class="attribute">searchPlaceholder</span>=<span class="value">"请输入账户名"</span>&gt;</span>
{this.state.options}
<span class="tag">&lt;/<span class="title">Select</span>&gt;</span>;</span>
+7 -3
View File
@@ -13,7 +13,7 @@ Select 选择器 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Select 选择器 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -1171,11 +1171,13 @@ var Test = React.createClass({
});
},
render: function render() {
// filterOption 需要设置为 false,数据是动态设置的
return React.createElement(
Select,
{ combobox: true,
style: { width: 200 },
onChange: this.handleChange,
filterOption: false,
searchPlaceholder: '请输入账户名' },
this.state.options
);
@@ -1206,9 +1208,11 @@ React.render(React.createElement(Test, null), document.getElementById('component
});
},
render() {
<span class="comment">// filterOption 需要设置为 false,数据是动态设置的</span>
<span class="keyword">return</span> <span class="xml"><span class="tag">&lt;<span class="title">Select</span> <span class="attribute">combobox</span>
<span class="attribute">style</span>=<span class="value">{{width:200}}</span>
<span class="attribute">onChange</span>=<span class="value">{this.handleChange}</span>
<span class="attribute">filterOption</span>=<span class="value">{false}</span>
<span class="attribute">searchPlaceholder</span>=<span class="value">"请输入账户名"</span>&gt;</span>
{this.state.options}
<span class="tag">&lt;/<span class="title">Select</span>&gt;</span>;</span>
+3 -3
View File
@@ -13,7 +13,7 @@ Slider 滑动输入条 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Slider 滑动输入条 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -18,9 +18,9 @@ React.render(React.createElement(
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-icon'</span>);
React.render(<span class="xml"><span class="tag">&lt;<span class="title">Steps</span>&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'finish'</span> <span class="attribute">title</span>=<span class="value">'步骤1'</span> <span class="attribute">icon</span>=<span class="value">'cloud'</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'process'</span> <span class="attribute">title</span>=<span class="value">'步骤2'</span> <span class="attribute">icon</span>=<span class="value">'apple'</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'wait'</span> <span class="attribute">title</span>=<span class="value">'步骤3'</span> <span class="attribute">icon</span>=<span class="value">'github'</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'finish'</span> <span class="attribute">title</span>=<span class="value">'步骤1'</span> <span class="attribute">icon</span>=<span class="value">'cloud'</span> /&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'process'</span> <span class="attribute">title</span>=<span class="value">'步骤2'</span> <span class="attribute">icon</span>=<span class="value">'apple'</span> /&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'wait'</span> <span class="attribute">title</span>=<span class="value">'步骤3'</span> <span class="attribute">icon</span>=<span class="value">'github'</span> /&gt;</span>
<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
+5 -20
View File
@@ -8,63 +8,48 @@ var Step = Steps.Step;
var container = document.getElementById('components-steps-demo-simple');
var steps = [{
status: 'finish',
title: '已完成',
description: '这里是多信息的描述啊'
}, {
status: 'process',
title: '进行中',
description: '这里是多信息的耶哦耶哦哦耶哦耶'
}, {
status: 'wait',
title: '又一个待运行',
description: '描述啊描述啊'
}, {
status: 'wait',
title: '待运行',
description: '这里是多信息的描述啊'
}].map(function (s, i) {
return React.createElement(Step, {
key: i,
status: s.status,
title: s.title,
description: s.description });
return React.createElement(Step, { key: i, title: s.title, description: s.description });
});
React.render(React.createElement(
Steps,
null,
{ current: 1 },
steps
), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-simple'</span>);
<span class="keyword">var</span> steps = [{
status: <span class="string">'finish'</span>,
title: <span class="string">'已完成'</span>,
description: <span class="string">'这里是多信息的描述啊'</span>
}, {
status: <span class="string">'process'</span>,
title: <span class="string">'进行中'</span>,
description: <span class="string">'这里是多信息的耶哦耶哦哦耶哦耶'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'又一个待运行'</span>,
description: <span class="string">'描述啊描述啊'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'待运行'</span>,
description: <span class="string">'这里是多信息的描述啊'</span>
}].map(<span class="function"><span class="keyword">function</span><span class="params">(s, i)</span> {</span>
<span class="keyword">return</span> (<span class="xml"><span class="tag">&lt;<span class="title">Step
</span> <span class="attribute">key</span>=<span class="value">{i}</span>
<span class="attribute">status</span>=<span class="value">{s.status}</span>
<span class="attribute">title</span>=<span class="value">{s.title}</span>
<span class="attribute">description</span>=<span class="value">{s.description}</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>
);
});
React.render(<span class="tag">&lt;<span class="title">Steps</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">current</span>=<span class="value">{1}</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
+6 -11
View File
@@ -20,15 +20,12 @@ var steps = [{
status: 'wait',
title: '待运行'
}].map(function (s, i) {
return React.createElement(Step, {
key: i,
status: s.status,
title: s.title });
return React.createElement(Step, { key: i, title: s.title, description: s.description });
});
React.render(React.createElement(
Steps,
{ size: 'small' },
{ size: 'small', current: 1 },
steps
), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
@@ -47,14 +44,12 @@ React.render(React.createElement(
status: <span class="string">'wait'</span>,
title: <span class="string">'待运行'</span>
}].map(<span class="function"><span class="keyword">function</span><span class="params">(s, i)</span> {</span>
<span class="keyword">return</span> (<span class="xml"><span class="tag">&lt;<span class="title">Step
</span> <span class="attribute">key</span>=<span class="value">{i}</span>
<span class="attribute">status</span>=<span class="value">{s.status}</span>
<span class="attribute">title</span>=<span class="value">{s.title}</span>&gt;</span>
<span class="tag">&lt;/<span class="title">Step</span>&gt;</span>);
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>
);
});
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">size</span>=<span class="value">"small"</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">size</span>=<span class="value">"small"</span> <span class="attribute">current</span>=<span class="value">{1}</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
+69
View File
@@ -0,0 +1,69 @@
<div class="code-box" id="demo-status">
<div class="code-box-demo">
<div id="components-steps-demo-status"></div>
<script>(function(){'use strict';
var Steps = antd.Steps;
var Step = Steps.Step;
var container = document.getElementById('components-steps-demo-status');
var steps = [{
status: 'finish',
title: '已完成',
description: '这里是多信息的描述啊'
}, {
status: 'process',
title: '进行中',
description: '这里是多信息的耶哦耶哦哦耶哦耶'
}, {
status: 'wait',
title: '又一个待运行',
description: '描述啊描述啊'
}, {
status: 'wait',
title: '待运行',
description: '这里是多信息的描述啊'
}].map(function (s, i) {
return React.createElement(Step, { key: i, title: s.title, status: s.status, description: s.description });
});
React.render(React.createElement(
Steps,
null,
steps
), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-status'</span>);
<span class="keyword">var</span> steps = [{
status: <span class="string">'finish'</span>,
title: <span class="string">'已完成'</span>,
description: <span class="string">'这里是多信息的描述啊'</span>
}, {
status: <span class="string">'process'</span>,
title: <span class="string">'进行中'</span>,
description: <span class="string">'这里是多信息的耶哦耶哦哦耶哦耶'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'又一个待运行'</span>,
description: <span class="string">'描述啊描述啊'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'待运行'</span>,
description: <span class="string">'这里是多信息的描述啊'</span>
}].map(<span class="function"><span class="keyword">function</span><span class="params">(s, i)</span> {</span>
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">status</span>=<span class="value">{s.status}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>
);
});
React.render(<span class="tag">&lt;<span class="title">Steps</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
<a href="#demo-status">自定义状态</a>
</div>
<p>可以使用 <code>status</code> 定义每个步骤的状态。</p>
<span class="collapse anticon anticon-circle-o-right" unselectable="none" style="-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;"></span>
</div>
</div>
+43 -61
View File
@@ -1,35 +1,31 @@
<div class="code-box" id="demo-step-next">
<div class="code-box-demo">
<div id="components-steps-demo-step-next"></div>
<style type="text/css">form.my-step-form > div {
<style type="text/css">#components-steps-demo-step-next > div > div {
margin-bottom: 30px;
}</style><div class="highlight"><pre><code class="css"><span class="tag">form</span><span class="class">.my-step-form</span> &gt; <span class="tag">div</span> <span class="rules">{
}</style><div class="highlight"><pre><code class="css"><span class="id">#components-steps-demo-step-next</span> &gt; <span class="tag">div</span> &gt; <span class="tag">div</span> <span class="rules">{
<span class="rule"><span class="attribute">margin-bottom</span>:<span class="value"> <span class="number">30</span>px</span></span>;
<span class="rule">}</span></span></code></pre></div><script>(function(){'use strict';
var Steps = antd.Steps;
var Step = Steps.Step;
var container = document.getElementById('components-steps-demo-step-next');
var steps = (function generateRandomSteps() {
var n = Math.floor(Math.random() * 3) + 3;
var arr = [];
for (var i = 0; i < n; i++) {
arr.push({
title: '步骤' + (i + 1)
});
}
return arr;
})();
var array = Array.apply(null, Array(Math.floor(Math.random() * 3) + 3));
var steps = array.map(function (item, i) {
return {
title: '步骤' + (i + 1)
};
});
var MyForm = React.createClass({
displayName: 'MyForm',
var App = React.createClass({
displayName: 'App',
getInitialState: function getInitialState() {
return {
currentStep: Math.floor(Math.random() * steps.length)
};
},
nextStep: function nextStep() {
next: function next() {
var s = this.state.currentStep + 1;
if (s === steps.length) {
s = 0;
@@ -41,36 +37,28 @@ var MyForm = React.createClass({
render: function render() {
var cs = this.state.currentStep;
return React.createElement(
'form',
{ className: 'my-step-form' },
'div',
null,
React.createElement(
'div',
null,
'当前正在执行第',
'当前正在执行第 ',
cs + 1,
'步'
' 步'
),
React.createElement(
'div',
{ className: 'my-step-container' },
React.createElement(
Steps,
null,
steps.map(function (s, i) {
return React.createElement(Steps.Step, {
key: i,
status: cs === i ? 'process' : cs > i ? 'finish' : 'wait',
title: s.title
});
})
)
Steps,
{ current: cs },
steps.map(function (s, i) {
return React.createElement(Step, { key: i, title: s.title, description: s.description });
})
),
React.createElement(
'div',
null,
React.createElement(
'span',
{ className: 'ant-btn', onClick: this.nextStep },
'button',
{ className: 'ant-btn', onClick: this.next },
'下一步'
)
)
@@ -78,27 +66,23 @@ var MyForm = React.createClass({
}
});
React.render(React.createElement(MyForm, null), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
React.render(React.createElement(App, null), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-step-next'</span>);
<span class="keyword">var</span> steps = (<span class="function"><span class="keyword">function</span> <span class="title">generateRandomSteps</span><span class="params">()</span> {</span>
<span class="keyword">var</span> n = Math.floor(Math.random() * <span class="number">3</span>) + <span class="number">3</span>;
<span class="keyword">var</span> arr = [];
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="number">0</span>; i &lt; n; i++ ) {
arr.push({
title: <span class="string">'步骤'</span> + (i+<span class="number">1</span>)
});
}
<span class="keyword">return</span> arr;
})();
<span class="keyword">var</span> array = Array.apply(<span class="literal">null</span>, Array(Math.floor(Math.random() * <span class="number">3</span>) + <span class="number">3</span>));
<span class="keyword">var</span> steps = array.map(<span class="function"><span class="keyword">function</span><span class="params">(item, i)</span> {</span>
<span class="keyword">return</span> {
title: <span class="string">'步骤'</span> + (i + <span class="number">1</span>)
};
});
<span class="keyword">var</span> MyForm = React.createClass({
<span class="keyword">var</span> App = React.createClass({
getInitialState() {
<span class="keyword">return</span> {
currentStep: Math.floor(Math.random() * steps.length)
}
},
nextStep() {
next() {
<span class="keyword">var</span> s = <span class="keyword">this</span>.state.currentStep + <span class="number">1</span>;
<span class="keyword">if</span> (s === steps.length) {
s = <span class="number">0</span>;
@@ -109,23 +93,21 @@ React.render(React.createElement(MyForm, null), container);})()</script><div cla
},
render() {
<span class="keyword">var</span> cs = <span class="keyword">this</span>.state.currentStep;
<span class="keyword">return</span> (<span class="xml"><span class="tag">&lt;<span class="title">form</span> <span class="attribute">className</span>=<span class="value">'my-step-form'</span>&gt;</span>
<span class="tag">&lt;<span class="title">div</span>&gt;</span>当前正在执行第{cs + 1}步<span class="tag">&lt;/<span class="title">div</span>&gt;</span>
<span class="tag">&lt;<span class="title">div</span> <span class="attribute">className</span>=<span class="value">'my-step-container'</span>&gt;</span><span class="tag">&lt;<span class="title">Steps</span>&gt;</span>
{steps.map(function(s, i) {
return <span class="tag">&lt;<span class="title">Steps.Step
</span> <span class="attribute">key</span>=<span class="value">{i}</span>
<span class="attribute">status</span>=<span class="value">{cs</span> =<span class="value">==</span> <span class="attribute">i</span> ? '<span class="attribute">process</span>' <span class="attribute">:</span> (<span class="attribute">cs</span> &gt;</span> i ? 'finish' : 'wait')}
title={s.title}
&gt;<span class="tag">&lt;/<span class="title">Steps.Step</span>&gt;</span>
})}
<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span><span class="tag">&lt;/<span class="title">div</span>&gt;</span>
<span class="tag">&lt;<span class="title">div</span>&gt;</span><span class="tag">&lt;<span class="title">span</span> <span class="attribute">className</span>=<span class="value">'ant-btn'</span> <span class="attribute">onClick</span>=<span class="value">{this.nextStep}</span>&gt;</span>下一步<span class="tag">&lt;/<span class="title">span</span>&gt;</span><span class="tag">&lt;/<span class="title">div</span>&gt;</span>
<span class="tag">&lt;/<span class="title">form</span>&gt;</span>)
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">div</span>&gt;</span>
<span class="tag">&lt;<span class="title">div</span>&gt;</span>当前正在执行第 {cs + 1} 步<span class="tag">&lt;/<span class="title">div</span>&gt;</span>
<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">current</span>=<span class="value">{cs}</span>&gt;</span>
{steps.map((s, i) =&gt; <span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>)}
<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>
<span class="tag">&lt;<span class="title">div</span>&gt;</span>
<span class="tag">&lt;<span class="title">button</span> <span class="attribute">className</span>=<span class="value">'ant-btn'</span> <span class="attribute">onClick</span>=<span class="value">{this.next}</span>&gt;</span>下一步<span class="tag">&lt;/<span class="title">button</span>&gt;</span>
<span class="tag">&lt;/<span class="title">div</span>&gt;</span>
<span class="tag">&lt;/<span class="title">div</span>&gt;</span>
);
}
});
React.render(<span class="tag">&lt;<span class="title">MyForm</span>&gt;</span><span class="tag">&lt;/<span class="title">MyForm</span>&gt;</span>, container);</span></code></pre></div>
React.render(<span class="tag">&lt;<span class="title">App</span> /&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
+5 -18
View File
@@ -8,55 +8,42 @@ var Step = Steps.Step;
var container = document.getElementById('components-steps-demo-vertical-small');
var steps = [{
status: 'finish',
title: '已完成',
description: '这里是信息的描述'
}, {
status: 'process',
title: '进行中',
description: '这里是信息的描述'
}, {
status: 'wait',
title: '待运行',
description: '这里是信息的描述'
}].map(function (s, i) {
return React.createElement(Step, {
key: i,
status: s.status,
title: s.title,
description: s.description });
return React.createElement(Step, { key: i, title: s.title, description: s.description });
});
React.render(React.createElement(
Steps,
{ size: 'small', direction: 'vertical' },
{ size: 'small', direction: 'vertical', current: 1 },
steps
), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-vertical-small'</span>);
<span class="keyword">var</span> steps = [{
status: <span class="string">'finish'</span>,
title: <span class="string">'已完成'</span>,
description: <span class="string">'这里是信息的描述'</span>
}, {
status: <span class="string">'process'</span>,
title: <span class="string">'进行中'</span>,
description: <span class="string">'这里是信息的描述'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'待运行'</span>,
description: <span class="string">'这里是信息的描述'</span>
}].map(<span class="function"><span class="keyword">function</span><span class="params">(s, i)</span> {</span>
<span class="keyword">return</span> (<span class="xml"><span class="tag">&lt;<span class="title">Step
</span> <span class="attribute">key</span>=<span class="value">{i}</span>
<span class="attribute">status</span>=<span class="value">{s.status}</span>
<span class="attribute">title</span>=<span class="value">{s.title}</span>
<span class="attribute">description</span>=<span class="value">{s.description}</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>
);
});
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">size</span>=<span class="value">'small'</span> <span class="attribute">direction</span>=<span class="value">'vertical'</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">size</span>=<span class="value">'small'</span> <span class="attribute">direction</span>=<span class="value">'vertical'</span> <span class="attribute">current</span>=<span class="value">{1}</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
+5 -20
View File
@@ -8,63 +8,48 @@ var Step = Steps.Step;
var container = document.getElementById('components-steps-demo-vertical');
var steps = [{
status: 'finish',
title: '已完成',
description: '这里是信息的描述'
}, {
status: 'process',
title: '进行中',
description: '这里是信息的描述'
}, {
status: 'wait',
title: '待运行',
description: '这里是信息的描述'
}, {
status: 'wait',
title: '又一个待运行',
description: '这里是信息的描述'
}].map(function (s, i) {
return React.createElement(Step, {
key: i,
status: s.status,
title: s.title,
description: s.description });
return React.createElement(Step, { key: i, title: s.title, description: s.description });
});
React.render(React.createElement(
Steps,
{ direction: 'vertical' },
{ direction: 'vertical', current: 1 },
steps
), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-vertical'</span>);
<span class="keyword">var</span> steps = [{
status: <span class="string">'finish'</span>,
title: <span class="string">'已完成'</span>,
description: <span class="string">'这里是信息的描述'</span>
}, {
status: <span class="string">'process'</span>,
title: <span class="string">'进行中'</span>,
description: <span class="string">'这里是信息的描述'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'待运行'</span>,
description: <span class="string">'这里是信息的描述'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'又一个待运行'</span>,
description: <span class="string">'这里是信息的描述'</span>
}].map(<span class="function"><span class="keyword">function</span><span class="params">(s, i)</span> {</span>
<span class="keyword">return</span> (<span class="xml"><span class="tag">&lt;<span class="title">Step
</span> <span class="attribute">key</span>=<span class="value">{i}</span>
<span class="attribute">status</span>=<span class="value">{s.status}</span>
<span class="attribute">title</span>=<span class="value">{s.title}</span>
<span class="attribute">description</span>=<span class="value">{s.description}</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>
);
});
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">direction</span>=<span class="value">'vertical'</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">direction</span>=<span class="value">'vertical'</span> <span class="attribute">current</span>=<span class="value">{1}</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
+147 -137
View File
@@ -13,7 +13,7 @@ Steps 步骤条 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Steps 步骤条 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -566,6 +566,13 @@ Steps 步骤条 - Ant Design
</thead>
<tbody>
<tr>
<td>current</td>
<td>可选参数,指定当前处理正在执行状态的步骤,从0开始记数。在子Step元素中,可以通过status属性覆盖状态。</td>
<td>number</td>
<td></td>
<td>0</td>
</tr>
<tr>
<td>size</td>
<td>可选参数,指定大小(目前只支持普通和迷你两种大小)。</td>
<td>string</td>
@@ -602,10 +609,11 @@ Steps 步骤条 - Ant Design
<tbody>
<tr>
<td>status</td>
<td>必要参数,指定状态。</td>
<td>可选参数,指定状态。当不配置该属性时,会使用父Steps元素的current来自动指定状态。</td>
<td>string</td>
<td>wait, process, finish</td>
<td></td>
<td>wait</td>
</tr>
<tr>
<td>title</td>
@@ -647,63 +655,48 @@ var Step = Steps.Step;
var container = document.getElementById('components-steps-demo-simple');
var steps = [{
status: 'finish',
title: '已完成',
description: '这里是多信息的描述啊'
}, {
status: 'process',
title: '进行中',
description: '这里是多信息的耶哦耶哦哦耶哦耶'
}, {
status: 'wait',
title: '又一个待运行',
description: '描述啊描述啊'
}, {
status: 'wait',
title: '待运行',
description: '这里是多信息的描述啊'
}].map(function (s, i) {
return React.createElement(Step, {
key: i,
status: s.status,
title: s.title,
description: s.description });
return React.createElement(Step, { key: i, title: s.title, description: s.description });
});
React.render(React.createElement(
Steps,
null,
{ current: 1 },
steps
), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-simple'</span>);
<span class="keyword">var</span> steps = [{
status: <span class="string">'finish'</span>,
title: <span class="string">'已完成'</span>,
description: <span class="string">'这里是多信息的描述啊'</span>
}, {
status: <span class="string">'process'</span>,
title: <span class="string">'进行中'</span>,
description: <span class="string">'这里是多信息的耶哦耶哦哦耶哦耶'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'又一个待运行'</span>,
description: <span class="string">'描述啊描述啊'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'待运行'</span>,
description: <span class="string">'这里是多信息的描述啊'</span>
}].map(<span class="function"><span class="keyword">function</span><span class="params">(s, i)</span> {</span>
<span class="keyword">return</span> (<span class="xml"><span class="tag">&lt;<span class="title">Step
</span> <span class="attribute">key</span>=<span class="value">{i}</span>
<span class="attribute">status</span>=<span class="value">{s.status}</span>
<span class="attribute">title</span>=<span class="value">{s.title}</span>
<span class="attribute">description</span>=<span class="value">{s.description}</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>
);
});
React.render(<span class="tag">&lt;<span class="title">Steps</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">current</span>=<span class="value">{1}</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
@@ -734,15 +727,12 @@ var steps = [{
status: 'wait',
title: '待运行'
}].map(function (s, i) {
return React.createElement(Step, {
key: i,
status: s.status,
title: s.title });
return React.createElement(Step, { key: i, title: s.title, description: s.description });
});
React.render(React.createElement(
Steps,
{ size: 'small' },
{ size: 'small', current: 1 },
steps
), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
@@ -761,14 +751,12 @@ React.render(React.createElement(
status: <span class="string">'wait'</span>,
title: <span class="string">'待运行'</span>
}].map(<span class="function"><span class="keyword">function</span><span class="params">(s, i)</span> {</span>
<span class="keyword">return</span> (<span class="xml"><span class="tag">&lt;<span class="title">Step
</span> <span class="attribute">key</span>=<span class="value">{i}</span>
<span class="attribute">status</span>=<span class="value">{s.status}</span>
<span class="attribute">title</span>=<span class="value">{s.title}</span>&gt;</span>
<span class="tag">&lt;/<span class="title">Step</span>&gt;</span>);
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>
);
});
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">size</span>=<span class="value">"small"</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">size</span>=<span class="value">"small"</span> <span class="attribute">current</span>=<span class="value">{1}</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
@@ -797,9 +785,9 @@ React.render(React.createElement(
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-icon'</span>);
React.render(<span class="xml"><span class="tag">&lt;<span class="title">Steps</span>&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'finish'</span> <span class="attribute">title</span>=<span class="value">'步骤1'</span> <span class="attribute">icon</span>=<span class="value">'cloud'</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'process'</span> <span class="attribute">title</span>=<span class="value">'步骤2'</span> <span class="attribute">icon</span>=<span class="value">'apple'</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'wait'</span> <span class="attribute">title</span>=<span class="value">'步骤3'</span> <span class="attribute">icon</span>=<span class="value">'github'</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'finish'</span> <span class="attribute">title</span>=<span class="value">'步骤1'</span> <span class="attribute">icon</span>=<span class="value">'cloud'</span> /&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'process'</span> <span class="attribute">title</span>=<span class="value">'步骤2'</span> <span class="attribute">icon</span>=<span class="value">'apple'</span> /&gt;</span>
<span class="tag">&lt;<span class="title">Step</span> <span class="attribute">status</span>=<span class="value">'wait'</span> <span class="attribute">title</span>=<span class="value">'步骤3'</span> <span class="attribute">icon</span>=<span class="value">'github'</span> /&gt;</span>
<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
@@ -812,35 +800,31 @@ React.render(<span class="xml"><span class="tag">&lt;<span class="title">Steps</
</div><div class="code-box" id="demo-step-next">
<div class="code-box-demo">
<div id="components-steps-demo-step-next"></div>
<style type="text/css">form.my-step-form > div {
<style type="text/css">#components-steps-demo-step-next > div > div {
margin-bottom: 30px;
}</style><div class="highlight"><pre><code class="css"><span class="tag">form</span><span class="class">.my-step-form</span> &gt; <span class="tag">div</span> <span class="rules">{
}</style><div class="highlight"><pre><code class="css"><span class="id">#components-steps-demo-step-next</span> &gt; <span class="tag">div</span> &gt; <span class="tag">div</span> <span class="rules">{
<span class="rule"><span class="attribute">margin-bottom</span>:<span class="value"> <span class="number">30</span>px</span></span>;
<span class="rule">}</span></span></code></pre></div><script>(function(){'use strict';
var Steps = antd.Steps;
var Step = Steps.Step;
var container = document.getElementById('components-steps-demo-step-next');
var steps = (function generateRandomSteps() {
var n = Math.floor(Math.random() * 3) + 3;
var arr = [];
for (var i = 0; i < n; i++) {
arr.push({
title: '步骤' + (i + 1)
});
}
return arr;
})();
var array = Array.apply(null, Array(Math.floor(Math.random() * 3) + 3));
var steps = array.map(function (item, i) {
return {
title: '步骤' + (i + 1)
};
});
var MyForm = React.createClass({
displayName: 'MyForm',
var App = React.createClass({
displayName: 'App',
getInitialState: function getInitialState() {
return {
currentStep: Math.floor(Math.random() * steps.length)
};
},
nextStep: function nextStep() {
next: function next() {
var s = this.state.currentStep + 1;
if (s === steps.length) {
s = 0;
@@ -852,36 +836,28 @@ var MyForm = React.createClass({
render: function render() {
var cs = this.state.currentStep;
return React.createElement(
'form',
{ className: 'my-step-form' },
'div',
null,
React.createElement(
'div',
null,
'当前正在执行第',
'当前正在执行第 ',
cs + 1,
'步'
' 步'
),
React.createElement(
'div',
{ className: 'my-step-container' },
React.createElement(
Steps,
null,
steps.map(function (s, i) {
return React.createElement(Steps.Step, {
key: i,
status: cs === i ? 'process' : cs > i ? 'finish' : 'wait',
title: s.title
});
})
)
Steps,
{ current: cs },
steps.map(function (s, i) {
return React.createElement(Step, { key: i, title: s.title, description: s.description });
})
),
React.createElement(
'div',
null,
React.createElement(
'span',
{ className: 'ant-btn', onClick: this.nextStep },
'button',
{ className: 'ant-btn', onClick: this.next },
'下一步'
)
)
@@ -889,27 +865,23 @@ var MyForm = React.createClass({
}
});
React.render(React.createElement(MyForm, null), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
React.render(React.createElement(App, null), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-step-next'</span>);
<span class="keyword">var</span> steps = (<span class="function"><span class="keyword">function</span> <span class="title">generateRandomSteps</span><span class="params">()</span> {</span>
<span class="keyword">var</span> n = Math.floor(Math.random() * <span class="number">3</span>) + <span class="number">3</span>;
<span class="keyword">var</span> arr = [];
<span class="keyword">for</span> (<span class="keyword">var</span> i = <span class="number">0</span>; i &lt; n; i++ ) {
arr.push({
title: <span class="string">'步骤'</span> + (i+<span class="number">1</span>)
});
}
<span class="keyword">return</span> arr;
})();
<span class="keyword">var</span> array = Array.apply(<span class="literal">null</span>, Array(Math.floor(Math.random() * <span class="number">3</span>) + <span class="number">3</span>));
<span class="keyword">var</span> steps = array.map(<span class="function"><span class="keyword">function</span><span class="params">(item, i)</span> {</span>
<span class="keyword">return</span> {
title: <span class="string">'步骤'</span> + (i + <span class="number">1</span>)
};
});
<span class="keyword">var</span> MyForm = React.createClass({
<span class="keyword">var</span> App = React.createClass({
getInitialState() {
<span class="keyword">return</span> {
currentStep: Math.floor(Math.random() * steps.length)
}
},
nextStep() {
next() {
<span class="keyword">var</span> s = <span class="keyword">this</span>.state.currentStep + <span class="number">1</span>;
<span class="keyword">if</span> (s === steps.length) {
s = <span class="number">0</span>;
@@ -920,23 +892,21 @@ React.render(React.createElement(MyForm, null), container);})()</script><div cla
},
render() {
<span class="keyword">var</span> cs = <span class="keyword">this</span>.state.currentStep;
<span class="keyword">return</span> (<span class="xml"><span class="tag">&lt;<span class="title">form</span> <span class="attribute">className</span>=<span class="value">'my-step-form'</span>&gt;</span>
<span class="tag">&lt;<span class="title">div</span>&gt;</span>当前正在执行第{cs + 1}步<span class="tag">&lt;/<span class="title">div</span>&gt;</span>
<span class="tag">&lt;<span class="title">div</span> <span class="attribute">className</span>=<span class="value">'my-step-container'</span>&gt;</span><span class="tag">&lt;<span class="title">Steps</span>&gt;</span>
{steps.map(function(s, i) {
return <span class="tag">&lt;<span class="title">Steps.Step
</span> <span class="attribute">key</span>=<span class="value">{i}</span>
<span class="attribute">status</span>=<span class="value">{cs</span> =<span class="value">==</span> <span class="attribute">i</span> ? '<span class="attribute">process</span>' <span class="attribute">:</span> (<span class="attribute">cs</span> &gt;</span> i ? 'finish' : 'wait')}
title={s.title}
&gt;<span class="tag">&lt;/<span class="title">Steps.Step</span>&gt;</span>
})}
<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span><span class="tag">&lt;/<span class="title">div</span>&gt;</span>
<span class="tag">&lt;<span class="title">div</span>&gt;</span><span class="tag">&lt;<span class="title">span</span> <span class="attribute">className</span>=<span class="value">'ant-btn'</span> <span class="attribute">onClick</span>=<span class="value">{this.nextStep}</span>&gt;</span>下一步<span class="tag">&lt;/<span class="title">span</span>&gt;</span><span class="tag">&lt;/<span class="title">div</span>&gt;</span>
<span class="tag">&lt;/<span class="title">form</span>&gt;</span>)
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">div</span>&gt;</span>
<span class="tag">&lt;<span class="title">div</span>&gt;</span>当前正在执行第 {cs + 1} 步<span class="tag">&lt;/<span class="title">div</span>&gt;</span>
<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">current</span>=<span class="value">{cs}</span>&gt;</span>
{steps.map((s, i) =&gt; <span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>)}
<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>
<span class="tag">&lt;<span class="title">div</span>&gt;</span>
<span class="tag">&lt;<span class="title">button</span> <span class="attribute">className</span>=<span class="value">'ant-btn'</span> <span class="attribute">onClick</span>=<span class="value">{this.next}</span>&gt;</span>下一步<span class="tag">&lt;/<span class="title">button</span>&gt;</span>
<span class="tag">&lt;/<span class="title">div</span>&gt;</span>
<span class="tag">&lt;/<span class="title">div</span>&gt;</span>
);
}
});
React.render(<span class="tag">&lt;<span class="title">MyForm</span>&gt;</span><span class="tag">&lt;/<span class="title">MyForm</span>&gt;</span>, container);</span></code></pre></div>
React.render(<span class="tag">&lt;<span class="title">App</span> /&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
@@ -955,63 +925,48 @@ var Step = Steps.Step;
var container = document.getElementById('components-steps-demo-vertical');
var steps = [{
status: 'finish',
title: '已完成',
description: '这里是信息的描述'
}, {
status: 'process',
title: '进行中',
description: '这里是信息的描述'
}, {
status: 'wait',
title: '待运行',
description: '这里是信息的描述'
}, {
status: 'wait',
title: '又一个待运行',
description: '这里是信息的描述'
}].map(function (s, i) {
return React.createElement(Step, {
key: i,
status: s.status,
title: s.title,
description: s.description });
return React.createElement(Step, { key: i, title: s.title, description: s.description });
});
React.render(React.createElement(
Steps,
{ direction: 'vertical' },
{ direction: 'vertical', current: 1 },
steps
), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-vertical'</span>);
<span class="keyword">var</span> steps = [{
status: <span class="string">'finish'</span>,
title: <span class="string">'已完成'</span>,
description: <span class="string">'这里是信息的描述'</span>
}, {
status: <span class="string">'process'</span>,
title: <span class="string">'进行中'</span>,
description: <span class="string">'这里是信息的描述'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'待运行'</span>,
description: <span class="string">'这里是信息的描述'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'又一个待运行'</span>,
description: <span class="string">'这里是信息的描述'</span>
}].map(<span class="function"><span class="keyword">function</span><span class="params">(s, i)</span> {</span>
<span class="keyword">return</span> (<span class="xml"><span class="tag">&lt;<span class="title">Step
</span> <span class="attribute">key</span>=<span class="value">{i}</span>
<span class="attribute">status</span>=<span class="value">{s.status}</span>
<span class="attribute">title</span>=<span class="value">{s.title}</span>
<span class="attribute">description</span>=<span class="value">{s.description}</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>
);
});
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">direction</span>=<span class="value">'vertical'</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">direction</span>=<span class="value">'vertical'</span> <span class="attribute">current</span>=<span class="value">{1}</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
@@ -1030,55 +985,42 @@ var Step = Steps.Step;
var container = document.getElementById('components-steps-demo-vertical-small');
var steps = [{
status: 'finish',
title: '已完成',
description: '这里是信息的描述'
}, {
status: 'process',
title: '进行中',
description: '这里是信息的描述'
}, {
status: 'wait',
title: '待运行',
description: '这里是信息的描述'
}].map(function (s, i) {
return React.createElement(Step, {
key: i,
status: s.status,
title: s.title,
description: s.description });
return React.createElement(Step, { key: i, title: s.title, description: s.description });
});
React.render(React.createElement(
Steps,
{ size: 'small', direction: 'vertical' },
{ size: 'small', direction: 'vertical', current: 1 },
steps
), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-vertical-small'</span>);
<span class="keyword">var</span> steps = [{
status: <span class="string">'finish'</span>,
title: <span class="string">'已完成'</span>,
description: <span class="string">'这里是信息的描述'</span>
}, {
status: <span class="string">'process'</span>,
title: <span class="string">'进行中'</span>,
description: <span class="string">'这里是信息的描述'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'待运行'</span>,
description: <span class="string">'这里是信息的描述'</span>
}].map(<span class="function"><span class="keyword">function</span><span class="params">(s, i)</span> {</span>
<span class="keyword">return</span> (<span class="xml"><span class="tag">&lt;<span class="title">Step
</span> <span class="attribute">key</span>=<span class="value">{i}</span>
<span class="attribute">status</span>=<span class="value">{s.status}</span>
<span class="attribute">title</span>=<span class="value">{s.title}</span>
<span class="attribute">description</span>=<span class="value">{s.description}</span>&gt;</span><span class="tag">&lt;/<span class="title">Step</span>&gt;</span>
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>
);
});
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">size</span>=<span class="value">'small'</span> <span class="attribute">direction</span>=<span class="value">'vertical'</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class="attribute">size</span>=<span class="value">'small'</span> <span class="attribute">direction</span>=<span class="value">'vertical'</span> <span class="attribute">current</span>=<span class="value">{1}</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
@@ -1087,6 +1029,74 @@ React.render(<span class="tag">&lt;<span class="title">Steps</span> <span class=
<p>简单的竖直方向的小型步骤条。</p>
<span class="collapse anticon anticon-circle-o-right" unselectable="none" style="-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;"></span>
</div>
</div><div class="code-box" id="demo-status">
<div class="code-box-demo">
<div id="components-steps-demo-status"></div>
<script>(function(){'use strict';
var Steps = antd.Steps;
var Step = Steps.Step;
var container = document.getElementById('components-steps-demo-status');
var steps = [{
status: 'finish',
title: '已完成',
description: '这里是多信息的描述啊'
}, {
status: 'process',
title: '进行中',
description: '这里是多信息的耶哦耶哦哦耶哦耶'
}, {
status: 'wait',
title: '又一个待运行',
description: '描述啊描述啊'
}, {
status: 'wait',
title: '待运行',
description: '这里是多信息的描述啊'
}].map(function (s, i) {
return React.createElement(Step, { key: i, title: s.title, status: s.status, description: s.description });
});
React.render(React.createElement(
Steps,
null,
steps
), container);})()</script><div class="highlight"><pre><code class="javascript"><span class="keyword">var</span> Steps = antd.Steps;
<span class="keyword">var</span> Step = Steps.Step;
<span class="keyword">var</span> container = document.getElementById(<span class="string">'components-steps-demo-status'</span>);
<span class="keyword">var</span> steps = [{
status: <span class="string">'finish'</span>,
title: <span class="string">'已完成'</span>,
description: <span class="string">'这里是多信息的描述啊'</span>
}, {
status: <span class="string">'process'</span>,
title: <span class="string">'进行中'</span>,
description: <span class="string">'这里是多信息的耶哦耶哦哦耶哦耶'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'又一个待运行'</span>,
description: <span class="string">'描述啊描述啊'</span>
}, {
status: <span class="string">'wait'</span>,
title: <span class="string">'待运行'</span>,
description: <span class="string">'这里是多信息的描述啊'</span>
}].map(<span class="function"><span class="keyword">function</span><span class="params">(s, i)</span> {</span>
<span class="keyword">return</span> (
<span class="xml"><span class="tag">&lt;<span class="title">Step</span> <span class="attribute">key</span>=<span class="value">{i}</span> <span class="attribute">title</span>=<span class="value">{s.title}</span> <span class="attribute">status</span>=<span class="value">{s.status}</span> <span class="attribute">description</span>=<span class="value">{s.description}</span> /&gt;</span>
);
});
React.render(<span class="tag">&lt;<span class="title">Steps</span>&gt;</span>{steps}<span class="tag">&lt;/<span class="title">Steps</span>&gt;</span>, container);</span></code></pre></div>
</div>
<div class="code-box-meta markdown">
<div class="code-box-title">
<a href="#demo-status">自定义状态</a>
</div>
<p>可以使用 <code>status</code> 定义每个步骤的状态。</p>
<span class="collapse anticon anticon-circle-o-right" unselectable="none" style="-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;"></span>
</div>
</div>
</div>
</div>
+8 -2
View File
@@ -7,15 +7,21 @@ const AntSteps = React.createClass({
prefixCls: 'ant-steps',
iconPrefix: 'ant',
size: 'default',
maxDescriptionWidth: 100
maxDescriptionWidth: 100,
current: 0
};
},
render() {
let maxDescriptionWidth = this.props.maxDescriptionWidth;
if (this.props.direction === 'vertical') {
maxDescriptionWidth = 'auto';
}
return (
<Steps size={this.props.size}
current={this.props.current}
direction={this.props.direction}
iconPrefix={this.props.iconPrefix}
maxDescriptionWidth={this.props.maxDescriptionWidth}
maxDescriptionWidth={maxDescriptionWidth}
prefixCls={this.props.prefixCls}>
{this.props.children}
</Steps>
+3 -3
View File
@@ -13,7 +13,7 @@ Switch 开关 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Switch 开关 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Table 表格 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Table 表格 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Tabs 标签页 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Tabs 标签页 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Tag 标签 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Tag 标签 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Timeline 时间轴 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Timeline 时间轴 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Tooltip 文字提示 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Tooltip 文字提示 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Tree 树形控件 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Tree 树形控件 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Upload 文件上传 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Upload 文件上传 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+33 -5
View File
@@ -8,6 +8,21 @@ const prefixCls = 'ant-upload';
function noop() {
}
// Fix IE file.status problem
// via coping a new Object
function fileToObject(file) {
return {
lastModified: file.lastModified,
lastModifiedDate: file.lastModifiedDate,
name: file.name,
size: file.size,
type: file.type,
uid: file.uid,
response: file.response,
error: file.error
};
}
const AntUpload = React.createClass({
getInitialState() {
return {
@@ -17,11 +32,14 @@ const AntUpload = React.createClass({
onStart(file) {
let nextFileList = this.state.fileList.concat();
if (file.length > 0) {
file.forEach(function(f) {
file = file.map(function(f) {
f = fileToObject(f);
f.status = 'uploading';
return f;
});
nextFileList = nextFileList.concat(file);
} else {
file = fileToObject(file);
file.status = 'uploading';
nextFileList.push(file);
}
@@ -41,6 +59,14 @@ const AntUpload = React.createClass({
return null;
},
onSuccess(response, file) {
// json
//
try {
JSON.parse(response);
} catch (e) {
this.onError(new Error('No response'), response, file);
return;
}
let fileList = this.state.fileList.concat();
let targetItem = getFileItem(file, fileList);
//
@@ -65,10 +91,12 @@ const AntUpload = React.createClass({
}
},
onError(error, response, file) {
file.error = error;
file.response = response;
file.status = 'error';
this.handleRemove(file);
let fileList = this.state.fileList;
let targetItem = getFileItem(file, fileList);
targetItem.error = error;
targetItem.response = response;
targetItem.status = 'error';
this.handleRemove(targetItem);
},
handleRemove(file) {
let fileList = this.removeFile(file);
+3 -3
View File
@@ -13,7 +13,7 @@ Validation 表单校验 - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Validation 表单校验 - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
-1
View File
File diff suppressed because one or more lines are too long
-1
View File
File diff suppressed because one or more lines are too long
-1
View File
File diff suppressed because one or more lines are too long
+8 -9
View File
@@ -2694,6 +2694,10 @@ samp {
-webkit-animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
}
.zoom-tag-leave {
-webkit-animation: antZoomOut 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
animation: antZoomOut 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
}
@-webkit-keyframes antZoomIn {
0% {
opacity: 0;
@@ -4146,7 +4150,7 @@ fieldset[disabled] .ant-btn-ghost.active {
position: absolute;
left: -9999px;
top: -9999px;
z-index: 1000;
z-index: 1070;
}
.ant-calendar-picker-container .ant-calendar-hidden {
display: none;
@@ -7655,7 +7659,7 @@ textarea.ant-input-number {
.ant-message {
font-size: 12px;
position: fixed;
z-index: 1000;
z-index: 1050;
width: 100%;
top: 16px;
}
@@ -7824,8 +7828,7 @@ textarea.ant-input-number {
padding: 4px 0 8px 0;
}
.ant-slider-tooltip-inner {
padding: 6px 2px;
width: 100%;
padding: 6px;
min-width: 24px;
height: 24px;
font-size: 12px;
@@ -8272,10 +8275,6 @@ label.ant-radio-button-checked:active {
padding: 0;
margin-right: 0;
}
.zoom-tag-leave {
-webkit-animation: zoomOut 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
animation: zoomOut 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
}
.ant-alert {
position: relative;
padding: 8px 8px 8px 16px;
@@ -9424,4 +9423,4 @@ a .ant-badge-count:active {
min-height: 48px;
}
/*# sourceMappingURL=antd-0.9.1-beta4.css.map*/
/*# sourceMappingURL=antd-0.9.1-beta6.css.map*/
+1
View File
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large Load Diff
+1
View File
File diff suppressed because one or more lines are too long
+1
View File
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+7 -8
View File
@@ -2694,6 +2694,10 @@ samp {
-webkit-animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
}
.zoom-tag-leave {
-webkit-animation: antZoomOut 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
animation: antZoomOut 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
}
@-webkit-keyframes antZoomIn {
0% {
opacity: 0;
@@ -4146,7 +4150,7 @@ fieldset[disabled] .ant-btn-ghost.active {
position: absolute;
left: -9999px;
top: -9999px;
z-index: 1000;
z-index: 1070;
}
.ant-calendar-picker-container .ant-calendar-hidden {
display: none;
@@ -7655,7 +7659,7 @@ textarea.ant-input-number {
.ant-message {
font-size: 12px;
position: fixed;
z-index: 1000;
z-index: 1050;
width: 100%;
top: 16px;
}
@@ -7824,8 +7828,7 @@ textarea.ant-input-number {
padding: 4px 0 8px 0;
}
.ant-slider-tooltip-inner {
padding: 6px 2px;
width: 100%;
padding: 6px;
min-width: 24px;
height: 24px;
font-size: 12px;
@@ -8272,10 +8275,6 @@ label.ant-radio-button-checked:active {
padding: 0;
margin-right: 0;
}
.zoom-tag-leave {
-webkit-animation: zoomOut 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
animation: zoomOut 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
}
.ant-alert {
position: relative;
padding: 8px 8px 8px 16px;
+1 -1
View File
File diff suppressed because one or more lines are too long
+1334 -148
View File
File diff suppressed because it is too large Load Diff
+1 -1
View File
File diff suppressed because one or more lines are too long
+139 -139
View File
@@ -7,7 +7,7 @@
exports["antd"] = factory(require("react"), require("antd"), require("jquery"));
else
root["antd"] = factory(root["React"], root["antd"], root["jQuery"]);
})(this, function(__WEBPACK_EXTERNAL_MODULE_76__, __WEBPACK_EXTERNAL_MODULE_375__, __WEBPACK_EXTERNAL_MODULE_376__) {
})(this, function(__WEBPACK_EXTERNAL_MODULE_76__, __WEBPACK_EXTERNAL_MODULE_380__, __WEBPACK_EXTERNAL_MODULE_381__) {
return /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
@@ -58,10 +58,10 @@ return /******/ (function(modules) { // webpackBootstrap
'use strict';
window['css-animation'] = __webpack_require__(123);
window['react-router'] = __webpack_require__(333);
var antd = __webpack_require__(375);
window['react-router'] = __webpack_require__(338);
var antd = __webpack_require__(380);
var $ = __webpack_require__(376);
var $ = __webpack_require__(381);
var React = __webpack_require__(76);
InstantClickChangeFns.push(function () {
@@ -512,7 +512,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 333:
/***/ 338:
/***/ function(module, exports, __webpack_require__) {
/* components */
@@ -522,13 +522,13 @@ return /******/ (function(modules) { // webpackBootstrap
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _Router2 = __webpack_require__(334);
var _Router2 = __webpack_require__(339);
var _Router3 = _interopRequireDefault(_Router2);
exports.Router = _Router3['default'];
var _Link2 = __webpack_require__(366);
var _Link2 = __webpack_require__(371);
var _Link3 = _interopRequireDefault(_Link2);
@@ -536,19 +536,19 @@ return /******/ (function(modules) { // webpackBootstrap
/* components (configuration) */
var _IndexRoute2 = __webpack_require__(367);
var _IndexRoute2 = __webpack_require__(372);
var _IndexRoute3 = _interopRequireDefault(_IndexRoute2);
exports.IndexRoute = _IndexRoute3['default'];
var _Redirect2 = __webpack_require__(368);
var _Redirect2 = __webpack_require__(373);
var _Redirect3 = _interopRequireDefault(_Redirect2);
exports.Redirect = _Redirect3['default'];
var _Route2 = __webpack_require__(369);
var _Route2 = __webpack_require__(374);
var _Route3 = _interopRequireDefault(_Route2);
@@ -556,19 +556,19 @@ return /******/ (function(modules) { // webpackBootstrap
/* mixins */
var _History2 = __webpack_require__(370);
var _History2 = __webpack_require__(375);
var _History3 = _interopRequireDefault(_History2);
exports.History = _History3['default'];
var _Lifecycle2 = __webpack_require__(371);
var _Lifecycle2 = __webpack_require__(376);
var _Lifecycle3 = _interopRequireDefault(_Lifecycle2);
exports.Lifecycle = _Lifecycle3['default'];
var _RouteContext2 = __webpack_require__(372);
var _RouteContext2 = __webpack_require__(377);
var _RouteContext3 = _interopRequireDefault(_RouteContext2);
@@ -576,29 +576,29 @@ return /******/ (function(modules) { // webpackBootstrap
/* utils */
var _useRoutes2 = __webpack_require__(353);
var _useRoutes2 = __webpack_require__(358);
var _useRoutes3 = _interopRequireDefault(_useRoutes2);
exports.useRoutes = _useRoutes3['default'];
var _RouteUtils = __webpack_require__(349);
var _RouteUtils = __webpack_require__(354);
exports.createRoutes = _RouteUtils.createRoutes;
var _RoutingContext2 = __webpack_require__(350);
var _RoutingContext2 = __webpack_require__(355);
var _RoutingContext3 = _interopRequireDefault(_RoutingContext2);
exports.RoutingContext = _RoutingContext3['default'];
var _PropTypes2 = __webpack_require__(365);
var _PropTypes2 = __webpack_require__(370);
var _PropTypes3 = _interopRequireDefault(_PropTypes2);
exports.PropTypes = _PropTypes3['default'];
var _match2 = __webpack_require__(373);
var _match2 = __webpack_require__(378);
var _match3 = _interopRequireDefault(_match2);
@@ -610,7 +610,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 334:
/***/ 339:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -623,25 +623,25 @@ return /******/ (function(modules) { // webpackBootstrap
var _react2 = _interopRequireDefault(_react);
var _warning = __webpack_require__(335);
var _warning = __webpack_require__(340);
var _warning2 = _interopRequireDefault(_warning);
var _historyLibCreateHashHistory = __webpack_require__(336);
var _historyLibCreateHashHistory = __webpack_require__(341);
var _historyLibCreateHashHistory2 = _interopRequireDefault(_historyLibCreateHashHistory);
var _RouteUtils = __webpack_require__(349);
var _RouteUtils = __webpack_require__(354);
var _RoutingContext = __webpack_require__(350);
var _RoutingContext = __webpack_require__(355);
var _RoutingContext2 = _interopRequireDefault(_RoutingContext);
var _useRoutes = __webpack_require__(353);
var _useRoutes = __webpack_require__(358);
var _useRoutes2 = _interopRequireDefault(_useRoutes);
var _PropTypes = __webpack_require__(365);
var _PropTypes = __webpack_require__(370);
var _React$PropTypes = _react2['default'].PropTypes;
var func = _React$PropTypes.func;
@@ -748,7 +748,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 335:
/***/ 340:
/***/ function(module, exports, __webpack_require__) {
/* WEBPACK VAR INJECTION */(function(process) {/**
@@ -816,7 +816,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 336:
/***/ 341:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -827,27 +827,27 @@ return /******/ (function(modules) { // webpackBootstrap
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _warning = __webpack_require__(335);
var _warning = __webpack_require__(340);
var _warning2 = _interopRequireDefault(_warning);
var _invariant = __webpack_require__(337);
var _invariant = __webpack_require__(342);
var _invariant2 = _interopRequireDefault(_invariant);
var _Actions = __webpack_require__(338);
var _Actions = __webpack_require__(343);
var _ExecutionEnvironment = __webpack_require__(339);
var _ExecutionEnvironment = __webpack_require__(344);
var _DOMUtils = __webpack_require__(340);
var _DOMUtils = __webpack_require__(345);
var _DOMStateStorage = __webpack_require__(341);
var _DOMStateStorage = __webpack_require__(346);
var _createDOMHistory = __webpack_require__(342);
var _createDOMHistory = __webpack_require__(347);
var _createDOMHistory2 = _interopRequireDefault(_createDOMHistory);
var _createLocation = __webpack_require__(348);
var _createLocation = __webpack_require__(353);
var _createLocation2 = _interopRequireDefault(_createLocation);
@@ -1018,7 +1018,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 337:
/***/ 342:
/***/ function(module, exports, __webpack_require__) {
/* WEBPACK VAR INJECTION */(function(process) {/**
@@ -1079,7 +1079,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 338:
/***/ 343:
/***/ function(module, exports) {
/**
@@ -1116,7 +1116,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 339:
/***/ 344:
/***/ function(module, exports) {
'use strict';
@@ -1127,7 +1127,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 340:
/***/ 345:
/***/ function(module, exports) {
'use strict';
@@ -1208,7 +1208,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 341:
/***/ 346:
/***/ function(module, exports) {
'use strict';
@@ -1242,7 +1242,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 342:
/***/ 347:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -1253,15 +1253,15 @@ return /******/ (function(modules) { // webpackBootstrap
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _invariant = __webpack_require__(337);
var _invariant = __webpack_require__(342);
var _invariant2 = _interopRequireDefault(_invariant);
var _ExecutionEnvironment = __webpack_require__(339);
var _ExecutionEnvironment = __webpack_require__(344);
var _DOMUtils = __webpack_require__(340);
var _DOMUtils = __webpack_require__(345);
var _createHistory = __webpack_require__(343);
var _createHistory = __webpack_require__(348);
var _createHistory2 = _interopRequireDefault(_createHistory);
@@ -1288,7 +1288,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 343:
/***/ 348:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -1299,23 +1299,23 @@ return /******/ (function(modules) { // webpackBootstrap
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _warning = __webpack_require__(335);
var _warning = __webpack_require__(340);
var _warning2 = _interopRequireDefault(_warning);
var _invariant = __webpack_require__(337);
var _invariant = __webpack_require__(342);
var _invariant2 = _interopRequireDefault(_invariant);
var _deepEqual = __webpack_require__(344);
var _deepEqual = __webpack_require__(349);
var _deepEqual2 = _interopRequireDefault(_deepEqual);
var _AsyncUtils = __webpack_require__(347);
var _AsyncUtils = __webpack_require__(352);
var _Actions = __webpack_require__(338);
var _Actions = __webpack_require__(343);
var _createLocation = __webpack_require__(348);
var _createLocation = __webpack_require__(353);
var _createLocation2 = _interopRequireDefault(_createLocation);
@@ -1530,12 +1530,12 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 344:
/***/ 349:
/***/ function(module, exports, __webpack_require__) {
var pSlice = Array.prototype.slice;
var objectKeys = __webpack_require__(345);
var isArguments = __webpack_require__(346);
var objectKeys = __webpack_require__(350);
var isArguments = __webpack_require__(351);
var deepEqual = module.exports = function (actual, expected, opts) {
if (!opts) opts = {};
@@ -1631,7 +1631,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 345:
/***/ 350:
/***/ function(module, exports) {
exports = module.exports = typeof Object.keys === 'function'
@@ -1647,7 +1647,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 346:
/***/ 351:
/***/ function(module, exports) {
var supportsArgumentsClass = (function(){
@@ -1674,7 +1674,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 347:
/***/ 352:
/***/ function(module, exports) {
"use strict";
@@ -1706,7 +1706,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 348:
/***/ 353:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -1715,11 +1715,11 @@ return /******/ (function(modules) { // webpackBootstrap
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _warning = __webpack_require__(335);
var _warning = __webpack_require__(340);
var _warning2 = _interopRequireDefault(_warning);
var _Actions = __webpack_require__(338);
var _Actions = __webpack_require__(343);
function extractPath(string) {
var match = string.match(/https?:\/\/[^\/]*/);
@@ -1772,7 +1772,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 349:
/***/ 354:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -1792,7 +1792,7 @@ return /******/ (function(modules) { // webpackBootstrap
var _react2 = _interopRequireDefault(_react);
var _warning = __webpack_require__(335);
var _warning = __webpack_require__(340);
var _warning2 = _interopRequireDefault(_warning);
@@ -1891,7 +1891,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 350:
/***/ 355:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -1904,11 +1904,11 @@ return /******/ (function(modules) { // webpackBootstrap
var _react2 = _interopRequireDefault(_react);
var _invariant = __webpack_require__(337);
var _invariant = __webpack_require__(342);
var _invariant2 = _interopRequireDefault(_invariant);
var _getRouteParams = __webpack_require__(351);
var _getRouteParams = __webpack_require__(356);
var _getRouteParams2 = _interopRequireDefault(_getRouteParams);
@@ -2008,14 +2008,14 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 351:
/***/ 356:
/***/ function(module, exports, __webpack_require__) {
'use strict';
exports.__esModule = true;
var _PatternUtils = __webpack_require__(352);
var _PatternUtils = __webpack_require__(357);
/**
* Extracts an object of params the given route cares about from
@@ -2038,7 +2038,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 352:
/***/ 357:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -2052,7 +2052,7 @@ return /******/ (function(modules) { // webpackBootstrap
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _invariant = __webpack_require__(337);
var _invariant = __webpack_require__(342);
var _invariant2 = _interopRequireDefault(_invariant);
@@ -2238,7 +2238,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 353:
/***/ 358:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -2251,35 +2251,35 @@ return /******/ (function(modules) { // webpackBootstrap
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
var _warning = __webpack_require__(335);
var _warning = __webpack_require__(340);
var _warning2 = _interopRequireDefault(_warning);
var _historyLibActions = __webpack_require__(338);
var _historyLibActions = __webpack_require__(343);
var _historyLibUseQueries = __webpack_require__(354);
var _historyLibUseQueries = __webpack_require__(359);
var _historyLibUseQueries2 = _interopRequireDefault(_historyLibUseQueries);
var _historyLibCreateLocation = __webpack_require__(348);
var _historyLibCreateLocation = __webpack_require__(353);
var _historyLibCreateLocation2 = _interopRequireDefault(_historyLibCreateLocation);
var _computeChangedRoutes2 = __webpack_require__(359);
var _computeChangedRoutes2 = __webpack_require__(364);
var _computeChangedRoutes3 = _interopRequireDefault(_computeChangedRoutes2);
var _TransitionUtils = __webpack_require__(360);
var _TransitionUtils = __webpack_require__(365);
var _isActive2 = __webpack_require__(362);
var _isActive2 = __webpack_require__(367);
var _isActive3 = _interopRequireDefault(_isActive2);
var _getComponents = __webpack_require__(363);
var _getComponents = __webpack_require__(368);
var _getComponents2 = _interopRequireDefault(_getComponents);
var _matchRoutes = __webpack_require__(364);
var _matchRoutes = __webpack_require__(369);
var _matchRoutes2 = _interopRequireDefault(_matchRoutes);
@@ -2518,7 +2518,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 354:
/***/ 359:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -2531,7 +2531,7 @@ return /******/ (function(modules) { // webpackBootstrap
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
var _qs = __webpack_require__(355);
var _qs = __webpack_require__(360);
var _qs2 = _interopRequireDefault(_qs);
@@ -2603,13 +2603,13 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 355:
/***/ 360:
/***/ function(module, exports, __webpack_require__) {
// Load modules
var Stringify = __webpack_require__(356);
var Parse = __webpack_require__(358);
var Stringify = __webpack_require__(361);
var Parse = __webpack_require__(363);
// Declare internals
@@ -2625,12 +2625,12 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 356:
/***/ 361:
/***/ function(module, exports, __webpack_require__) {
// Load modules
var Utils = __webpack_require__(357);
var Utils = __webpack_require__(362);
// Declare internals
@@ -2753,7 +2753,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 357:
/***/ 362:
/***/ function(module, exports) {
// Load modules
@@ -2950,12 +2950,12 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 358:
/***/ 363:
/***/ function(module, exports, __webpack_require__) {
// Load modules
var Utils = __webpack_require__(357);
var Utils = __webpack_require__(362);
// Declare internals
@@ -3143,14 +3143,14 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 359:
/***/ 364:
/***/ function(module, exports, __webpack_require__) {
'use strict';
exports.__esModule = true;
var _PatternUtils = __webpack_require__(352);
var _PatternUtils = __webpack_require__(357);
function routeParamsChanged(route, prevState, nextState) {
if (!route.path) return false;
@@ -3204,7 +3204,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 360:
/***/ 365:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -3213,7 +3213,7 @@ return /******/ (function(modules) { // webpackBootstrap
exports.runEnterHooks = runEnterHooks;
exports.runLeaveHooks = runLeaveHooks;
var _AsyncUtils = __webpack_require__(361);
var _AsyncUtils = __webpack_require__(366);
function createEnterHook(hook, route) {
return function (a, b, callback) {
@@ -3280,7 +3280,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 361:
/***/ 366:
/***/ function(module, exports) {
"use strict";
@@ -3344,14 +3344,14 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 362:
/***/ 367:
/***/ function(module, exports, __webpack_require__) {
'use strict';
exports.__esModule = true;
var _PatternUtils = __webpack_require__(352);
var _PatternUtils = __webpack_require__(357);
/**
* Returns true if a route and params that match the given
@@ -3418,14 +3418,14 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 363:
/***/ 368:
/***/ function(module, exports, __webpack_require__) {
'use strict';
exports.__esModule = true;
var _AsyncUtils = __webpack_require__(361);
var _AsyncUtils = __webpack_require__(366);
function getComponentsForRoute(location, route, callback) {
if (route.component || route.components) {
@@ -3457,18 +3457,18 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 364:
/***/ 369:
/***/ function(module, exports, __webpack_require__) {
'use strict';
exports.__esModule = true;
var _AsyncUtils = __webpack_require__(361);
var _AsyncUtils = __webpack_require__(366);
var _PatternUtils = __webpack_require__(352);
var _PatternUtils = __webpack_require__(357);
var _RouteUtils = __webpack_require__(349);
var _RouteUtils = __webpack_require__(354);
function getChildRoutes(route, location, callback) {
if (route.childRoutes) {
@@ -3601,7 +3601,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 365:
/***/ 370:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -3660,7 +3660,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 366:
/***/ 371:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -3677,7 +3677,7 @@ return /******/ (function(modules) { // webpackBootstrap
var _react2 = _interopRequireDefault(_react);
var _warning = __webpack_require__(335);
var _warning = __webpack_require__(340);
var _warning2 = _interopRequireDefault(_warning);
@@ -3802,7 +3802,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 367:
/***/ 372:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -3815,17 +3815,17 @@ return /******/ (function(modules) { // webpackBootstrap
var _react2 = _interopRequireDefault(_react);
var _invariant = __webpack_require__(337);
var _invariant = __webpack_require__(342);
var _invariant2 = _interopRequireDefault(_invariant);
var _warning = __webpack_require__(335);
var _warning = __webpack_require__(340);
var _warning2 = _interopRequireDefault(_warning);
var _RouteUtils = __webpack_require__(349);
var _RouteUtils = __webpack_require__(354);
var _PropTypes = __webpack_require__(365);
var _PropTypes = __webpack_require__(370);
var _React$PropTypes = _react2['default'].PropTypes;
var bool = _React$PropTypes.bool;
@@ -3869,7 +3869,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 368:
/***/ 373:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -3882,15 +3882,15 @@ return /******/ (function(modules) { // webpackBootstrap
var _react2 = _interopRequireDefault(_react);
var _invariant = __webpack_require__(337);
var _invariant = __webpack_require__(342);
var _invariant2 = _interopRequireDefault(_invariant);
var _RouteUtils = __webpack_require__(349);
var _RouteUtils = __webpack_require__(354);
var _PatternUtils = __webpack_require__(352);
var _PatternUtils = __webpack_require__(357);
var _PropTypes = __webpack_require__(365);
var _PropTypes = __webpack_require__(370);
var _React$PropTypes = _react2['default'].PropTypes;
var string = _React$PropTypes.string;
@@ -3951,7 +3951,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 369:
/***/ 374:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -3964,17 +3964,17 @@ return /******/ (function(modules) { // webpackBootstrap
var _react2 = _interopRequireDefault(_react);
var _warning = __webpack_require__(335);
var _warning = __webpack_require__(340);
var _warning2 = _interopRequireDefault(_warning);
var _invariant = __webpack_require__(337);
var _invariant = __webpack_require__(342);
var _invariant2 = _interopRequireDefault(_invariant);
var _RouteUtils = __webpack_require__(349);
var _RouteUtils = __webpack_require__(354);
var _PropTypes = __webpack_require__(365);
var _PropTypes = __webpack_require__(370);
var _React$PropTypes = _react2['default'].PropTypes;
var string = _React$PropTypes.string;
@@ -4031,14 +4031,14 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 370:
/***/ 375:
/***/ function(module, exports, __webpack_require__) {
'use strict';
exports.__esModule = true;
var _PropTypes = __webpack_require__(365);
var _PropTypes = __webpack_require__(370);
var History = {
@@ -4055,7 +4055,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 371:
/***/ 376:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -4068,7 +4068,7 @@ return /******/ (function(modules) { // webpackBootstrap
var _react2 = _interopRequireDefault(_react);
var _invariant = __webpack_require__(337);
var _invariant = __webpack_require__(342);
var _invariant2 = _interopRequireDefault(_invariant);
@@ -4129,7 +4129,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 372:
/***/ 377:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -4173,7 +4173,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 373:
/***/ 378:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -4186,15 +4186,15 @@ return /******/ (function(modules) { // webpackBootstrap
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _historyLibCreateMemoryHistory = __webpack_require__(374);
var _historyLibCreateMemoryHistory = __webpack_require__(379);
var _historyLibCreateMemoryHistory2 = _interopRequireDefault(_historyLibCreateMemoryHistory);
var _useRoutes = __webpack_require__(353);
var _useRoutes = __webpack_require__(358);
var _useRoutes2 = _interopRequireDefault(_useRoutes);
var _RouteUtils = __webpack_require__(349);
var _RouteUtils = __webpack_require__(354);
function match(_ref, cb) {
var routes = _ref.routes;
@@ -4223,7 +4223,7 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 374:
/***/ 379:
/***/ function(module, exports, __webpack_require__) {
'use strict';
@@ -4234,17 +4234,17 @@ return /******/ (function(modules) { // webpackBootstrap
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var _invariant = __webpack_require__(337);
var _invariant = __webpack_require__(342);
var _invariant2 = _interopRequireDefault(_invariant);
var _Actions = __webpack_require__(338);
var _Actions = __webpack_require__(343);
var _createLocation = __webpack_require__(348);
var _createLocation = __webpack_require__(353);
var _createLocation2 = _interopRequireDefault(_createLocation);
var _createHistory = __webpack_require__(343);
var _createHistory = __webpack_require__(348);
var _createHistory2 = _interopRequireDefault(_createHistory);
@@ -4376,17 +4376,17 @@ return /******/ (function(modules) { // webpackBootstrap
/***/ },
/***/ 375:
/***/ 380:
/***/ function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_375__;
module.exports = __WEBPACK_EXTERNAL_MODULE_380__;
/***/ },
/***/ 376:
/***/ 381:
/***/ function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_376__;
module.exports = __WEBPACK_EXTERNAL_MODULE_381__;
/***/ }
+1 -1
View File
File diff suppressed because one or more lines are too long
+3 -3
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@ Ant Design of React - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Ant Design of React - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -13,7 +13,7 @@
<link href="http://fonts.useso.com/css?family=Raleway:600,500,400,300" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+3 -3
View File
@@ -1,6 +1,6 @@
{
"name": "antd",
"version": "0.9.1-beta4",
"version": "0.9.1-beta6",
"stableVersion": "0.9.0",
"title": "Ant Design",
"description": "一个 UI 设计语言",
@@ -52,13 +52,13 @@
"rc-radio": "~2.0.0",
"rc-select": "~4.9.0",
"rc-slider": "~1.4.0",
"rc-steps": "~1.2.4",
"rc-steps": "~1.3.0",
"rc-switch": "~1.2.0",
"rc-table": "~3.2.0",
"rc-tabs": "~5.3.2",
"rc-tooltip": "~2.6.4",
"rc-tree": "~0.15.4",
"rc-upload": "~1.4.0",
"rc-upload": "~1.5.0",
"rc-util": "~2.0.3",
"react-slick": "~0.7.0",
"reqwest-without-xhr2": "~2.0.2",
+3 -3
View File
@@ -13,7 +13,7 @@ Ant Design <a href="https://travis-ci.org/ant-design/ant-design"><img src="https
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Ant Design <a href="https://travis-ci.org/ant-design/ant-design"><img src="https
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
+5 -5
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -290,14 +290,14 @@
<ul class="">
<li class="">
<a href="easing"
class=""data-no-instant>
class="">
自然运动
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="page-transition"
class=""data-no-instant>
class="">
互动转换
<span class="chinese"></span>
</a>
+7 -39
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -290,14 +290,14 @@
<ul class="">
<li class="current">
<a href="easing"
class=""data-no-instant>
class="">
自然运动
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="page-transition"
class=""data-no-instant>
class="">
互动转换
<span class="chinese"></span>
</a>
@@ -340,30 +340,14 @@
</blockquote>
<h4 id="自然缓动">自然缓动</h4><p>不要用直线缓动 Linear 做物体位移或出入动画的缓动;注:Linear 函数可做循环动画函数。</p>
<p>如下图所示,在没有缓动的情况下启动与停止都显得突兀,感觉动画还没结束就停止了,所以在物体运动中避免直线运动。</p>
<script src="/static/TweenMax.min.js"></script>
<script src="/static/motion.js"></script>
<div id="J-Linear"></div>
<script>
$(function (){
new Motion("#J-Linear",{lineData:[{stroke:"#f2666c"},{stroke:"#71B5DE",openEaseName:"easeInOutQuad",endEaseName:"easeInOutQuad"},],mask:false});
})
</script>
<p>上图所示缓动函数:红 <code>Linear</code>,蓝 <code>ease-in-out</code></p>
<h4 id="出入动画">出入动画</h4><p>不要做单向动画,进场后不做出场,直接消失元素或回到原点,会造成整体效果不协调和用户视觉上的闪现或其它不好的效果。</p>
<p>所以有动画的进场必须要有动画的出场,包括导航上的动画。</p>
<div id="J-Symmetric"></div>
<script>
$(function (){
new Motion("#J-Symmetric",{lineData:[
{openEaseName:"easeInOutQuad",endEaseName:"null",stroke:"#f2666c"},
{stroke:"#71B5DE",openEaseName:"easeInOutCubic",endEaseName:"easeInOutCubic"}],
mask:false,exposure:"top"});
})
</script>
<p>上图所示缓动函数:红 <code>ease-in-out</code>,蓝 <code>ease-in-out-cubic</code></p>
<h5 id="场外出入">场外出入</h5><p>场外出入需要考虑力量与引力的关系,如向空中抛物体时,物体的初速度是最快的。</p>
@@ -372,14 +356,6 @@ mask:false,exposure:"top"});
<p>所以最高点前后都有一定缓冲带,曲线呈现抛物线的规律。不要做图示红色球体下降时的缓动。</p>
<div id="J-Entry"></div>
<script>
$(function (){
new Motion("#J-Entry",{lineData:[
{openEaseName:"easeOutQuad",endEaseName:"easeOutQuad",stroke:"#f2666c"},
{stroke:"#71B5DE",openEaseName:"easeOutCubic",endEaseName:"easeInCubic"}],
mask:true,exposure:"bottom"});
})
</script>
<p>上图所示缓动函数:红 <code>ease-out</code> <code>ease-out</code>,蓝 <code>ease-out-cubic</code> <code>ease-in-cubic</code></p>
<p>示例组件:<a href="/components/message/">Message 全局提示</a><a href="/components/dropdown/">Dropdown 下拉菜单</a></p>
@@ -394,16 +370,8 @@ mask:true,exposure:"bottom"});
<blockquote>
<p>慎用 Bounce 或 Elastic,这两种适用在特殊元素下,一般 back 即可满足页面上元素的弹动;</p>
</blockquote>
<div id="J-Back"></div>
<script>
$(function (){
new Motion("#J-Back",{lineData:[
{openEaseName:"easeOutBounce",endEaseName:"easeOutElastic",stroke:"#70f266"},
{stroke:"#71B5DE",openEaseName:"easeOutBack",endEaseName:"easeInOutBack"}],
mask:false,exposure:"top"});
})
</script>
<p><div id="J-Back"></div></p>
<script src="/static/motionDemoLoad.js?page=easing"></script>
<p>上图所示缓动函数:绿 <code>easeOutBounce</code> <code>easeOutElastic</code>css 需自配), 蓝 <code>ease-out-back</code> <code>ease-in-back</code></p>
<h2 id="缓动函数">缓动函数</h2><p>Ant Design 提供了一套缓动函数规范动画行为供组件使用。</p>
+5 -5
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -290,14 +290,14 @@
<ul class="">
<li class="">
<a href="easing"
class=""data-no-instant>
class="">
自然运动
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="page-transition"
class=""data-no-instant>
class="">
互动转换
<span class="chinese"></span>
</a>
+5 -5
View File
@@ -13,7 +13,7 @@ Ant Design - 一个 UI 设计语言
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ Ant Design - 一个 UI 设计语言
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -290,14 +290,14 @@ Ant Design - 一个 UI 设计语言
<ul class="">
<li class="">
<a href="easing"
class=""data-no-instant>
class="">
自然运动
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="page-transition"
class=""data-no-instant>
class="">
互动转换
<span class="chinese"></span>
</a>
+5 -5
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -290,14 +290,14 @@
<ul class="">
<li class="">
<a href="easing"
class=""data-no-instant>
class="">
自然运动
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="page-transition"
class=""data-no-instant>
class="">
互动转换
<span class="chinese"></span>
</a>
+8 -11
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -290,14 +290,14 @@
<ul class="">
<li class="">
<a href="easing"
class=""data-no-instant>
class="">
自然运动
<span class="chinese"></span>
</a>
</li>
<li class="current">
<a href="page-transition"
class=""data-no-instant>
class="">
互动转换
<span class="chinese"></span>
</a>
@@ -332,7 +332,6 @@
<h2 id="响应互动">响应互动</h2><p>响应交互一般是指我们在浏览页面时,点击元素时动画给我们视觉上的反馈,每个交互动效都能给我们带来不同视觉效果。</p>
<p>比如:按钮上的 hover 或 click 效果,随着你的鼠标事件而改变自身或增加元素在按钮上,或者折叠面板和弹出框,点击后给你呈现新加入的信息元素。</p>
<h3 id="按钮反馈">按钮反馈</h3><div class="video-player">
<video preload loop><source src="https://t.alipayobjects.com/images/rmsweb/T1yHhhXfxkXXXXXXXX.webm" type="video/webm"><source src="https://t.alipayobjects.com/images/rmsweb/T15IXhXlXbXXXXXXXX.mp4" type="video/mp4"></video>
</div>
@@ -350,13 +349,12 @@
</ul>
<p><link rel="stylesheet" href="/static/motionDemo.css"></p>
<div class="video-player">
<video preload loop><source src="https://t.alipayobjects.com/images/rmsweb/T12I8gXexdXXXXXXXX.webm" type="video/webm"><source src="https://t.alipayobjects.com/images/rmsweb/T1e0hgXcpdXXXXXXXX.mp4" type="video/mp4"></video>
</div>
<h3 id="弹出框动效">弹出框动效</h3><p>从一个触发点触发一个弹出框时,弹框从所触发区域弹出,且触发区域视觉上基本保持不变。这样让触发区域和弹出区域有所关联,提高用户对新内容的认知。</p>
<div class="video-player">
<video preload loop><source src="https://t.alipayobjects.com/images/rmsweb/T1br0gXghtXXXXXXXX.webm" type="video/webm"><source src="https://t.alipayobjects.com/images/rmsweb/T1lcRgXb4gXXXXXXXX.mp4" type="video/mp4"></video>
</div>
@@ -367,11 +365,10 @@
<li><p>小的信息元素排布或块状较多的情况下,根据一定的路径层次依次进场,区分维度层级,来凸显量级,来指引用户的视觉轨迹。</p>
</li>
</ul>
<script src="/static/TweenMax.min.js"></script>
<script src="/static/motion.js"></script>
<script src="/static/motionDemoLoad.js"></script>
<div class="video-player">
<video preload loop><source src="https://t.alipayobjects.com/images/rmsweb/T14q0hXbBdXXXXXXXX.webm" type="video/webm"><source src="https://t.alipayobjects.com/images/T1qWNhXkpeXXXXXXXX.mp4" type="video/mp4"></video>
</div>
<blockquote>
+5 -5
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -290,14 +290,14 @@
<ul class="">
<li class="">
<a href="easing"
class=""data-no-instant>
class="">
自然运动
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="page-transition"
class=""data-no-instant>
class="">
互动转换
<span class="chinese"></span>
</a>
+5 -5
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -290,14 +290,14 @@
<ul class="">
<li class="">
<a href="easing"
class=""data-no-instant>
class="">
自然运动
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="page-transition"
class=""data-no-instant>
class="">
互动转换
<span class="chinese"></span>
</a>
+5 -5
View File
@@ -13,7 +13,7 @@
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {
@@ -290,14 +290,14 @@
<ul class="">
<li class="">
<a href="easing"
class=""data-no-instant>
class="">
自然运动
<span class="chinese"></span>
</a>
</li>
<li class="">
<a href="page-transition"
class=""data-no-instant>
class="">
互动转换
<span class="chinese"></span>
</a>
+10 -2
View File
@@ -725,7 +725,7 @@ $(function () {
var tt = _x;
_x = {};
_x.startAt = tt;
cx.ease = eease,cx.delay = self.d_time;
cx.ease = eease, cx.delay = self.d_time;
} else if (self.data.lineData[i].endEaseName === "null") {
var t = cx;
cx = {};
@@ -742,13 +742,21 @@ $(function () {
window.Motion = newMotion;
var motionVideo = {
video: ['https://t.alipayobjects.com/images/rmsweb/T1yHhhXfxkXXXXXXXX.webm', 'https://t.alipayobjects.com/images/rmsweb/T12I8gXexdXXXXXXXX.webm', 'https://t.alipayobjects.com/images/rmsweb/T1br0gXghtXXXXXXXX.webm', 'https://t.alipayobjects.com/images/rmsweb/T14q0hXbBdXXXXXXXX.webm'],
videoMp4: ['https://t.alipayobjects.com/images/rmsweb/T15IXhXlXbXXXXXXXX.mp4', 'https://t.alipayobjects.com/images/rmsweb/T1e0hgXcpdXXXXXXXX.mp4', 'https://t.alipayobjects.com/images/rmsweb/T1lcRgXb4gXXXXXXXX.mp4', 'https://t.alipayobjects.com/images/T1qWNhXkpeXXXXXXXX.mp4'],
init: function () {
var self = this;
self.videoBox = $(".video-player");
$('<video preload loop></video>').appendTo(self.videoBox);
for (var i = 0; i < self.videoBox.length; i++) {
var svg = new SVG();
self.videoBox.eq(i).append(svg.node);
var video = self.videoBox.eq(i).find("video");
if(video[0].canPlayType('video/webm; codecs="vp8.0, vorbis"')) {
$('<source src="'+self.video[i]+'" type="video/webm">').appendTo(video);
}else{
$('<source src="'+self.videoMp4[i]+'" type="video/mp4">').appendTo(video);
}
video.css({"width": "100%"});
video.append(svg);
svg.css({"position": "absolute", "top": 0, "left": 0});
@@ -773,6 +781,6 @@ $(function () {
}
}
};
motionVideo.init();
window.Motion.motionVideo = motionVideo;
});
+78
View File
@@ -0,0 +1,78 @@
/**
* Created by jljsj on 15/9/16.
*/
var TweenMax = TweenMax, Motion = Motion;
$(function () {
var needData = ["/static/TweenMax.min.js", "/static/motion.js"];
var loadFunc = {
num: 0,
numSub: function (_callback) {
this.num++;
if (this.num >= needData.length) {
if (typeof _callback === 'function') {
_callback();
}
} else {
this.getLoad(_callback);
}
},
getLoad: function (_callback) {
var self = this, str = needData[self.num];
if (str.indexOf(".js") >= 0) {
if ((str.indexOf('TweenMax') >= 0 && TweenMax) || (str.indexOf('motion.js') >= 0 && Motion)) {
self.numSub(_callback)
} else {
$.getScript(str, function () {
self.numSub(_callback)
})
}
}
}
};
var callback = function () {
Motion.motionVideo.init()
},
scripts = document.getElementsByTagName("script"),
urlData = [];
for (var i = 0; i < scripts.length; i++) {
var sc = scripts[i].src, str = sc.split('?')[1];
if (sc.indexOf('motionDemoLoad.js') >= 0 && str) {
var d = str.split('&');
urlData = d.map(function (s) {
return {name: s.split('=')[0], param: s.split('=')[1]};
});
}
}
urlData.map(function (m) {
if (m.param === 'easing') {
callback = function () {
new Motion("#J-Linear", {
lineData: [{stroke: "#f2666c"}, {
stroke: "#71B5DE",
openEaseName: "easeInOutQuad",
endEaseName: "easeInOutQuad"
}], mask: false
});
new Motion("#J-Symmetric", {
lineData: [
{openEaseName: "easeInOutQuad", endEaseName: "null", stroke: "#f2666c"},
{stroke: "#71B5DE", openEaseName: "easeInOutCubic", endEaseName: "easeInOutCubic"}],
mask: false, exposure: "top"
});
new Motion("#J-Entry", {
lineData: [
{openEaseName: "easeOutQuad", endEaseName: "easeOutQuad", stroke: "#f2666c"},
{stroke: "#71B5DE", openEaseName: "easeOutCubic", endEaseName: "easeInCubic"}],
mask: true, exposure: "bottom"
});
new Motion("#J-Back", {
lineData: [
{openEaseName: "easeOutBounce", endEaseName: "easeOutElastic", stroke: "#70f266"},
{stroke: "#71B5DE", openEaseName: "easeOutBack", endEaseName: "easeInOutBack"}],
mask: false, exposure: "top"
});
}
}
});
loadFunc.getLoad(callback);
});
+1 -1
View File
@@ -6,7 +6,7 @@
position: absolute;
left: -9999px;
top: -9999px;
z-index: 1000;
z-index: 1070;
}
.@{calendar-prefix-cls}-picker {
+1 -1
View File
@@ -3,7 +3,7 @@
.@{message-prefix-cls} {
font-size: 12px;
position: fixed;
z-index: 1000;
z-index: 1050;
width: 100%;
top: 16px;
+1 -2
View File
@@ -153,8 +153,7 @@
}
&-inner {
padding: 6px 2px;
width: 100%;
padding: 6px;
min-width: 24px;
height: 24px;
font-size: @font-size-base;
-3
View File
@@ -79,6 +79,3 @@
margin-right: 0;
}
}
.zoom-tag-leave{
animation: zoomOut .3s @ease-in-out-circ;
}
+6
View File
@@ -16,6 +16,12 @@
.zoom-motion(zoom-left, antZoomLeft);
.zoom-motion(zoom-right, antZoomRight);
.zoom-tag-leave{
animation: antZoomOut .3s @ease-in-out-circ;
}
@keyframes antZoomIn {
0% {
opacity: 0;
+3 -3
View File
@@ -13,7 +13,7 @@ style - Ant Design
<link rel="icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="shortcut icon" href="https://t.alipayobjects.com/images/T1QUBfXo4fXXXXXXXX.png" type="image/x-icon">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta4.min.css">
<link rel="stylesheet" href="/dist/antd-0.9.1-beta6.min.css">
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script>
@@ -187,11 +187,11 @@ style - Ant Design
<script src="/static/script.js"></script>
<script>
window.antdVersion = {
latest: '0.9.1-beta4',
latest: '0.9.1-beta6',
stable: '0.9.0'
};
</script>
<script src="/dist/antd-0.9.1-beta4.min.js"></script>
<script src="/dist/antd-0.9.1-beta6.min.js"></script>
<script src="/dist/demo.js"></script>
<script>
window.require = function (path) {