-
Notifications
You must be signed in to change notification settings - Fork 3
/
nature-pull-refresh.css
121 lines (101 loc) · 5.05 KB
/
nature-pull-refresh.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
/**
* author: "oujizeng",
* license: "MIT",
* github: "https://github.com/yangyuji/native-pull-refresh",
* name: "nature-pull-refresh.js",
* version: "2.0.1"
*/
.pull-wrapper .pull-top {
margin-top: -50px;
height: 50px;
text-align: center;
line-height: 50px;
font-size: 14px;
color: #666;
z-index: 1;
}
.pull-wrapper .pull-top .pointer,
.pull-wrapper .pull-top .success {
display: inline-block;
margin-right: 5px;
}
.pull-wrapper .pull-top .pointer:before {
display: inline-block;
width: 16px;
height: 16px;
content: " ";
-webkit-animation: pull-loading 1.6s step-start infinite;
vertical-align: middle;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAMAAAC7IEhfAAABg1BMVEUAAAC9vcGpqayzs7bNzdGYmJuVlZjKys6bm5/Jyc2cnJ+cnJ/Kys3Ly8+cnJ/R0dWfn6PJyczDw8fIyMzR0dXIyMzExMeioqXLy8+oqKzNzdGzs7a2trmdnaCUlJevr7LHx8uXl5q2trmenqGwsLO2trqxsbWhoaSXl5qxsbS1tbmwsLSjo6eUlJe4uLucnJ+VlZjIyMzDw8eysragoKOXl5qVlZjR0dXR0dW2trqioqbCwsbR0dWjo6a2trqZmZyzs7agoKPR0dWjo6bCwsbQ0NSvr7LJyc2cnKDFxcm8vL+ZmZzOztHMzNC+vsKXl5uZmZyjo6a9vcGYmJyurrGtrbHOztK3t7ucnJ+urrGjo6fHx8uxsbTDw8etrbCkpKe4uLzBwcWxsbSbm564uLvExMjR0dWYmJuUlJiioqbNzdHDw8e7u7+oqKvIyMy3t7q1tbmwsLOurrKdnaCcnJ+pqazCwsa9vcHJyc3OztLMzNCXl5qqqq2hoaW+vsK+vsHIyMsWRiyNAAAAZnRSTlMA5uYS5uaBExMQEAwLAQH4+Pf2wYODg4BfSSAMAcHBwKqpg4KBf19fXCL49/f39fX05ubm5ubm5cTEw8G+vru4q6uqhX9+fn19WUpKSUlJSSQhHh739efl5eTkxsS3qKinpoeEWSQqdCoWAAACIElEQVQ4y7XT91faUBTA8RumEBKRLaAisrR171m3VVut3Xs3JVDCtnQI/dN783g5jDzHL35/5HzOveddTkDfA5PpIdwkUyZjgiuy7e3ZQO1XJvO7+cvBgY0B1yRpSWiHgrumuBmwV5KkQDs8rClKHwNuI1x0tKBjGmGEAYPqSE8LetWBQWDkQdgb1GCwr6b88wIrxyLKbYDn5DwRHDjt6AD2wfHhR4AF1JHawdWB5G3fIq53zStZ0un0uIXHeyxJ0hrQ3IryRsA1Plc2m93VILaQEsHq8Vg1aPV6rSAEZpCdn+/S1WnSYA90ZXVniVulf5CYWiDS0g19hM0cCqDFW6aYEJnL1/n0J8NT9/SrV12fHsOtdTr/hzR/CoxOuHq93mg0uBMwf6eZWZD7SeOugz9oHBybqTtmwSOOuiO4rfDgk/qDGzcmPnYenP8yWalURrphPJ/PT0RDoCWmXiIrl3UwWiggffE1DCT7AGHlAf3q5QKhy0ZQu0/YXFKEHr8fMUWxmBHCiVlC402IzDnCA4grF/K6BodKxbe4MhQdQxqnq51b5ONKXsjyXYB+g6Ef4FmpWEwANro5tmHsfPocwg8AhlzVAPC+VCrOhoDVjjrwDCCXq/7FQU9x5GeWO3PKsrwDGoQYjrwzyoBb6F7zLRh6hSM3GVAdmIQWhIQ6kgHXZXlFbIdhvNAQA9r9fjtQWG3efH/fCJdGz3N99OC6/gMPF6RsShfrcQAAAABJRU5ErkJggg==");
background-size: 100% 100%;
margin-bottom: 3px;
}
.pull-wrapper .pull-top .success:before {
display: inline-block;
width: 16px;
height: 16px;
content: " ";
vertical-align: middle;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAADDElEQVRYR71XS1LbQBDtNsw65AQhJwicIPgEMSfAOUHsBaNiRbJyaVgYTgCcIL5BzAmiGyS+AWzNp1NPNS3GY0mWZCqqYoGsmff69Z+p4zOZTPZ3dnY+4Pjz8/Pi7Ozsb5eruOkh59yBiJww8xERHZSdExGQmDHzrbU2a3L3RgIXFxdHInJORABu88yZ+cfp6em87lAlgel0urdcLq+ZeRBcsICFIjLv9Xr3ejlI4hsRwbf4y13jn7kx5ng8Ht+XESkl4P37M5B6wczDTdYoAAi9vLxcMvMn/w7u+FrmljUCHvw3Ee15q8ZJkly20V6/TdN0xMxT/z8U6MckVghA9sfHx1+wXEQeiGiYJMmsC3ikBgLzHRFlxph+6I4VAs45gH3xlh9vCx6SEBEYhmdure3rbwUBH+35RyLSWfYqtUJ3MHNf46kg4JxDunwmooW1dn8b2avOBhiZtfYQ3+UEUGSICIFHIbuuJMJYIqJDDbxI5dzFSgBR/u0trI/A1wxK0zTz6XllrR0pAZRQFI/85RtZjmuQ+zfhfc653FiU7SRJPioB2TbyY8vLwIERusFay+wLz59t/N8UHBgxHseMYvmRPr1eL6sqw23A9W7nXK44Ar6WQEiuTNIu4D7rXgnUucB3RLRVbSpFUHUFX3NBzCiWuoTEyBhzqz3Dy7oW7VWZFKpqjHnfKA1LSKCz5d2yKtprSvJ3ZsaAk1fclUKkuVl2uIREa3Ac0EIkIrdJkgxbl+I0TW+Y+aSt5XENEJHXUuzjQJtR0Si6VsQGzahoeP+tHTvnhkR0HVfceCBRFd6kKwaFp+i2RHRnrS0m7LWRbLlcat7fM/Nx00G0RnaAY9BB1iyMMQeVI5nOBhi7/QyHVyNr7VWXeIhkf8BSUzuUhpKJCKJdK2CjJUPPlywz2CcGjcZyvcSXWgypGNP0ybw6s3Af1D0RFvrlJFzd7owxg1aLSSh3yZLR1BsLERltmqw37oaKlqbpwC+m8eoVEgIoMmm2CVgPNSYQosA9T09PKxvy7u5uViVznWT/ANJlKIABQOzqAAAAAElFTkSuQmCC");
background-size: 100% 100%;
margin-bottom: 3px;
}
.pull-wrapper .pull-top .none {
display: none!important;
}
.pull-wrapper .pull-top .arrow {
width: 10px;
height: 20px;
display: inline-block;
vertical-align: middle;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAABQBAMAAAD8TNiNAAAAJ1BMVEUAAACqqqplZWVnZ2doaGhqampoaGhpaWlnZ2dmZmZlZWVmZmZnZ2duD78kAAAADHRSTlMAA6CYqZOlnI+Kg/B86E+1AAAAhklEQVQ4y+2LvQ3CQAxGLSHEBSg8AAX0jECTnhFosgcjZKr8StE3VHz5EkeRMkF0rzk/P58k9rgOW78j+TE99OoeKpEbCvcPVDJ0OvsJ9bQs6Jxs26h5HCrlr9w8vi8zHphfmI0fcvO/ZXJG8wDzcvDFO2Y/AJj9ADE7gXmlxFMIyVpJ7DECzC9J2EC2ECAAAAAASUVORK5CYII=");
background-size: 100% 100%;
margin-right: 6px;
margin-bottom: 3px;
}
.pull-wrapper .pull-top .up {
-webkit-transform: rotate(180deg);
-webkit-transition: -webkit-transform .5s;
}
.pull-wrapper .pull-top .down {
-webkit-transform: rotate(0deg);
-webkit-transition: -webkit-transform .5s;
}
@-webkit-keyframes pull-loading {
0% {
-webkit-transform: rotate(0deg);
}
8.333333333333332% {
-webkit-transform: rotate(30deg);
}
16.666666666666664% {
-webkit-transform: rotate(60deg);
}
25% {
-webkit-transform: rotate(90deg);
}
33.33333333333333% {
-webkit-transform: rotate(120deg);
}
41.66666666666667% {
-webkit-transform: rotate(150deg);
}
50% {
-webkit-transform: rotate(180deg);
}
58.333333333333336% {
-webkit-transform: rotate(210deg);
}
66.66666666666666% {
-webkit-transform: rotate(240deg);
}
75% {
-webkit-transform: rotate(270deg);
}
83.33333333333334% {
-webkit-transform: rotate(300deg);
}
91.66666666666666% {
-webkit-transform: rotate(330deg);
}
}