|
1
|
.float-layer {
|
1
|
.float-layer {
|
|
2
|
- height: 44px;
|
2
|
+ height: 88px;
|
|
3
|
background: rgba(68, 68, 68, 0.95);
|
3
|
background: rgba(68, 68, 68, 0.95);
|
|
4
|
position: fixed;
|
4
|
position: fixed;
|
|
5
|
width: 100%;
|
5
|
width: 100%;
|
|
6
|
bottom: 0;
|
6
|
bottom: 0;
|
|
7
|
left: 0;
|
7
|
left: 0;
|
|
8
|
z-index: 9999;
|
8
|
z-index: 9999;
|
|
9
|
- padding: 10px 0;
|
9
|
+ padding: 20px 0;
|
|
10
|
|
10
|
|
|
11
|
.float-layer-left {
|
11
|
.float-layer-left {
|
|
12
|
- padding-left: 22px;
|
12
|
+ padding-left: 44px;
|
|
13
|
overflow: hidden;
|
13
|
overflow: hidden;
|
|
14
|
float: left;
|
14
|
float: left;
|
|
15
|
|
15
|
|
|
16
|
img {
|
16
|
img {
|
|
17
|
- height: 44px;
|
17
|
+ height: 88px;
|
|
18
|
float: left;
|
18
|
float: left;
|
|
19
|
- margin-right: 10px;
|
19
|
+ margin-right: 20px;
|
|
20
|
}
|
20
|
}
|
|
21
|
|
21
|
|
|
22
|
p {
|
22
|
p {
|
|
23
|
float: left;
|
23
|
float: left;
|
|
24
|
- font-size: 16px;
|
|
|
|
25
|
- height: 44px;
|
|
|
|
26
|
- line-height: 44px;
|
24
|
+ font-size: 32px;
|
|
|
|
25
|
+ height: 88px;
|
|
|
|
26
|
+ line-height: 88px;
|
|
27
|
color: white;
|
27
|
color: white;
|
|
28
|
}
|
28
|
}
|
|
29
|
|
29
|
|
|
30
|
.yoho-icon {
|
30
|
.yoho-icon {
|
|
31
|
float: left;
|
31
|
float: left;
|
|
32
|
- margin-right: 10px;
|
|
|
|
33
|
- font-size: 22px;
|
|
|
|
34
|
- line-height: 44px;
|
|
|
|
35
|
- width: 44px;
|
|
|
|
36
|
- height: 44px;
|
32
|
+ margin-right: 20px;
|
|
|
|
33
|
+ font-size: 44px;
|
|
|
|
34
|
+ line-height: 88px;
|
|
|
|
35
|
+ width: 88px;
|
|
|
|
36
|
+ height: 88px;
|
|
37
|
text-align: center;
|
37
|
text-align: center;
|
|
38
|
color: #fff;
|
38
|
color: #fff;
|
|
39
|
- border-radius: 10px;
|
39
|
+ border-radius: 20px;
|
|
40
|
background-image: linear-gradient(#323232, #0f0f0f);
|
40
|
background-image: linear-gradient(#323232, #0f0f0f);
|
|
41
|
}
|
41
|
}
|
|
42
|
}
|
42
|
}
|
|
@@ -47,8 +47,8 @@ |
|
@@ -47,8 +47,8 @@ |
|
47
|
position: absolute;
|
47
|
position: absolute;
|
|
48
|
left: 0;
|
48
|
left: 0;
|
|
49
|
top: 0;
|
49
|
top: 0;
|
|
50
|
- width: 50px;
|
|
|
|
51
|
- height: 50px;
|
50
|
+ width: 100px;
|
|
|
|
51
|
+ height: 100px;
|
|
52
|
|
52
|
|
|
53
|
.close-icon {
|
53
|
.close-icon {
|
|
54
|
position: absolute;
|
54
|
position: absolute;
|
|
@@ -62,14 +62,14 @@ |
|
@@ -62,14 +62,14 @@ |
|
62
|
#float-layer-btn {
|
62
|
#float-layer-btn {
|
|
63
|
position: absolute;
|
63
|
position: absolute;
|
|
64
|
top: 50%;
|
64
|
top: 50%;
|
|
65
|
- right: 15px;
|
|
|
|
66
|
- font-size: 16px;
|
|
|
|
67
|
- padding: 0 10px;
|
|
|
|
68
|
- height: 27px;
|
|
|
|
69
|
- line-height: 27px;
|
65
|
+ right: 30px;
|
|
|
|
66
|
+ font-size: 32px;
|
|
|
|
67
|
+ padding: 0 20px;
|
|
|
|
68
|
+ height: 54px;
|
|
|
|
69
|
+ line-height: 54px;
|
|
70
|
background: white;
|
70
|
background: white;
|
|
71
|
- border-radius: 5px;
|
|
|
|
72
|
- margin-top: -13px;
|
71
|
+ border-radius: 10px;
|
|
|
|
72
|
+ margin-top: -26px;
|
|
73
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0.5);
|
73
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0.5);
|
|
74
|
&:link,
|
74
|
&:link,
|
|
75
|
&:visited,
|
75
|
&:visited,
|
|
@@ -82,11 +82,9 @@ |
|
@@ -82,11 +82,9 @@ |
|
82
|
.circle-rightbottom {
|
82
|
.circle-rightbottom {
|
|
83
|
position: absolute;
|
83
|
position: absolute;
|
|
84
|
|
84
|
|
|
85
|
- width: 25px;
|
85
|
+ width: 50px;
|
|
86
|
height: 0px;
|
86
|
height: 0px;
|
|
87
|
border:0 solid #323232;
|
87
|
border:0 solid #323232;
|
|
88
|
- border-bottom:25px solid #323232;
|
|
|
|
89
|
- -moz-border-radius:0 0 25px 0;
|
|
|
|
90
|
- -webkit-border-radius:0 0 25px 0;
|
|
|
|
91
|
- border-radius:0 0 25px 0;
|
88
|
+ border-bottom:50px solid #323232;
|
|
|
|
89
|
+ border-radius:0 0 50px 0;
|
|
92
|
} |
90
|
} |
