From 0651911ce70a314ce670d958366b011f04c5fdad Mon Sep 17 00:00:00 2001 From: wanlei Date: Fri, 3 Nov 2017 15:35:25 +0800 Subject: [PATCH 1/2] update: [Tooltip] receive updates --- components/style/mixins/motion.less | 11 ++++++ components/tooltip/style/index.less | 60 ----------------------------- components/tooltip/tooltip.vue | 29 +++++++------- components/util/util.js | 49 ++++++++++++----------- examples/tooltip.vue | 23 +++++------ utils/ant-transition.vue | 32 --------------- 6 files changed, 61 insertions(+), 143 deletions(-) delete mode 100644 utils/ant-transition.vue diff --git a/components/style/mixins/motion.less b/components/style/mixins/motion.less index 84b2c82eb..411143c7f 100644 --- a/components/style/mixins/motion.less +++ b/components/style/mixins/motion.less @@ -20,11 +20,22 @@ .motion-common-leave(@duration); animation-play-state: paused; } + .@{className}-enter-active, + .@{className}-appear-active { + animation-name: ~"@{keyframeName}In"; + animation-play-state: running; + .motion-common(@duration); + } .@{className}-enter.@{className}-enter-active, .@{className}-appear.@{className}-appear-active { animation-name: ~"@{keyframeName}In"; animation-play-state: running; } + .@{className}-leave-active { + animation-name: ~"@{keyframeName}Out"; + animation-play-state: running; + .motion-common(@duration); + } .@{className}-leave.@{className}-leave-active { animation-name: ~"@{keyframeName}Out"; animation-play-state: running; diff --git a/components/tooltip/style/index.less b/components/tooltip/style/index.less index a5377f0d3..dae1ed5bb 100644 --- a/components/tooltip/style/index.less +++ b/components/tooltip/style/index.less @@ -145,63 +145,3 @@ right: 16px; } } - - -/** -modified part ,remove these if needed - */ - -.vc-fade-enter-active, .vc-fade-leave-active { - transition: all 3s; -} -.vc-fade-enter, .vc-fade-leave-to /* .fade-leave-active in below version 2.1.8 */ { - opacity: 0; -} - -.box { - background: red; - width: 100px; - height: 100px; -} -.fade-enter { - opacity: 0; - animation-duration: 0.3s; - animation-fill-mode: both; - animation-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2); - animation-play-state: paused; -} - -.fade-leave { - animation-duration: 0.3s; - animation-fill-mode: both; - animation-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2); - animation-play-state: paused; -} - -.fade-enter.fade-enter-active { - animation-name: rcDialogFadeIn; - animation-play-state: running; -} - -.fade-leave.fade-leave-active { - animation-name: rcDialogFadeOut; - animation-play-state: running; -} - -@keyframes rcDialogFadeIn { - 0% { - opacity: 0; - } - 100% { - opacity: 1; - } -} - -@keyframes rcDialogFadeOut { - 0% { - opacity: 1; - } - 100% { - opacity: 0; - } -} diff --git a/components/tooltip/tooltip.vue b/components/tooltip/tooltip.vue index 2ca384638..33912bae6 100644 --- a/components/tooltip/tooltip.vue +++ b/components/tooltip/tooltip.vue @@ -1,13 +1,9 @@ diff --git a/components/util/util.js b/components/util/util.js index 6d0070323..bef8da463 100644 --- a/components/util/util.js +++ b/components/util/util.js @@ -1,40 +1,39 @@ -function getScroll(w, top) { - let ret = top ? w.pageYOffset : w.pageXOffset; - const method = top ? 'scrollTop' : 'scrollLeft'; +function getScroll (w, top) { + let ret = top ? w.pageYOffset : w.pageXOffset + const method = top ? 'scrollTop' : 'scrollLeft' if (typeof ret !== 'number') { - const d = w.document; + const d = w.document // ie6,7,8 standard mode - ret = d.documentElement[method]; + ret = d.documentElement[method] if (typeof ret !== 'number') { // quirks mode - ret = d.body[method]; + ret = d.body[method] } } - return ret; + return ret } -function getClientPosition(elem) { - let box; - let x; - let y; - const doc = elem.ownerDocument; - const body = doc.body; - const docElem = doc && doc.documentElement; - box = elem.getBoundingClientRect(); - x = box.left; - y = box.top; - x -= docElem.clientLeft || body.clientLeft || 0; - y -= docElem.clientTop || body.clientTop || 0; +function getClientPosition (elem) { + let x + let y + const doc = elem.ownerDocument + const body = doc.body + const docElem = doc && doc.documentElement + const box = elem.getBoundingClientRect() + x = box.left + y = box.top + x -= docElem.clientLeft || body.clientLeft || 0 + y -= docElem.clientTop || body.clientTop || 0 return { left: x, top: y, - }; + } } export const getOffsetLeft = (el) => { - const pos = getClientPosition(el); - const doc = el.ownerDocument; - const w = doc.defaultView || doc.parentWindow; - pos.left += getScroll(w); - return pos.left; + const pos = getClientPosition(el) + const doc = el.ownerDocument + const w = doc.defaultView || doc.parentWindow + pos.left += getScroll(w) + return pos.left } diff --git a/examples/tooltip.vue b/examples/tooltip.vue index 7b18f08b0..651957dbd 100644 --- a/examples/tooltip.vue +++ b/examples/tooltip.vue @@ -1,9 +1,11 @@ - - diff --git a/utils/ant-transition.vue b/utils/ant-transition.vue deleted file mode 100644 index e87ff117c..000000000 --- a/utils/ant-transition.vue +++ /dev/null @@ -1,32 +0,0 @@ - - - From 67b357893ab323955cd8b9c780edb6c6669f79bb Mon Sep 17 00:00:00 2001 From: wanlei Date: Fri, 3 Nov 2017 15:52:22 +0800 Subject: [PATCH 2/2] fix: [typo] case --- components/checkbox/{checkbox.vue => Checkbox.vue} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename components/checkbox/{checkbox.vue => Checkbox.vue} (100%) diff --git a/components/checkbox/checkbox.vue b/components/checkbox/Checkbox.vue similarity index 100% rename from components/checkbox/checkbox.vue rename to components/checkbox/Checkbox.vue