123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113 |
- @import '../style/themes/index.less';
- @keyframes text-animate-right {
- 33% {
- margin-left: -10 * @rpx;
- }
- 66% {
- margin-left: 10 * @rpx;
- }
- 100% {
- margin-left: 0 * @rpx;
- }
- }
- @keyframes text-animate-midd {
- 0% {
- margin-left: 44 * @rpx;
- }
- 100% {
- margin-left: 0 * @rpx;
- }
- }
- @keyframes text-animate-left {
- 33% {
- margin-left: 10 * @rpx;
- }
- 66% {
- margin-left: -10 * @rpx;
- }
- 100% {
- margin-left: 0 * @rpx;
- }
- }
- .text-move-right {
- animation-name: text-animate-right;
- animation-duration: 500ms;
- }
- .text-move-left {
- animation-name: text-animate-left;
- animation-duration: 500ms;
- }
- .text-move-midd {
- animation-name: text-animate-midd;
- animation-duration: 500ms;
- }
- .ant-swipe {
- width: 100%;
- height: 100%;
- overflow: hidden;
- &-action {
- height: 100%;
- position: relative;
- &-movable {
- width: 100%;
- height: 100%;
- &-content {
- height: 100%;
- position: relative;
- &-view {
- height: 100%;
- &-modal {
- width: 100%;
- height: 100%;
- background: transparent;
- position: absolute;
- left: 0;
- top: 0;
- z-index: 9;
- }
- }
- &-right {
- height: 100%;
- color: @COLOR_WHITE;
- &-text {
- height: 100%;
- display: flex;
- align-items: center;
- justify-content: center;
- transition: all 120ms cubic-bezier(0.2, 0.2, 0.8, 1);
- .right-text {
- text-align: center;
- white-space: nowrap;
- }
- }
- }
- &-left {
- position: absolute;
- right: 0;
- top: 0;
- color: @COLOR_WHITE;
- display: flex;
- flex-direction: row;
- justify-content: flex-end;
- &-text1 {
- height: 100%;
- display: flex;
- align-items: center;
- justify-content: flex-end;
- transition: all 120ms cubic-bezier(0.2, 0.2, 0.8, 1);
- .right-text {
- text-align: center;
- white-space: nowrap;
- }
- }
- }
- }
- }
- }
- }
- .ant-swipe-action-is-right-swipe {
- display: flex;
- flex-direction: row;
- justify-content: flex-end;
- }
|