@fonixtree/magic-design 1.0.71 → 1.0.74

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (63) hide show
  1. package/es/composite-comp/bol/components/Banner/mobile/index.js +4 -2
  2. package/es/composite-comp/bol/components/Banner/mobile/index.less +52 -78
  3. package/es/composite-comp/bol/components/Carousel/mobile/index.less +81 -100
  4. package/es/composite-comp/bol/components/ImageGallery/mobile/index.less +15 -22
  5. package/es/composite-comp/bol/components/ImageText/mobile/index.less +233 -292
  6. package/es/composite-comp/bol/components/Video/mobile/Layout1/index.less +21 -27
  7. package/es/composite-comp/bol/components/Video/mobile/Layout2/index.less +36 -45
  8. package/es/composite-comp/bol/components/Video/mobile/Layout3/index.less +43 -54
  9. package/es/composite-comp/bol/components/Video/mobile/index.less +2 -3
  10. package/es/composite-comp/bol/components/Wallet/mobile/index.less +103 -130
  11. package/es/composite-comp/bol/components/WalletNuri/mobile/index.less +19 -20
  12. package/es/composite-comp/dito/components/AffiliateRecommend/mobile/index.less +81 -111
  13. package/es/composite-comp/dito/components/CommonFunctions/mobile/index.js +7 -1
  14. package/es/composite-comp/dito/components/CommonFunctions/mobile/index.less +27 -35
  15. package/es/composite-comp/dito/components/FlashDeal/mobile/index.js +8 -1
  16. package/es/composite-comp/dito/components/FlashDeal/mobile/index.less +83 -97
  17. package/es/composite-comp/dito/components/HeadNavigation/mobile/index.less +32 -34
  18. package/es/composite-comp/dito/components/MenuNavigation/mobile/index.less +4 -4
  19. package/es/composite-comp/dito/components/MobileNavigation/mobile/index.js +11 -0
  20. package/es/composite-comp/dito/components/MobileNavigation/mobile/index.less +18 -35
  21. package/es/composite-comp/dito/components/Orders/mobile/index.js +6 -1
  22. package/es/composite-comp/dito/components/Orders/mobile/index.less +85 -92
  23. package/es/composite-comp/dito/components/PersonalInformation/mobile/index.js +6 -1
  24. package/es/composite-comp/dito/components/PersonalInformation/mobile/index.less +133 -155
  25. package/es/composite-comp/dito/components/Recommend/mobile/index.js +4 -2
  26. package/es/composite-comp/dito/components/Recommend/mobile/index.less +73 -86
  27. package/es/composite-comp/dito/components/SearchBar/mobile/index.js +13 -1
  28. package/es/composite-comp/dito/components/SearchBar/mobile/index.less +45 -52
  29. package/es/composite-comp/dito/components/SignBoard/mobile/index.less +62 -66
  30. package/es/utils/commonUtil.js +6 -4
  31. package/es/utils/coreUtil.js +2 -8
  32. package/lib/composite-comp/bol/components/Banner/mobile/index.js +4 -2
  33. package/lib/composite-comp/bol/components/Banner/mobile/index.less +52 -78
  34. package/lib/composite-comp/bol/components/Carousel/mobile/index.less +81 -100
  35. package/lib/composite-comp/bol/components/ImageGallery/mobile/index.less +15 -22
  36. package/lib/composite-comp/bol/components/ImageText/mobile/index.less +233 -292
  37. package/lib/composite-comp/bol/components/Video/mobile/Layout1/index.less +21 -27
  38. package/lib/composite-comp/bol/components/Video/mobile/Layout2/index.less +36 -45
  39. package/lib/composite-comp/bol/components/Video/mobile/Layout3/index.less +43 -54
  40. package/lib/composite-comp/bol/components/Video/mobile/index.less +2 -3
  41. package/lib/composite-comp/bol/components/Wallet/mobile/index.less +103 -130
  42. package/lib/composite-comp/bol/components/WalletNuri/mobile/index.less +19 -20
  43. package/lib/composite-comp/dito/components/AffiliateRecommend/mobile/index.less +81 -111
  44. package/lib/composite-comp/dito/components/CommonFunctions/mobile/index.js +7 -1
  45. package/lib/composite-comp/dito/components/CommonFunctions/mobile/index.less +27 -35
  46. package/lib/composite-comp/dito/components/FlashDeal/mobile/index.js +8 -1
  47. package/lib/composite-comp/dito/components/FlashDeal/mobile/index.less +83 -97
  48. package/lib/composite-comp/dito/components/HeadNavigation/mobile/index.less +32 -34
  49. package/lib/composite-comp/dito/components/MenuNavigation/mobile/index.less +4 -4
  50. package/lib/composite-comp/dito/components/MobileNavigation/mobile/index.js +11 -0
  51. package/lib/composite-comp/dito/components/MobileNavigation/mobile/index.less +18 -35
  52. package/lib/composite-comp/dito/components/Orders/mobile/index.js +6 -1
  53. package/lib/composite-comp/dito/components/Orders/mobile/index.less +85 -92
  54. package/lib/composite-comp/dito/components/PersonalInformation/mobile/index.js +6 -1
  55. package/lib/composite-comp/dito/components/PersonalInformation/mobile/index.less +133 -155
  56. package/lib/composite-comp/dito/components/Recommend/mobile/index.js +4 -2
  57. package/lib/composite-comp/dito/components/Recommend/mobile/index.less +73 -86
  58. package/lib/composite-comp/dito/components/SearchBar/mobile/index.js +13 -1
  59. package/lib/composite-comp/dito/components/SearchBar/mobile/index.less +45 -52
  60. package/lib/composite-comp/dito/components/SignBoard/mobile/index.less +62 -66
  61. package/lib/utils/commonUtil.js +6 -4
  62. package/lib/utils/coreUtil.js +2 -8
  63. package/package.json +1 -1
