Browse Source

chore: adjust coding style, delete useless less, modify md files.

pull/38/head
玄寂 10 years ago
committed by 翰文
parent
commit
69c2a4c277
  1. 22
      components/message/demo/costomTime.md
  2. 2
      components/message/demo/error.md
  3. 6
      components/message/demo/info.md
  4. 33
      components/message/index.jsx
  5. 2
      components/message/index.md
  6. 44
      style/components/message.less

22
components/message/demo/costomTime.md

@ -0,0 +1,22 @@
# 基本
- order: 4
全局提示 - 操作成功提示,并自定义时长10s,默认时长2.5s
---
````jsx
var message = antd.message;
var success = function(){
message.success('这是一条成功的提示,并将于10秒后消失',10);
}
React.render(
<button className="ant-btn ant-btn-primary" onClick={success} >(自定义时长)显示成功提示</button>, document.getElementById('components-message-demo-costomtime')
);
````

2
components/message/demo/error.md

@ -2,7 +2,7 @@
- order: 1
全局提示 - 操作警告
全局提示 - 操作失败
---

6
components/message/demo/info.md

@ -2,7 +2,7 @@
- order: 2
全局提示 - 需求帮助
全局提示 - 提醒
---
@ -10,11 +10,11 @@
var message = antd.message;
var info = function(){
message.info('这是一条普通的提');
message.info('这是一条普通的提');
}
React.render(
<button className="ant-btn ant-btn-primary" onClick={info} >显示普通提</button>, document.getElementById('components-message-demo-info')
<button className="ant-btn ant-btn-primary" onClick={info} >显示普通提</button>, document.getElementById('components-message-demo-info')
);
````

33
components/message/index.jsx

@ -19,50 +19,59 @@ var getMessageInstance = function(){
module.exports = {
info: function(m) {
info: function(m, t) {
if (!message) {
message = getMessageInstance();
}
t = t || 2.5;
message.notice({
key: 'simpleMessage',
duration: 2.5,
duration: t,
style: {
left: '50%'
},
content: <div className='ant-message-custom-content'><i className='anticon anticon-info-circle ant-message-info'></i><span>{m}</span></div>
content: <div className='ant-message-custom-content'>
<i className='anticon anticon-info-circle ant-message-info'></i>
<span>{m}</span>
</div>
});
},
success: function(m) {
success: function(m, t) {
if (!message) {
message = getMessageInstance();
}
t = t || 2.5;
message.notice({
key: 'simpleMessage1',
transitionName: 'move-up',
duration: 2.5,
duration: t,
style: {
left: '50%'
},
content: <div className='ant-message-custom-content'><i className='anticon anticon-check-circle ant-message-success'></i><span>{m}</span></div>
content: <div className='ant-message-custom-content'>
<i className='anticon anticon-check-circle ant-message-success'></i>
<span>{m}</span>
</div>
});
},
error: function(m) {
error: function(m, t) {
if (!message) {
message = getMessageInstance();
}
t = t || 2.5;
message.notice({
key: 'simpleMessage2',
transitionName: 'move-up',
duration: 2.5,
duration: t,
style: {
left: '50%'
},
content: <div className='ant-message-custom-content'><i className='anticon anticon-exclamation-circle ant-message-error'></i><span>{m}</span></div>
content: <div className='ant-message-custom-content'>
<i className='anticon anticon-exclamation-circle ant-message-error'></i>
<span>{m}</span>
</div>
});
}
};

2
components/message/index.md

@ -2,7 +2,7 @@
- category: Components
- chinese: 全局提示
- order: 3
- order: 4
---

44
style/components/message.less

@ -49,48 +49,4 @@
margin-right: 8px;
}
.fade-effect() {
animation-duration: 0.3s;
animation-fill-mode: both;
animation-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2);
}
&-fade-enter {
opacity: 0;
.fade-effect();
animation-play-state: paused;
}
&-fade-leave {
.fade-effect();
animation-play-state: paused;
}
&-fade-enter&-fade-enter-active {
animation-name: rcNotificationFadeIn;
animation-play-state: running;
}
&-fade-leave&-fade-leave-active {
animation-name: rcDialogFadeOut;
animation-play-state: running;
}
@keyframes rcNotificationFadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes rcDialogFadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
}

Loading…
Cancel
Save