@bento-core/about 1.0.1-CDS.4 → 1.0.1-CDS.6
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/dist/aboutBodyView.js +71 -5
- package/package.json +5 -4
- package/src/aboutBodyView.js +78 -7
package/dist/aboutBodyView.js
CHANGED
|
@@ -6,8 +6,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _core = require("@material-ui/core");
|
|
9
|
+
var _reactRouterDom = require("react-router-dom");
|
|
9
10
|
var _xoomInOutView = _interopRequireDefault(require("./xoomInOutView"));
|
|
10
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
11
13
|
const AboutBody = _ref => {
|
|
12
14
|
let {
|
|
13
15
|
classes,
|
|
@@ -226,14 +228,30 @@ const AboutBody = _ref => {
|
|
|
226
228
|
}));
|
|
227
229
|
}
|
|
228
230
|
return splitedParagraph;
|
|
229
|
-
})))) : ''))), data.imageLocation === 'right' && /*#__PURE__*/_react.default.createElement(_core.Grid, {
|
|
231
|
+
})))) : ''))), (data.imageLocation === 'right' || data.actionButtonLabel && data.actionLink) && /*#__PURE__*/_react.default.createElement(_core.Grid, {
|
|
230
232
|
item: true,
|
|
231
233
|
lg: 3,
|
|
232
234
|
md: 3,
|
|
233
235
|
sm: 12,
|
|
234
236
|
xs: 12,
|
|
235
237
|
className: classes.imageSection
|
|
236
|
-
}, data.image
|
|
238
|
+
}, data.image, data.actionButtonLabel && data.actionLink && /*#__PURE__*/_react.default.createElement("div", {
|
|
239
|
+
className: classes.actionSection
|
|
240
|
+
}, data.actionTitle && /*#__PURE__*/_react.default.createElement("div", {
|
|
241
|
+
className: classes.actionTitle
|
|
242
|
+
}, data.actionTitle), /*#__PURE__*/_react.default.createElement(_core.Link, _extends({}, data.actionLink && data.actionLink.includes('http') ? {
|
|
243
|
+
href: data.actionLink,
|
|
244
|
+
target: '_blank',
|
|
245
|
+
rel: 'noreferrer'
|
|
246
|
+
} : {
|
|
247
|
+
component: _reactRouterDom.Link,
|
|
248
|
+
to: data.actionLink
|
|
249
|
+
}, {
|
|
250
|
+
title: data.actionButtonLabel,
|
|
251
|
+
color: "inherit",
|
|
252
|
+
underline: "none",
|
|
253
|
+
className: classes.actionLink
|
|
254
|
+
}), data.actionButtonLabel))))), data.secondaryZoomImageTitle && /*#__PURE__*/_react.default.createElement("div", {
|
|
237
255
|
className: classes.secondayTitle
|
|
238
256
|
}, data.secondaryZoomImageTitle), data.secondaryImage && /*#__PURE__*/_react.default.createElement(_xoomInOutView.default, null, data.secondaryImageData));
|
|
239
257
|
};
|
|
@@ -280,13 +298,61 @@ const styles = () => ({
|
|
|
280
298
|
fontWeight: 'bold'
|
|
281
299
|
}),
|
|
282
300
|
contentSection: {
|
|
283
|
-
padding: props => props.data.imageLocation === 'right' ? '8px 25px 8px 25px !important' : '8px 0px 8px 25px !important',
|
|
301
|
+
padding: props => props.data.imageLocation === 'right' || props.data.actionButtonLabel && props.data.actionLink ? '8px 25px 8px 25px !important' : '8px 0px 8px 25px !important',
|
|
302
|
+
marginBottom: props => props.data.marginBottom ? props.data.marginBottom : 0,
|
|
284
303
|
float: 'left',
|
|
285
304
|
background: 'white'
|
|
286
305
|
},
|
|
287
306
|
imageSection: {
|
|
288
307
|
float: 'left'
|
|
289
308
|
},
|
|
309
|
+
actionSection: {
|
|
310
|
+
display: 'flex',
|
|
311
|
+
width: '100%',
|
|
312
|
+
padding: '25px 25px 35px',
|
|
313
|
+
flexDirection: 'column',
|
|
314
|
+
alignItems: 'center',
|
|
315
|
+
flexShrink: 0,
|
|
316
|
+
border: '0.5px solid #98B5CB',
|
|
317
|
+
background: '#EBF3F7',
|
|
318
|
+
marginTop: '19px'
|
|
319
|
+
},
|
|
320
|
+
actionTitle: {
|
|
321
|
+
color: '#7A9BB1',
|
|
322
|
+
textAlign: 'center',
|
|
323
|
+
fontFamily: 'Lato',
|
|
324
|
+
fontSize: '19px',
|
|
325
|
+
fontStyle: 'normal',
|
|
326
|
+
fontWeight: '700',
|
|
327
|
+
lineHeight: '25px',
|
|
328
|
+
letterSpacing: '0.15px',
|
|
329
|
+
textTransform: 'uppercase',
|
|
330
|
+
wordBreak: 'break-word',
|
|
331
|
+
marginBottom: '22px'
|
|
332
|
+
},
|
|
333
|
+
actionLink: {
|
|
334
|
+
display: 'flex',
|
|
335
|
+
width: '210px',
|
|
336
|
+
height: 'fit-content',
|
|
337
|
+
minHeight: '45px',
|
|
338
|
+
justifyContent: 'center',
|
|
339
|
+
alignItems: 'center',
|
|
340
|
+
gap: '10px',
|
|
341
|
+
flexShrink: '0',
|
|
342
|
+
borderRadius: '10px',
|
|
343
|
+
border: '1px solid #42779A',
|
|
344
|
+
background: '#0E6292',
|
|
345
|
+
color: '#FFF',
|
|
346
|
+
textAlign: 'center',
|
|
347
|
+
fontFamily: 'Lato',
|
|
348
|
+
fontSize: '12px',
|
|
349
|
+
fontStyle: 'normal',
|
|
350
|
+
fontWeight: 600,
|
|
351
|
+
lineHeight: 'normal',
|
|
352
|
+
letterSpacing: '1px',
|
|
353
|
+
wordBreak: 'break-word',
|
|
354
|
+
padding: '15.5px'
|
|
355
|
+
},
|
|
290
356
|
aboutSection: {
|
|
291
357
|
padding: '0px 45px'
|
|
292
358
|
},
|
|
@@ -294,9 +360,9 @@ const styles = () => ({
|
|
|
294
360
|
width: '100%'
|
|
295
361
|
},
|
|
296
362
|
linkIcon: {
|
|
297
|
-
width: '
|
|
363
|
+
width: '1em',
|
|
298
364
|
verticalAlign: 'sub',
|
|
299
|
-
margin: '0px 0px 2px
|
|
365
|
+
margin: '0px 0px 2px 2px'
|
|
300
366
|
},
|
|
301
367
|
link: props => ({
|
|
302
368
|
color: props.linkColor,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bento-core/about",
|
|
3
|
-
"version": "1.0.1-CDS.
|
|
3
|
+
"version": "1.0.1-CDS.6",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"access": "public"
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@bento-core/facet-filter": "^1.0.1-CDS.
|
|
16
|
+
"@bento-core/facet-filter": "^1.0.1-CDS.3",
|
|
17
17
|
"lodash": "^4.17.20",
|
|
18
18
|
"react-zoom-pan-pinch": "*"
|
|
19
19
|
},
|
|
@@ -22,9 +22,10 @@
|
|
|
22
22
|
"clsx": "^1.2.1",
|
|
23
23
|
"react": "^17.0.2",
|
|
24
24
|
"react-dom": "^17.0.0",
|
|
25
|
-
"react-redux": "^7.2.1"
|
|
25
|
+
"react-redux": "^7.2.1",
|
|
26
|
+
"react-router-dom": "^5.1.2"
|
|
26
27
|
},
|
|
27
28
|
"author": "CTOS Bento Team",
|
|
28
29
|
"license": "ISC",
|
|
29
|
-
"gitHead": "
|
|
30
|
+
"gitHead": "ee71f939cd2c6122cd70064016b80e984ee8db37"
|
|
30
31
|
}
|
package/src/aboutBodyView.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Grid, Link, withStyles } from '@material-ui/core';
|
|
3
|
+
import { Link as RouterLink } from 'react-router-dom';
|
|
3
4
|
import XoomInOut from './xoomInOutView';
|
|
4
5
|
|
|
5
6
|
const AboutBody = ({
|
|
@@ -297,11 +298,33 @@ const AboutBody = ({
|
|
|
297
298
|
</div>
|
|
298
299
|
)}
|
|
299
300
|
</Grid>
|
|
300
|
-
{data.imageLocation === 'right'
|
|
301
|
+
{(data.imageLocation === 'right'
|
|
302
|
+
|| (data.actionButtonLabel && data.actionLink))
|
|
301
303
|
&& (
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
304
|
+
<Grid item lg={3} md={3} sm={12} xs={12} className={classes.imageSection}>
|
|
305
|
+
{data.image}
|
|
306
|
+
|
|
307
|
+
{data.actionButtonLabel && data.actionLink && (
|
|
308
|
+
<div className={classes.actionSection}>
|
|
309
|
+
{data.actionTitle && (
|
|
310
|
+
<div className={classes.actionTitle}>
|
|
311
|
+
{data.actionTitle}
|
|
312
|
+
</div>
|
|
313
|
+
)}
|
|
314
|
+
<Link
|
|
315
|
+
{...(data.actionLink && data.actionLink.includes('http')
|
|
316
|
+
? { href: data.actionLink, target: '_blank', rel: 'noreferrer' }
|
|
317
|
+
: { component: RouterLink, to: data.actionLink })}
|
|
318
|
+
title={data.actionButtonLabel}
|
|
319
|
+
color="inherit"
|
|
320
|
+
underline="none"
|
|
321
|
+
className={classes.actionLink}
|
|
322
|
+
>
|
|
323
|
+
{data.actionButtonLabel}
|
|
324
|
+
</Link>
|
|
325
|
+
</div>
|
|
326
|
+
)}
|
|
327
|
+
</Grid>
|
|
305
328
|
)}
|
|
306
329
|
</Grid>
|
|
307
330
|
</div>
|
|
@@ -355,14 +378,62 @@ const styles = () => ({
|
|
|
355
378
|
fontWeight: 'bold',
|
|
356
379
|
}),
|
|
357
380
|
contentSection: {
|
|
358
|
-
padding: (props) => (props.data.imageLocation === 'right'
|
|
381
|
+
padding: (props) => ((props.data.imageLocation === 'right' || (props.data.actionButtonLabel && props.data.actionLink))
|
|
359
382
|
? '8px 25px 8px 25px !important' : '8px 0px 8px 25px !important'),
|
|
383
|
+
marginBottom: (props) => (props.data.marginBottom ? props.data.marginBottom : 0),
|
|
360
384
|
float: 'left',
|
|
361
385
|
background: 'white',
|
|
362
386
|
},
|
|
363
387
|
imageSection: {
|
|
364
388
|
float: 'left',
|
|
365
389
|
},
|
|
390
|
+
actionSection: {
|
|
391
|
+
display: 'flex',
|
|
392
|
+
width: '100%',
|
|
393
|
+
padding: '25px 25px 35px',
|
|
394
|
+
flexDirection: 'column',
|
|
395
|
+
alignItems: 'center',
|
|
396
|
+
flexShrink: 0,
|
|
397
|
+
border: '0.5px solid #98B5CB',
|
|
398
|
+
background: '#EBF3F7',
|
|
399
|
+
marginTop: '19px',
|
|
400
|
+
},
|
|
401
|
+
actionTitle: {
|
|
402
|
+
color: '#7A9BB1',
|
|
403
|
+
textAlign: 'center',
|
|
404
|
+
fontFamily: 'Lato',
|
|
405
|
+
fontSize: '19px',
|
|
406
|
+
fontStyle: 'normal',
|
|
407
|
+
fontWeight: '700',
|
|
408
|
+
lineHeight: '25px',
|
|
409
|
+
letterSpacing: '0.15px',
|
|
410
|
+
textTransform: 'uppercase',
|
|
411
|
+
wordBreak: 'break-word',
|
|
412
|
+
marginBottom: '22px',
|
|
413
|
+
},
|
|
414
|
+
actionLink: {
|
|
415
|
+
display: 'flex',
|
|
416
|
+
width: '210px',
|
|
417
|
+
height: 'fit-content',
|
|
418
|
+
minHeight: '45px',
|
|
419
|
+
justifyContent: 'center',
|
|
420
|
+
alignItems: 'center',
|
|
421
|
+
gap: '10px',
|
|
422
|
+
flexShrink: '0',
|
|
423
|
+
borderRadius: '10px',
|
|
424
|
+
border: '1px solid #42779A',
|
|
425
|
+
background: '#0E6292',
|
|
426
|
+
color: '#FFF',
|
|
427
|
+
textAlign: 'center',
|
|
428
|
+
fontFamily: 'Lato',
|
|
429
|
+
fontSize: '12px',
|
|
430
|
+
fontStyle: 'normal',
|
|
431
|
+
fontWeight: 600,
|
|
432
|
+
lineHeight: 'normal',
|
|
433
|
+
letterSpacing: '1px',
|
|
434
|
+
wordBreak: 'break-word',
|
|
435
|
+
padding: '15.5px',
|
|
436
|
+
},
|
|
366
437
|
aboutSection: {
|
|
367
438
|
padding: '0px 45px',
|
|
368
439
|
},
|
|
@@ -370,9 +441,9 @@ const styles = () => ({
|
|
|
370
441
|
width: '100%',
|
|
371
442
|
},
|
|
372
443
|
linkIcon: {
|
|
373
|
-
width: '
|
|
444
|
+
width: '1em',
|
|
374
445
|
verticalAlign: 'sub',
|
|
375
|
-
margin: '0px 0px 2px
|
|
446
|
+
margin: '0px 0px 2px 2px',
|
|
376
447
|
},
|
|
377
448
|
link: (props) => ({
|
|
378
449
|
color: props.linkColor,
|