@@ -1,157 +1,135 @@
1
1
  .personal-information-mobile {
2
- height: 162px;
3
- padding: 16px;
2
+ height: 3.24rem;
3
+ padding: 0.32rem;
4
4
  box-sizing: border-box;
5
-
6
- .top {
7
- display: flex;
8
- justify-content: space-between;
9
- align-items: flex-start;
10
-
11
- .pInfoWrap {
12
- display: flex;
13
- align-items: center;
14
-
15
- .photoWrap {
16
- position: relative;
17
- display: inline-block;
18
- vertical-align: middle;
19
- margin-right: 15px;
20
- height: 44px;
21
- width: 44px;
22
-
23
- &>input {
24
- position: absolute;
25
- z-index: 1;
26
- top: 0;
27
- left: 0;
28
- width: 100%;
29
- height: 100%;
30
- opacity: 0;
31
- }
32
- }
33
-
34
- .userInfo {
35
- display: inline-block;
36
- vertical-align: middle;
37
-
38
- p {
39
- margin: 0;
40
- }
41
-
42
- .name {
43
- font-size: 14px;
44
- font-weight: 500;
45
- color: #ffffff;
46
- max-width: 148px;
47
- overflow: hidden;
48
- white-space: nowrap;
49
- text-overflow: ellipsis;
50
- overflow: hidden;
51
- word-break: break-all;
52
- }
53
-
54
- .phone {
55
- font-size: 14px;
56
- font-weight: 400;
57
- color: #ffffff;
58
- margin-top: 5px;
59
- }
60
- }
61
-
62
- .photo {
63
- display: inline-block;
64
- width: 44px;
65
- height: 44px;
66
- line-height: 60px;
67
- text-align: center;
68
- background: #7b7b7b;
69
- margin-right: 15px;
70
- border-radius: 50%;
71
- }
72
-
73
- .btnLogin {
74
- font-size: 14px;
75
- font-weight: 400;
76
- color: #ffffff;
77
- font-family: Montserrat;
78
- }
79
- }
80
-
81
- .btnGroup {
82
- .iconWrap {
83
- display: inline-block;
84
- margin-left: 15px;
85
- position: relative;
86
- }
87
-
88
- .num {
89
- position: absolute;
90
- top: -2px;
91
- left: 14px;
92
- display: inline-block;
93
- padding: 0 4px;
94
- border-radius: 50%;
95
- text-align: center;
96
- min-width: 16px;
97
- height: 16px;
98
- line-height: 16px;
99
- background: #ce1126;
100
- font-size: 6px;
101
- color: #ffffff;
102
- }
103
- }
104
- }
105
-
106
- .bottom {
107
- display: flex;
108
- flex-direction: row;
109
- justify-content: space-around;
110
- width: 100%;
111
- margin-top: 24px;
112
-
113
- .item {
114
- display: flex;
115
- flex-direction: column;
116
- justify-content: flex-start;
117
- align-items: center;
118
- flex: 1;
119
- position: relative;
120
-
121
- &:after {
122
- content: '';
123
- display: inline-block;
124
- width: 1px;
125
- height: 45px;
126
- position: absolute;
127
- right: 0;
128
- top: 6px;
129
- background: #ccc;
130
- }
131
-
132
- &:last-child {
133
- &:after {
134
- display: none;
135
- }
136
- }
137
-
138
- .number {
139
- width: 70% !important;
140
- font-size: 18px;
141
- font-weight: 600;
142
- color: #ffffff;
143
- text-align: center;
144
- }
145
-
146
- .title {
147
- width: 70% !important;
148
- font-size: 12px;
149
- font-weight: 400;
150
- color: #ffffff;
151
- line-height: 16px;
152
- text-align: center;
153
- }
154
- }
155
- }
156
-
157
- }
5
+ }
6
+ .personal-information-mobile .top {
7
+ display: flex;
8
+ justify-content: space-between;
9
+ align-items: flex-start;
10
+ }
11
+ .personal-information-mobile .top .pInfoWrap {
12
+ display: flex;
13
+ align-items: center;
14
+ }
15
+ .personal-information-mobile .top .pInfoWrap .photoWrap {
16
+ position: relative;
17
+ display: inline-block;
18
+ vertical-align: middle;
19
+ margin-right: 0.3rem;
20
+ height: 0.88rem;
21
+ width: 0.88rem;
22
+ }
23
+ .personal-information-mobile .top .pInfoWrap .photoWrap > input {
24
+ position: absolute;
25
+ z-index: 1;
26
+ top: 0;
27
+ left: 0;
28
+ width: 100%;
29
+ height: 100%;
30
+ opacity: 0;
31
+ }
32
+ .personal-information-mobile .top .pInfoWrap .userInfo {
33
+ display: inline-block;
34
+ vertical-align: middle;
35
+ }
36
+ .personal-information-mobile .top .pInfoWrap .userInfo p {
37
+ margin: 0;
38
+ }
39
+ .personal-information-mobile .top .pInfoWrap .userInfo .name {
40
+ font-size: 0.28rem;
41
+ font-weight: 500;
42
+ color: #ffffff;
43
+ max-width: 2.96rem;
44
+ white-space: nowrap;
45
+ text-overflow: ellipsis;
46
+ overflow: hidden;
47
+ word-break: break-all;
48
+ }
49
+ .personal-information-mobile .top .pInfoWrap .userInfo .phone {
50
+ font-size: 0.28rem;
51
+ font-weight: 400;
52
+ color: #ffffff;
53
+ margin-top: 0.1rem;
54
+ }
55
+ .personal-information-mobile .top .pInfoWrap .photo {
56
+ display: inline-block;
57
+ width: 0.88rem;
58
+ height: 0.88rem;
59
+ line-height: 1.2rem;
60
+ text-align: center;
61
+ background: #7b7b7b;
62
+ margin-right: 0.3rem;
63
+ border-radius: 50%;
64
+ }
65
+ .personal-information-mobile .top .pInfoWrap .btnLogin {
66
+ font-size: 0.28rem;
67
+ font-weight: 400;
68
+ color: #ffffff;
69
+ font-family: Montserrat;
70
+ }
71
+ .personal-information-mobile .top .btnGroup .iconWrap {
72
+ display: inline-block;
73
+ margin-left: 0.3rem;
74
+ position: relative;
75
+ }
76
+ .personal-information-mobile .top .btnGroup .num {
77
+ position: absolute;
78
+ top: -0.04rem;
79
+ left: 0.28rem;
80
+ display: inline-block;
81
+ padding: 0 0.08rem;
82
+ border-radius: 50%;
83
+ text-align: center;
84
+ min-width: 0.32rem;
85
+ height: 0.32rem;
86
+ line-height: 0.32rem;
87
+ background: #ce1126;
88
+ font-size: 0.12rem;
89
+ color: #ffffff;
90
+ }
91
+ .personal-information-mobile .bottom {
92
+ display: flex;
93
+ flex-direction: row;
94
+ justify-content: space-around;
95
+ width: 100%;
96
+ margin-top: 0.48rem;
97
+ }
98
+ .personal-information-mobile .bottom .item {
99
+ position: relative;
100
+ }
101
+ .personal-information-mobile .bottom .item:after {
102
+ content: '';
103
+ display: inline-block;
104
+ width: 0.02rem;
105
+ height: 0.9rem;
106
+ position: absolute;
107
+ right: 0;
108
+ top: 0.12rem;
109
+ background: #ccc;
110
+ }
111
+ .personal-information-mobile .bottom .item:last-child:after {
112
+ display: none;
113
+ }
114
+ .personal-information-mobile .bottom .item .content-wrap {
115
+ display: flex;
116
+ flex-direction: column;
117
+ justify-content: flex-start;
118
+ align-items: center;
119
+ flex: 1;
120
+ }
121
+ .personal-information-mobile .bottom .item .number {
122
+ width: 70% !important;
123
+ font-size: 0.36rem;
124
+ font-weight: 600;
125
+ color: #ffffff;
126
+ text-align: center;
127
+ }
128
+ .personal-information-mobile .bottom .item .title {
129
+ width: 70% !important;
130
+ font-size: 0.24rem;
131
+ font-weight: 400;
132
+ color: #ffffff;
133
+ line-height: 0.32rem;
134
+ text-align: center;
135
+ }
@@ -641,8 +641,10 @@ function (_super) {
641
641
  onItemClick: function onItemClick() {
642
642
  /** PTO 定制GA */
643
643
  if (window.magicDesign.pushGA) {
644
- window.magicDesign.pushGA(item, 'select_item', {
645
- event_action: 'Select Item'
644
+ window.magicDesign.pushGA(item, 'GA_SENSOR_select_item', {
645
+ event_action: 'Select Item',
646
+ event_section: data.type,
647
+ promotion_name: item === null || item === void 0 ? void 0 : item.offerName
646
648
  });
647
649
  }
648
650
 
@@ -1,89 +1,76 @@
1
1
  .m-recommend-mobile {
2
2
  display: flex;
3
3
  flex-direction: column;
4
-
5
- .cylon-tabs-nav-operations {
6
- display: none !important;
7
- }
8
-
9
- ::-webkit-scrollbar {
10
- width: 0;
11
- height: 0;
12
- display: none;
13
- }
14
-
15
-
16
- .tab-select-wrap {
17
- display: flex;
18
- align-items: center;
19
- height: 50px;
20
- background: rgb(255 255 255);
21
- overflow: auto;
22
- position: relative;
23
- margin-bottom: 15px;
24
-
25
- .tabTitle {
26
- display: flex;
27
- align-items: center;
28
- text-align: center;
29
- padding: 0 16px;
30
- width: fit-content;
31
- height: 100%;
32
- justify-content: center;
33
- white-space: nowrap;
34
- flex-direction: column;
35
-
36
- img {
37
- height: 20px;
38
- width: 20px;
39
- margin-bottom: 2px;
40
- }
41
- }
42
-
43
- .active-line {
44
- position: absolute;
45
- bottom: 0;
46
- width: 200px;
47
- height: 3px;
48
- background-color: #fff;
49
- transition: .2s all linear;
50
- border-radius: 1.5px;
51
- }
52
- }
53
-
54
- .macyContainer {
55
- display: flex;
56
- margin: 0 16px;
57
- }
58
-
59
- .scrollContainer {
60
- display: flex;
61
- flex-direction: row;
62
- align-items: center;
63
- margin: 0 16px;
64
- overflow-x: auto;
65
- padding-bottom: 15px;
66
-
67
- &.pl_100 {
68
- padding-left: 100px;
69
- }
70
-
71
- .scrollProductList {
72
- display: flex;
73
- flex-direction: row;
74
- align-items: flex-start;
75
-
76
- .productCard {
77
- margin-right: 12px;
78
- }
79
- }
80
- }
81
-
82
- .btnSeeAll {
83
- display: block;
84
- width: fit-content;
85
- min-width: 80px;
86
- margin: 0 auto;
87
- flex: none;
88
- }
89
- }
4
+ }
5
+ .m-recommend-mobile .cylon-tabs-nav-operations {
6
+ display: none !important;
7
+ }
8
+ .m-recommend-mobile ::-webkit-scrollbar {
9
+ width: 0;
10
+ height: 0;
11
+ display: none;
12
+ }
13
+ .m-recommend-mobile .tab-select-wrap {
14
+ display: flex;
15
+ align-items: center;
16
+ height: 1rem;
17
+ background: #ffffff;
18
+ overflow: auto;
19
+ position: relative;
20
+ margin-bottom: 0.3rem;
21
+ }
22
+ .m-recommend-mobile .tab-select-wrap .tabTitle {
23
+ display: flex;
24
+ align-items: center;
25
+ text-align: center;
26
+ padding: 0 0.32rem;
27
+ width: fit-content;
28
+ height: 100%;
29
+ justify-content: center;
30
+ white-space: nowrap;
31
+ flex-direction: column;
32
+ }
33
+ .m-recommend-mobile .tab-select-wrap .tabTitle img {
34
+ height: 0.4rem;
35
+ width: 0.4rem;
36
+ margin-bottom: 0.04rem;
37
+ }
38
+ .m-recommend-mobile .tab-select-wrap .active-line {
39
+ position: absolute;
40
+ bottom: 0;
41
+ width: 4rem;
42
+ height: 0.06rem;
43
+ background-color: #fff;
44
+ transition: 0.2s all linear;
45
+ border-radius: 0.03rem;
46
+ }
47
+ .m-recommend-mobile .macyContainer {
48
+ display: flex;
49
+ margin: 0 0.32rem;
50
+ }
51
+ .m-recommend-mobile .scrollContainer {
52
+ display: flex;
53
+ flex-direction: row;
54
+ align-items: center;
55
+ margin: 0 0.32rem;
56
+ overflow-x: auto;
57
+ padding-bottom: 0.3rem;
58
+ }
59
+ .m-recommend-mobile .scrollContainer.pl_100 {
60
+ padding-left: 2rem;
61
+ }
62
+ .m-recommend-mobile .scrollContainer .scrollProductList {
63
+ display: flex;
64
+ flex-direction: row;
65
+ align-items: flex-start;
66
+ }
67
+ .m-recommend-mobile .scrollContainer .scrollProductList .productCard {
68
+ margin-right: 0.24rem;
69
+ }
70
+ .m-recommend-mobile .btnSeeAll {
71
+ display: block;
72
+ width: fit-content;
73
+ min-width: 1.6rem;
74
+ margin: 0 auto;
75
+ flex: none;
76
+ }
@@ -344,7 +344,19 @@ function (_super) {
344
344
  }), !!messageNum && /*#__PURE__*/_react["default"].createElement("span", {
345
345
  className: "num"
346
346
  }, messageNum))), data.content && ((_p = data.content.logo) === null || _p === void 0 ? void 0 : _p.open) && /*#__PURE__*/_react["default"].createElement("div", {
347
- className: "logo"
347
+ className: "logo",
348
+ onClick: function onClick() {
349
+ var _a, _b;
350
+ /** PTO 定制GA */
351
+
352
+
353
+ if (window.magicDesign.pushGA) {
354
+ window.magicDesign.pushGA({}, 'select_promotion', {
355
+ event_section: data.type,
356
+ promotion_name: (_b = (_a = data.content.logo) === null || _a === void 0 ? void 0 : _a.content) === null || _b === void 0 ? void 0 : _b.h5Name
357
+ });
358
+ }
359
+ }
348
360
  }, /*#__PURE__*/_react["default"].createElement(_components.MetaImage, {
349
361
  data: data.content.logo,
350
362
  style: {
@@ -1,58 +1,51 @@
1
1
  .m-search-bar {
2
- height: 48px;
3
- padding: 8px 0;
2
+ height: 0.96rem;
3
+ padding: 0.16rem 0;
4
4
  display: flex;
5
5
  flex-direction: row-reverse;
6
6
  align-items: center;
7
7
  justify-content: space-between;
8
8
  width: 100%;
9
-
10
- .right {
11
- display: flex;
12
- flex: 1;
13
- margin-left: 15px;
14
- align-items: center;
15
- justify-content: space-between;
16
-
17
- .search-input-wrap {
18
- flex: 1;
19
- background: #fff;
20
- border-radius: 4px;
21
- border: 1px solid #D2D9E5;
22
- padding: 4px 12px;
23
- height: 32px;
24
- text-align: right;
25
- display: flex;
26
- justify-content: flex-end;
27
- }
28
-
29
- .message-wrap {
30
- position: relative;
31
- margin-left: 10px;
32
-
33
- .num {
34
- position: absolute;
35
- top: -6px;
36
- right: -6px;
37
- display: inline-block;
38
- padding: 1px 2px;
39
- min-width: 17px;
40
- text-align: center;
41
- background-color: #CE1126;
42
- border: 1px solid #fff;
43
- border-radius: 8px;
44
- font-family: 'Montserrat';
45
- font-style: normal;
46
- font-weight: 600;
47
- font-size: 8px;
48
- color: #FFFFFF;
49
- }
50
- }
51
- }
52
-
53
- .logo {
54
- img {
55
- width: auto;
56
- }
57
- }
58
- }
9
+ }
10
+ .m-search-bar .right {
11
+ display: flex;
12
+ flex: 1;
13
+ margin-left: 0.3rem;
14
+ align-items: center;
15
+ justify-content: space-between;
16
+ }
17
+ .m-search-bar .right .search-input-wrap {
18
+ flex: 1;
19
+ background: #fff;
20
+ border-radius: 0.08rem;
21
+ border: 0.02rem solid #D2D9E5;
22
+ padding: 0.08rem 0.24rem;
23
+ height: 0.64rem;
24
+ text-align: right;
25
+ display: flex;
26
+ justify-content: flex-end;
27
+ }
28
+ .m-search-bar .right .message-wrap {
29
+ position: relative;
30
+ margin-left: 0.2rem;
31
+ }
32
+ .m-search-bar .right .message-wrap .num {
33
+ position: absolute;
34
+ top: -0.12rem;
35
+ right: -0.12rem;
36
+ display: inline-block;
37
+ padding: 0.02rem 0.04rem;
38
+ min-width: 0.34rem;
39
+ text-align: center;
40
+ background-color: #CE1126;
41
+ border: 0.02rem solid #fff;
42
+ border-radius: 0.16rem;
43
+ font-family: 'Montserrat';
44
+ font-style: normal;
45
+ font-weight: 600;
46
+ font-size: 0.16rem;
47
+ color: #FFFFFF;
48
+ }
49
+ .m-search-bar .logo img {
50
+ width: auto;
51
+ }