ant-design-vue/components/style/core/motion/slide.less

140 lines
2.5 KiB
Plaintext
Raw Normal View History

2017-10-26 07:18:08 +00:00
.slide-motion(@className, @keyframeName) {
refactor: Anchor、Alert、Avatar、Badge、BackTop、Col、Form、Layout、Menu、Space、Spin、Switch、Row、Result、Rate (#4171) * chore: remove resize-observer-polyfill * refactor: align * refactor(v3/avatar): refactor using composition api (#4052) * refactor(avatar): refactor using composition api * refactor: update props define * fix: avatar src scale not update * refactor: resizeObserver * refactor: divider * refactor: localeProvider * refactor(v3/back-top): use composition api (#4060) * refactor: backtop * refactor: empty * refactor: transButton * feat(v3/avatar): add avatar group (#4062) * feat(avatar): add avatar group * refactor: update * refactor: update Co-authored-by: tangjinzhou <415800467@qq.com> * refactor: avatar * refactor: avatar * style: rename useProvide * refactor: menu (#4110) * fix: menu * refactor: menu * refactor: remove rc-menu * fix: menu rtl error * style: lint * refactor(Anchor): use composition api (#4054) * refactor: anchor * refactor: anchor * refactor: anchor * feat: update * fix: icon class lose * refactor(v3/badge): use composition api (#4076) * refactor: badge * fix: badge inheritAttrs * refactor: grid * refactor: layout * fix: menu not close * refactor: space * refactor: result * refactor: affix * refactor: comment * refactor: form * feat: spin add rtl * feat: export spin type * refactor: pageHeader * refactor: page-header * refactor: skeleton * refactor: typography * refactor(v3/rate): use composition api * fix: add useRef hook * refactor: form * fix: menu not update * refactor: form * refactor: form * fix: slide animate not work * fix: menu mode error * fix: menu icon * refactor: rate * perf: remove rate * feat: add vc-overflow * refactor: menu * fix: remove flex check (#4165) * fix: dist locale file lose #3684 * release 2.2.0-beta.1 * dcos: update changelog * chore: update type * docs: update changelog Co-authored-by: John <John60676@qq.com> Co-authored-by: 言肆 <18x@loacg.com> Co-authored-by: zkwolf <chenhao5866@gmail.com>
2021-06-07 09:35:03 +00:00
@name: ~'@{ant-prefix}-@{className}';
.make-motion(@name, @keyframeName);
.@{name}-enter,
.@{name}-appear {
2017-10-26 07:18:08 +00:00
opacity: 0;
animation-timing-function: @ease-out-quint;
}
refactor: Anchor、Alert、Avatar、Badge、BackTop、Col、Form、Layout、Menu、Space、Spin、Switch、Row、Result、Rate (#4171) * chore: remove resize-observer-polyfill * refactor: align * refactor(v3/avatar): refactor using composition api (#4052) * refactor(avatar): refactor using composition api * refactor: update props define * fix: avatar src scale not update * refactor: resizeObserver * refactor: divider * refactor: localeProvider * refactor(v3/back-top): use composition api (#4060) * refactor: backtop * refactor: empty * refactor: transButton * feat(v3/avatar): add avatar group (#4062) * feat(avatar): add avatar group * refactor: update * refactor: update Co-authored-by: tangjinzhou <415800467@qq.com> * refactor: avatar * refactor: avatar * style: rename useProvide * refactor: menu (#4110) * fix: menu * refactor: menu * refactor: remove rc-menu * fix: menu rtl error * style: lint * refactor(Anchor): use composition api (#4054) * refactor: anchor * refactor: anchor * refactor: anchor * feat: update * fix: icon class lose * refactor(v3/badge): use composition api (#4076) * refactor: badge * fix: badge inheritAttrs * refactor: grid * refactor: layout * fix: menu not close * refactor: space * refactor: result * refactor: affix * refactor: comment * refactor: form * feat: spin add rtl * feat: export spin type * refactor: pageHeader * refactor: page-header * refactor: skeleton * refactor: typography * refactor(v3/rate): use composition api * fix: add useRef hook * refactor: form * fix: menu not update * refactor: form * refactor: form * fix: slide animate not work * fix: menu mode error * fix: menu icon * refactor: rate * perf: remove rate * feat: add vc-overflow * refactor: menu * fix: remove flex check (#4165) * fix: dist locale file lose #3684 * release 2.2.0-beta.1 * dcos: update changelog * chore: update type * docs: update changelog Co-authored-by: John <John60676@qq.com> Co-authored-by: 言肆 <18x@loacg.com> Co-authored-by: zkwolf <chenhao5866@gmail.com>
2021-06-07 09:35:03 +00:00
.@{name}-leave {
2017-10-26 07:18:08 +00:00
animation-timing-function: @ease-in-quint;
}
}
refactor: Anchor、Alert、Avatar、Badge、BackTop、Col、Form、Layout、Menu、Space、Spin、Switch、Row、Result、Rate (#4171) * chore: remove resize-observer-polyfill * refactor: align * refactor(v3/avatar): refactor using composition api (#4052) * refactor(avatar): refactor using composition api * refactor: update props define * fix: avatar src scale not update * refactor: resizeObserver * refactor: divider * refactor: localeProvider * refactor(v3/back-top): use composition api (#4060) * refactor: backtop * refactor: empty * refactor: transButton * feat(v3/avatar): add avatar group (#4062) * feat(avatar): add avatar group * refactor: update * refactor: update Co-authored-by: tangjinzhou <415800467@qq.com> * refactor: avatar * refactor: avatar * style: rename useProvide * refactor: menu (#4110) * fix: menu * refactor: menu * refactor: remove rc-menu * fix: menu rtl error * style: lint * refactor(Anchor): use composition api (#4054) * refactor: anchor * refactor: anchor * refactor: anchor * feat: update * fix: icon class lose * refactor(v3/badge): use composition api (#4076) * refactor: badge * fix: badge inheritAttrs * refactor: grid * refactor: layout * fix: menu not close * refactor: space * refactor: result * refactor: affix * refactor: comment * refactor: form * feat: spin add rtl * feat: export spin type * refactor: pageHeader * refactor: page-header * refactor: skeleton * refactor: typography * refactor(v3/rate): use composition api * fix: add useRef hook * refactor: form * fix: menu not update * refactor: form * refactor: form * fix: slide animate not work * fix: menu mode error * fix: menu icon * refactor: rate * perf: remove rate * feat: add vc-overflow * refactor: menu * fix: remove flex check (#4165) * fix: dist locale file lose #3684 * release 2.2.0-beta.1 * dcos: update changelog * chore: update type * docs: update changelog Co-authored-by: John <John60676@qq.com> Co-authored-by: 言肆 <18x@loacg.com> Co-authored-by: zkwolf <chenhao5866@gmail.com>
2021-06-07 09:35:03 +00:00
.slide-motion-legacy(@className, @keyframeName) {
@name: ~'@{className}';
.make-motion(@name, @keyframeName);
.@{name}-enter,
.@{name}-appear {
opacity: 0;
animation-timing-function: @ease-out-quint;
}
.@{name}-leave {
animation-timing-function: @ease-in-quint;
}
}
.slide-motion-legacy(slide-up, antSlideUp);
.slide-motion-legacy(slide-down, antSlideDown);
.slide-motion-legacy(slide-left, antSlideLeft);
.slide-motion-legacy(slide-right, antSlideRight);
2017-10-26 07:18:08 +00:00
.slide-motion(slide-up, antSlideUp);
.slide-motion(slide-down, antSlideDown);
.slide-motion(slide-left, antSlideLeft);
.slide-motion(slide-right, antSlideRight);
@keyframes antSlideUpIn {
0% {
2019-01-02 13:01:56 +00:00
transform: scaleY(0.8);
2019-03-07 01:37:54 +00:00
transform-origin: 0% 0%;
opacity: 0;
2017-10-26 07:18:08 +00:00
}
100% {
transform: scaleY(1);
2019-03-07 01:37:54 +00:00
transform-origin: 0% 0%;
opacity: 1;
2017-10-26 07:18:08 +00:00
}
}
@keyframes antSlideUpOut {
0% {
transform: scaleY(1);
2019-03-07 01:37:54 +00:00
transform-origin: 0% 0%;
opacity: 1;
2017-10-26 07:18:08 +00:00
}
100% {
2019-01-02 13:01:56 +00:00
transform: scaleY(0.8);
2019-03-07 01:37:54 +00:00
transform-origin: 0% 0%;
opacity: 0;
2017-10-26 07:18:08 +00:00
}
}
@keyframes antSlideDownIn {
0% {
2019-01-02 13:01:56 +00:00
transform: scaleY(0.8);
2019-03-07 01:37:54 +00:00
transform-origin: 100% 100%;
opacity: 0;
2017-10-26 07:18:08 +00:00
}
100% {
transform: scaleY(1);
2019-03-07 01:37:54 +00:00
transform-origin: 100% 100%;
opacity: 1;
2017-10-26 07:18:08 +00:00
}
}
@keyframes antSlideDownOut {
0% {
transform: scaleY(1);
2019-03-07 01:37:54 +00:00
transform-origin: 100% 100%;
opacity: 1;
2017-10-26 07:18:08 +00:00
}
100% {
2019-01-02 13:01:56 +00:00
transform: scaleY(0.8);
2019-03-07 01:37:54 +00:00
transform-origin: 100% 100%;
opacity: 0;
2017-10-26 07:18:08 +00:00
}
}
@keyframes antSlideLeftIn {
0% {
2019-01-02 13:01:56 +00:00
transform: scaleX(0.8);
2019-03-07 01:37:54 +00:00
transform-origin: 0% 0%;
opacity: 0;
2017-10-26 07:18:08 +00:00
}
100% {
transform: scaleX(1);
2019-03-07 01:37:54 +00:00
transform-origin: 0% 0%;
opacity: 1;
2017-10-26 07:18:08 +00:00
}
}
@keyframes antSlideLeftOut {
0% {
transform: scaleX(1);
2019-03-07 01:37:54 +00:00
transform-origin: 0% 0%;
opacity: 1;
2017-10-26 07:18:08 +00:00
}
100% {
2019-01-02 13:01:56 +00:00
transform: scaleX(0.8);
2019-03-07 01:37:54 +00:00
transform-origin: 0% 0%;
opacity: 0;
2017-10-26 07:18:08 +00:00
}
}
@keyframes antSlideRightIn {
0% {
2019-01-02 13:01:56 +00:00
transform: scaleX(0.8);
2019-03-07 01:37:54 +00:00
transform-origin: 100% 0%;
opacity: 0;
2017-10-26 07:18:08 +00:00
}
100% {
transform: scaleX(1);
2019-03-07 01:37:54 +00:00
transform-origin: 100% 0%;
opacity: 1;
2017-10-26 07:18:08 +00:00
}
}
@keyframes antSlideRightOut {
0% {
transform: scaleX(1);
2019-03-07 01:37:54 +00:00
transform-origin: 100% 0%;
opacity: 1;
2017-10-26 07:18:08 +00:00
}
100% {
2019-01-02 13:01:56 +00:00
transform: scaleX(0.8);
2019-03-07 01:37:54 +00:00
transform-origin: 100% 0%;
opacity: 0;
2017-10-26 07:18:08 +00:00
}
}