@fonixtree/magic-design 2.0.9 → 2.0.10
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.
- package/es/assets/images/layout-icon/imageTextLeft.svg +6 -0
- package/es/assets/images/layout-icon/imageTextRight.svg +6 -0
- package/es/composite-comp/bol/components/ImageText/pc/index.js +95 -3
- package/es/composite-comp/bol/components/ImageText/pc/index.less +32 -0
- package/es/constants/layout.js +12 -0
- package/es/core/Designer/AiImageGenerator/History/index.less +1 -4
- package/es/core/Designer/AiImageGenerator/index.less +4 -0
- package/lib/assets/images/layout-icon/imageTextLeft.svg +6 -0
- package/lib/assets/images/layout-icon/imageTextRight.svg +6 -0
- package/lib/composite-comp/bol/components/ImageText/pc/index.js +95 -3
- package/lib/composite-comp/bol/components/ImageText/pc/index.less +32 -0
- package/lib/constants/layout.js +12 -0
- package/lib/core/Designer/AiImageGenerator/History/index.less +1 -4
- package/lib/core/Designer/AiImageGenerator/index.less +4 -0
- package/package.json +1 -1
- package/es/assets/fonts/.DS_Store +0 -0
- package/lib/assets/fonts/.DS_Store +0 -0
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
<svg width="96" height="68" viewBox="0 0 96 68" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<rect x="1" y="1" width="94" height="66" rx="8" fill="#F5F6F7" stroke="#D2D9E5"/>
|
|
3
|
+
<path d="M53.0322 29H84.0322" stroke="#D2D9E5" stroke-width="4" stroke-linecap="round"/>
|
|
4
|
+
<path d="M53.0322 39H79.0322" stroke="#D2D9E5" stroke-width="4" stroke-linecap="round"/>
|
|
5
|
+
<rect x="11.0322" y="11" width="36" height="46" rx="2" fill="#D2D9E5"/>
|
|
6
|
+
</svg>
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
<svg width="96" height="68" viewBox="0 0 96 68" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<rect x="1" y="1" width="94" height="66" rx="8" fill="#F5F6F7" stroke="#D2D9E5"/>
|
|
3
|
+
<path d="M11 29H42" stroke="#D2D9E5" stroke-width="4" stroke-linecap="round"/>
|
|
4
|
+
<path d="M11 39H37" stroke="#D2D9E5" stroke-width="4" stroke-linecap="round"/>
|
|
5
|
+
<rect x="48" y="11" width="36" height="46" rx="2" fill="#D2D9E5"/>
|
|
6
|
+
</svg>
|
|
@@ -111,12 +111,24 @@ function (_super) {
|
|
|
111
111
|
_this.getCardStyle = function (source, i) {
|
|
112
112
|
var data = _this.props.data;
|
|
113
113
|
var cardStyle = {
|
|
114
|
-
width: _this.calcWidth(data.customize.pcRowNum),
|
|
115
|
-
marginRight: (1 + i) % data.customize.pcRowNum !== 0 ? '2%' : 0,
|
|
116
114
|
alignItems: _AlignSelector.alignItemMap[data.customize.align],
|
|
117
115
|
textAlign: data.customize.align
|
|
118
116
|
};
|
|
117
|
+
|
|
118
|
+
if (data.customize.layout.pcLayout === 'leftImage' || data.customize.layout.pcLayout === 'rightImage') {
|
|
119
|
+
if ((data === null || data === void 0 ? void 0 : data.groupSource.length) > 1 && i != (data === null || data === void 0 ? void 0 : data.groupSource.length) - 1) {
|
|
120
|
+
cardStyle.marginBottom = 48;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
cardStyle.alignItems = 'center';
|
|
124
|
+
} else {
|
|
125
|
+
cardStyle.marginRight = (1 + i) % data.customize.pcRowNum !== 0 ? '2%' : 0;
|
|
126
|
+
cardStyle.width = _this.calcWidth(data.customize.pcRowNum);
|
|
127
|
+
cardStyle.alignItems = _AlignSelector.alignItemMap[data.customize.align];
|
|
128
|
+
}
|
|
129
|
+
|
|
119
130
|
var wrapStyle = (0, _businessUtil.computeStyle)(source, window.magicDesign.device);
|
|
131
|
+
console.log('cc wrapStyle', source, wrapStyle);
|
|
120
132
|
var hoverIndex = _this.state.hoverIndex;
|
|
121
133
|
var hoverStyle = {};
|
|
122
134
|
|
|
@@ -127,6 +139,86 @@ function (_super) {
|
|
|
127
139
|
return __assign(__assign(__assign({}, cardStyle), wrapStyle), hoverStyle);
|
|
128
140
|
};
|
|
129
141
|
|
|
142
|
+
_this.getContentStyle = function () {
|
|
143
|
+
var data = _this.props.data;
|
|
144
|
+
return {
|
|
145
|
+
alignItems: _AlignSelector.alignItemMap[data.customize.align]
|
|
146
|
+
};
|
|
147
|
+
};
|
|
148
|
+
|
|
149
|
+
_this.getAnotherLayout = function () {
|
|
150
|
+
var data = _this.props.data;
|
|
151
|
+
var hoverIndex = _this.state.hoverIndex;
|
|
152
|
+
var GAData = (0, _commonUtil.getGAData)(data);
|
|
153
|
+
console.log('ff--image text', data);
|
|
154
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, (data === null || data === void 0 ? void 0 : data.groupSource.length) > 0 && /*#__PURE__*/_react["default"].createElement("div", {
|
|
155
|
+
className: "group-wrap"
|
|
156
|
+
}, data.groupSource.map(function (source, i) {
|
|
157
|
+
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
158
|
+
key: source.id,
|
|
159
|
+
className: "one-card",
|
|
160
|
+
onMouseEnter: function onMouseEnter() {
|
|
161
|
+
if (source.hover.open) {
|
|
162
|
+
_this.setState({
|
|
163
|
+
hoverIndex: i
|
|
164
|
+
});
|
|
165
|
+
}
|
|
166
|
+
},
|
|
167
|
+
onMouseLeave: function onMouseLeave() {
|
|
168
|
+
_this.setState({
|
|
169
|
+
hoverIndex: -1
|
|
170
|
+
});
|
|
171
|
+
},
|
|
172
|
+
style: _this.getCardStyle(source, i)
|
|
173
|
+
}, (source.image.open && hoverIndex != i || hoverIndex == i && source.hover.image.open) && /*#__PURE__*/_react["default"].createElement("div", {
|
|
174
|
+
className: "card-image-wrap"
|
|
175
|
+
}, /*#__PURE__*/_react["default"].createElement(_components.MetaImage, {
|
|
176
|
+
className: "card-image",
|
|
177
|
+
data: hoverIndex == i ? source.hover.image : source.image,
|
|
178
|
+
GAData: __assign(__assign({}, GAData), {
|
|
179
|
+
groupId: source.id,
|
|
180
|
+
groupName: (0, _ConfigPanel.getSecondConfigName)(data, source.id)
|
|
181
|
+
}),
|
|
182
|
+
maxWidth: 654,
|
|
183
|
+
minWidth: 300,
|
|
184
|
+
scale: 0.5
|
|
185
|
+
})), /*#__PURE__*/_react["default"].createElement("div", {
|
|
186
|
+
className: "content-wrap",
|
|
187
|
+
style: _this.getContentStyle()
|
|
188
|
+
}, (source.title.open && hoverIndex != i || hoverIndex == i && source.hover.title.open) && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
|
|
189
|
+
className: "card-title",
|
|
190
|
+
data: hoverIndex == i ? source.hover.title : source.title,
|
|
191
|
+
GAData: __assign(__assign({}, GAData), {
|
|
192
|
+
groupId: source.id,
|
|
193
|
+
groupName: (0, _ConfigPanel.getSecondConfigName)(data, source.id)
|
|
194
|
+
})
|
|
195
|
+
}), (source.text.open && hoverIndex != i || hoverIndex == i && source.hover.text.open) && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
|
|
196
|
+
className: "card-text",
|
|
197
|
+
data: hoverIndex == i ? source.hover.text : source.text,
|
|
198
|
+
GAData: __assign(__assign({}, GAData), {
|
|
199
|
+
groupId: source.id,
|
|
200
|
+
groupName: (0, _ConfigPanel.getSecondConfigName)(data, source.id)
|
|
201
|
+
})
|
|
202
|
+
}), /*#__PURE__*/_react["default"].createElement("div", {
|
|
203
|
+
className: "card-btn-wrap"
|
|
204
|
+
}, (source.button.open && hoverIndex != i || source.hover.button.open && hoverIndex == i) && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
|
|
205
|
+
className: "card-first-btn",
|
|
206
|
+
data: hoverIndex == i ? source.hover.button : source.button,
|
|
207
|
+
GAData: __assign(__assign({}, GAData), {
|
|
208
|
+
groupId: source.id,
|
|
209
|
+
groupName: (0, _ConfigPanel.getSecondConfigName)(data, source.id)
|
|
210
|
+
})
|
|
211
|
+
}), (source.secondButton.open && hoverIndex != i || source.hover.secondButton.open && hoverIndex == i) && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
|
|
212
|
+
className: "card-second-btn",
|
|
213
|
+
data: hoverIndex == i ? source.hover.secondButton : source.secondButton,
|
|
214
|
+
GAData: __assign(__assign({}, GAData), {
|
|
215
|
+
groupId: source.id,
|
|
216
|
+
groupName: (0, _ConfigPanel.getSecondConfigName)(data, source.id)
|
|
217
|
+
})
|
|
218
|
+
}))));
|
|
219
|
+
})));
|
|
220
|
+
};
|
|
221
|
+
|
|
130
222
|
return _this;
|
|
131
223
|
}
|
|
132
224
|
|
|
@@ -163,7 +255,7 @@ function (_super) {
|
|
|
163
255
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
164
256
|
className: (0, _classnames["default"])('image-text-pc', data.customize.layout.pcLayout),
|
|
165
257
|
style: wrapStyle
|
|
166
|
-
}, (data === null || data === void 0 ? void 0 : data.groupSource.length) > 0 && /*#__PURE__*/_react["default"].createElement("div", {
|
|
258
|
+
}, data.customize.layout.pcLayout === 'leftImage' || data.customize.layout.pcLayout === 'rightImage' ? this.getAnotherLayout() : (data === null || data === void 0 ? void 0 : data.groupSource.length) > 0 && /*#__PURE__*/_react["default"].createElement("div", {
|
|
167
259
|
className: "group-wrap"
|
|
168
260
|
}, data.groupSource.map(function (source, i) {
|
|
169
261
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
@@ -116,3 +116,35 @@
|
|
|
116
116
|
}
|
|
117
117
|
}
|
|
118
118
|
}
|
|
119
|
+
|
|
120
|
+
|
|
121
|
+
.leftImage .group-wrap .one-card {
|
|
122
|
+
flex-direction: row;
|
|
123
|
+
.card-image-wrap .card-image {
|
|
124
|
+
margin: 0 32px 0 0;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
.rightImage .group-wrap .one-card {
|
|
128
|
+
flex-direction: row-reverse;
|
|
129
|
+
.card-image-wrap .card-image {
|
|
130
|
+
margin: 0 0 0 32px;
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.leftImage, .rightImage {
|
|
135
|
+
padding: 48px 108px;
|
|
136
|
+
.group-wrap {
|
|
137
|
+
flex-direction: column;
|
|
138
|
+
.one-card {
|
|
139
|
+
// flex-direction: row;
|
|
140
|
+
.card-image-wrap {
|
|
141
|
+
width: fit-content;
|
|
142
|
+
}
|
|
143
|
+
.content-wrap {
|
|
144
|
+
flex: 1;
|
|
145
|
+
display: flex;
|
|
146
|
+
flex-direction: column;
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
}
|
package/es/constants/layout.js
CHANGED
|
@@ -37,6 +37,10 @@ var _layoutImagetextP2 = _interopRequireDefault(require("../assets/images/layout
|
|
|
37
37
|
|
|
38
38
|
var _layoutImagetextP3 = _interopRequireDefault(require("../assets/images/layout-icon/layout-imagetext-p4.png"));
|
|
39
39
|
|
|
40
|
+
var _imageTextLeft = _interopRequireDefault(require("../assets/images/layout-icon/imageTextLeft.svg"));
|
|
41
|
+
|
|
42
|
+
var _imageTextRight = _interopRequireDefault(require("../assets/images/layout-icon/imageTextRight.svg"));
|
|
43
|
+
|
|
40
44
|
var _newsletter = _interopRequireDefault(require("../assets/images/layout-icon/newsletter.svg"));
|
|
41
45
|
|
|
42
46
|
var _layoutRecommend = _interopRequireDefault(require("../assets/images/layout-icon/layout-recommend-1.png"));
|
|
@@ -128,6 +132,14 @@ var imageTextLayoutPc = [{
|
|
|
128
132
|
id: 'layout3',
|
|
129
133
|
name: 'center',
|
|
130
134
|
image: _layoutImagetextP3["default"]
|
|
135
|
+
}, {
|
|
136
|
+
id: 'layout4',
|
|
137
|
+
name: 'leftImage',
|
|
138
|
+
image: _imageTextLeft["default"]
|
|
139
|
+
}, {
|
|
140
|
+
id: 'layout5',
|
|
141
|
+
name: 'rightImage',
|
|
142
|
+
image: _imageTextRight["default"]
|
|
131
143
|
}];
|
|
132
144
|
exports.imageTextLayoutPc = imageTextLayoutPc;
|
|
133
145
|
var imageTextLayoutMobile = [{
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
<svg width="96" height="68" viewBox="0 0 96 68" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<rect x="1" y="1" width="94" height="66" rx="8" fill="#F5F6F7" stroke="#D2D9E5"/>
|
|
3
|
+
<path d="M53.0322 29H84.0322" stroke="#D2D9E5" stroke-width="4" stroke-linecap="round"/>
|
|
4
|
+
<path d="M53.0322 39H79.0322" stroke="#D2D9E5" stroke-width="4" stroke-linecap="round"/>
|
|
5
|
+
<rect x="11.0322" y="11" width="36" height="46" rx="2" fill="#D2D9E5"/>
|
|
6
|
+
</svg>
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
<svg width="96" height="68" viewBox="0 0 96 68" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<rect x="1" y="1" width="94" height="66" rx="8" fill="#F5F6F7" stroke="#D2D9E5"/>
|
|
3
|
+
<path d="M11 29H42" stroke="#D2D9E5" stroke-width="4" stroke-linecap="round"/>
|
|
4
|
+
<path d="M11 39H37" stroke="#D2D9E5" stroke-width="4" stroke-linecap="round"/>
|
|
5
|
+
<rect x="48" y="11" width="36" height="46" rx="2" fill="#D2D9E5"/>
|
|
6
|
+
</svg>
|
|
@@ -111,12 +111,24 @@ function (_super) {
|
|
|
111
111
|
_this.getCardStyle = function (source, i) {
|
|
112
112
|
var data = _this.props.data;
|
|
113
113
|
var cardStyle = {
|
|
114
|
-
width: _this.calcWidth(data.customize.pcRowNum),
|
|
115
|
-
marginRight: (1 + i) % data.customize.pcRowNum !== 0 ? '2%' : 0,
|
|
116
114
|
alignItems: _AlignSelector.alignItemMap[data.customize.align],
|
|
117
115
|
textAlign: data.customize.align
|
|
118
116
|
};
|
|
117
|
+
|
|
118
|
+
if (data.customize.layout.pcLayout === 'leftImage' || data.customize.layout.pcLayout === 'rightImage') {
|
|
119
|
+
if ((data === null || data === void 0 ? void 0 : data.groupSource.length) > 1 && i != (data === null || data === void 0 ? void 0 : data.groupSource.length) - 1) {
|
|
120
|
+
cardStyle.marginBottom = 48;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
cardStyle.alignItems = 'center';
|
|
124
|
+
} else {
|
|
125
|
+
cardStyle.marginRight = (1 + i) % data.customize.pcRowNum !== 0 ? '2%' : 0;
|
|
126
|
+
cardStyle.width = _this.calcWidth(data.customize.pcRowNum);
|
|
127
|
+
cardStyle.alignItems = _AlignSelector.alignItemMap[data.customize.align];
|
|
128
|
+
}
|
|
129
|
+
|
|
119
130
|
var wrapStyle = (0, _businessUtil.computeStyle)(source, window.magicDesign.device);
|
|
131
|
+
console.log('cc wrapStyle', source, wrapStyle);
|
|
120
132
|
var hoverIndex = _this.state.hoverIndex;
|
|
121
133
|
var hoverStyle = {};
|
|
122
134
|
|
|
@@ -127,6 +139,86 @@ function (_super) {
|
|
|
127
139
|
return __assign(__assign(__assign({}, cardStyle), wrapStyle), hoverStyle);
|
|
128
140
|
};
|
|
129
141
|
|
|
142
|
+
_this.getContentStyle = function () {
|
|
143
|
+
var data = _this.props.data;
|
|
144
|
+
return {
|
|
145
|
+
alignItems: _AlignSelector.alignItemMap[data.customize.align]
|
|
146
|
+
};
|
|
147
|
+
};
|
|
148
|
+
|
|
149
|
+
_this.getAnotherLayout = function () {
|
|
150
|
+
var data = _this.props.data;
|
|
151
|
+
var hoverIndex = _this.state.hoverIndex;
|
|
152
|
+
var GAData = (0, _commonUtil.getGAData)(data);
|
|
153
|
+
console.log('ff--image text', data);
|
|
154
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, (data === null || data === void 0 ? void 0 : data.groupSource.length) > 0 && /*#__PURE__*/_react["default"].createElement("div", {
|
|
155
|
+
className: "group-wrap"
|
|
156
|
+
}, data.groupSource.map(function (source, i) {
|
|
157
|
+
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
158
|
+
key: source.id,
|
|
159
|
+
className: "one-card",
|
|
160
|
+
onMouseEnter: function onMouseEnter() {
|
|
161
|
+
if (source.hover.open) {
|
|
162
|
+
_this.setState({
|
|
163
|
+
hoverIndex: i
|
|
164
|
+
});
|
|
165
|
+
}
|
|
166
|
+
},
|
|
167
|
+
onMouseLeave: function onMouseLeave() {
|
|
168
|
+
_this.setState({
|
|
169
|
+
hoverIndex: -1
|
|
170
|
+
});
|
|
171
|
+
},
|
|
172
|
+
style: _this.getCardStyle(source, i)
|
|
173
|
+
}, (source.image.open && hoverIndex != i || hoverIndex == i && source.hover.image.open) && /*#__PURE__*/_react["default"].createElement("div", {
|
|
174
|
+
className: "card-image-wrap"
|
|
175
|
+
}, /*#__PURE__*/_react["default"].createElement(_components.MetaImage, {
|
|
176
|
+
className: "card-image",
|
|
177
|
+
data: hoverIndex == i ? source.hover.image : source.image,
|
|
178
|
+
GAData: __assign(__assign({}, GAData), {
|
|
179
|
+
groupId: source.id,
|
|
180
|
+
groupName: (0, _ConfigPanel.getSecondConfigName)(data, source.id)
|
|
181
|
+
}),
|
|
182
|
+
maxWidth: 654,
|
|
183
|
+
minWidth: 300,
|
|
184
|
+
scale: 0.5
|
|
185
|
+
})), /*#__PURE__*/_react["default"].createElement("div", {
|
|
186
|
+
className: "content-wrap",
|
|
187
|
+
style: _this.getContentStyle()
|
|
188
|
+
}, (source.title.open && hoverIndex != i || hoverIndex == i && source.hover.title.open) && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
|
|
189
|
+
className: "card-title",
|
|
190
|
+
data: hoverIndex == i ? source.hover.title : source.title,
|
|
191
|
+
GAData: __assign(__assign({}, GAData), {
|
|
192
|
+
groupId: source.id,
|
|
193
|
+
groupName: (0, _ConfigPanel.getSecondConfigName)(data, source.id)
|
|
194
|
+
})
|
|
195
|
+
}), (source.text.open && hoverIndex != i || hoverIndex == i && source.hover.text.open) && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
|
|
196
|
+
className: "card-text",
|
|
197
|
+
data: hoverIndex == i ? source.hover.text : source.text,
|
|
198
|
+
GAData: __assign(__assign({}, GAData), {
|
|
199
|
+
groupId: source.id,
|
|
200
|
+
groupName: (0, _ConfigPanel.getSecondConfigName)(data, source.id)
|
|
201
|
+
})
|
|
202
|
+
}), /*#__PURE__*/_react["default"].createElement("div", {
|
|
203
|
+
className: "card-btn-wrap"
|
|
204
|
+
}, (source.button.open && hoverIndex != i || source.hover.button.open && hoverIndex == i) && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
|
|
205
|
+
className: "card-first-btn",
|
|
206
|
+
data: hoverIndex == i ? source.hover.button : source.button,
|
|
207
|
+
GAData: __assign(__assign({}, GAData), {
|
|
208
|
+
groupId: source.id,
|
|
209
|
+
groupName: (0, _ConfigPanel.getSecondConfigName)(data, source.id)
|
|
210
|
+
})
|
|
211
|
+
}), (source.secondButton.open && hoverIndex != i || source.hover.secondButton.open && hoverIndex == i) && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
|
|
212
|
+
className: "card-second-btn",
|
|
213
|
+
data: hoverIndex == i ? source.hover.secondButton : source.secondButton,
|
|
214
|
+
GAData: __assign(__assign({}, GAData), {
|
|
215
|
+
groupId: source.id,
|
|
216
|
+
groupName: (0, _ConfigPanel.getSecondConfigName)(data, source.id)
|
|
217
|
+
})
|
|
218
|
+
}))));
|
|
219
|
+
})));
|
|
220
|
+
};
|
|
221
|
+
|
|
130
222
|
return _this;
|
|
131
223
|
}
|
|
132
224
|
|
|
@@ -163,7 +255,7 @@ function (_super) {
|
|
|
163
255
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
164
256
|
className: (0, _classnames["default"])('image-text-pc', data.customize.layout.pcLayout),
|
|
165
257
|
style: wrapStyle
|
|
166
|
-
}, (data === null || data === void 0 ? void 0 : data.groupSource.length) > 0 && /*#__PURE__*/_react["default"].createElement("div", {
|
|
258
|
+
}, data.customize.layout.pcLayout === 'leftImage' || data.customize.layout.pcLayout === 'rightImage' ? this.getAnotherLayout() : (data === null || data === void 0 ? void 0 : data.groupSource.length) > 0 && /*#__PURE__*/_react["default"].createElement("div", {
|
|
167
259
|
className: "group-wrap"
|
|
168
260
|
}, data.groupSource.map(function (source, i) {
|
|
169
261
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
@@ -116,3 +116,35 @@
|
|
|
116
116
|
}
|
|
117
117
|
}
|
|
118
118
|
}
|
|
119
|
+
|
|
120
|
+
|
|
121
|
+
.leftImage .group-wrap .one-card {
|
|
122
|
+
flex-direction: row;
|
|
123
|
+
.card-image-wrap .card-image {
|
|
124
|
+
margin: 0 32px 0 0;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
.rightImage .group-wrap .one-card {
|
|
128
|
+
flex-direction: row-reverse;
|
|
129
|
+
.card-image-wrap .card-image {
|
|
130
|
+
margin: 0 0 0 32px;
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.leftImage, .rightImage {
|
|
135
|
+
padding: 48px 108px;
|
|
136
|
+
.group-wrap {
|
|
137
|
+
flex-direction: column;
|
|
138
|
+
.one-card {
|
|
139
|
+
// flex-direction: row;
|
|
140
|
+
.card-image-wrap {
|
|
141
|
+
width: fit-content;
|
|
142
|
+
}
|
|
143
|
+
.content-wrap {
|
|
144
|
+
flex: 1;
|
|
145
|
+
display: flex;
|
|
146
|
+
flex-direction: column;
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
}
|
package/lib/constants/layout.js
CHANGED
|
@@ -37,6 +37,10 @@ var _layoutImagetextP2 = _interopRequireDefault(require("../assets/images/layout
|
|
|
37
37
|
|
|
38
38
|
var _layoutImagetextP3 = _interopRequireDefault(require("../assets/images/layout-icon/layout-imagetext-p4.png"));
|
|
39
39
|
|
|
40
|
+
var _imageTextLeft = _interopRequireDefault(require("../assets/images/layout-icon/imageTextLeft.svg"));
|
|
41
|
+
|
|
42
|
+
var _imageTextRight = _interopRequireDefault(require("../assets/images/layout-icon/imageTextRight.svg"));
|
|
43
|
+
|
|
40
44
|
var _newsletter = _interopRequireDefault(require("../assets/images/layout-icon/newsletter.svg"));
|
|
41
45
|
|
|
42
46
|
var _layoutRecommend = _interopRequireDefault(require("../assets/images/layout-icon/layout-recommend-1.png"));
|
|
@@ -128,6 +132,14 @@ var imageTextLayoutPc = [{
|
|
|
128
132
|
id: 'layout3',
|
|
129
133
|
name: 'center',
|
|
130
134
|
image: _layoutImagetextP3["default"]
|
|
135
|
+
}, {
|
|
136
|
+
id: 'layout4',
|
|
137
|
+
name: 'leftImage',
|
|
138
|
+
image: _imageTextLeft["default"]
|
|
139
|
+
}, {
|
|
140
|
+
id: 'layout5',
|
|
141
|
+
name: 'rightImage',
|
|
142
|
+
image: _imageTextRight["default"]
|
|
131
143
|
}];
|
|
132
144
|
exports.imageTextLayoutPc = imageTextLayoutPc;
|
|
133
145
|
var imageTextLayoutMobile = [{
|
package/package.json
CHANGED
|
Binary file
|
|
Binary file
|