keski_lib_catalog 1.4.3 → 1.5.0

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.
@@ -2,10 +2,10 @@ import React, { useState, useEffect } from 'react';
2
2
  import Carousel from 'react-material-ui-carousel';
3
3
  import { Box, Typography, Slide, Card, Chip, Button, CardMedia, Grid as Grid$1, useTheme, useMediaQuery, CardContent, Container, Accordion, AccordionSummary, AccordionDetails, Link } from '@mui/material';
4
4
  import Avatar from '@mui/material/Avatar';
5
- import { styled } from '@mui/material/styles';
6
- import Paper from '@mui/material/Paper';
7
5
  import Grid from '@mui/material/Grid';
8
6
  import Grow from '@mui/material/Grow';
7
+ import Paper from '@mui/material/Paper';
8
+ import { styled } from '@mui/material/styles';
9
9
  import Lottie from 'react-lottie';
10
10
 
11
11
  function _extends() {
@@ -74,13 +74,13 @@ function Layout1(content) {
74
74
  sx: {
75
75
  whiteSpace: 'pre-wrap',
76
76
  fontSize: {
77
- xs: "1.875em",
78
- sm: "2.25em",
79
- md: "3em",
80
- lg: "3em",
81
- xl: "3em"
77
+ xs: '1.875em',
78
+ sm: '2.25em',
79
+ md: '3em',
80
+ lg: '3em',
81
+ xl: '3em'
82
82
  },
83
- paddingBottom: "32px"
83
+ paddingBottom: '32px'
84
84
  }
85
85
  }), /*#__PURE__*/React.createElement(Carousel, {
86
86
  indicators: true,
@@ -158,16 +158,16 @@ function Item(props) {
158
158
  sx: {
159
159
  width: '120px',
160
160
  height: '120px',
161
- transform: "translate(\n " + content.image_transform_x + "%\n ,\n " + content.image_transform_y + "%)" + ("scale(" + (content.image_scale ? content.image_scale : "1") + ")")
161
+ transform: "translate(\n " + content.image_transform_x + "%\n ,\n " + content.image_transform_y + "%)" + ("scale(" + (content.image_scale ? content.image_scale : '1') + ")")
162
162
  }
163
163
  }))), /*#__PURE__*/React.createElement(Box, {
164
164
  sx: {
165
165
  width: {
166
- xs: "100%",
167
- xl: "72%",
168
- lg: "72%"
166
+ xs: '100%',
167
+ xl: '72%',
168
+ lg: '72%'
169
169
  },
170
- height: "100%",
170
+ height: '100%',
171
171
  overflow: 'hidden',
172
172
  textOverflow: 'ellipsis',
173
173
  display: '-webkit-box',
@@ -253,9 +253,9 @@ function Layout1$1(content) {
253
253
  xs: '100%'
254
254
  },
255
255
  height: {
256
- xs: '80vh',
257
- sm: "80vh",
258
- md: "80vh"
256
+ xs: '90vh',
257
+ sm: '50vh',
258
+ md: '95vh'
259
259
  },
260
260
  backgroundSize: 'cover',
261
261
  backgroundPosition: 'center',
@@ -277,21 +277,21 @@ function Layout1$1(content) {
277
277
  },
278
278
  justifyContent: 'center',
279
279
  paddingLeft: (_content$component$su = content.component.subcomponent[0]) !== null && _content$component$su !== void 0 && _content$component$su.image ? {
280
- lg: "24px",
281
- md: "24px",
282
- sm: "16px",
283
- xs: "16px"
280
+ lg: '24px',
281
+ md: '24px',
282
+ sm: '16px',
283
+ xs: '16px'
284
284
  } : {
285
- lg: "0px",
286
- md: "24px",
287
- sm: "16px",
288
- xs: "16px"
285
+ lg: '0px',
286
+ md: '24px',
287
+ sm: '16px',
288
+ xs: '16px'
289
289
  },
290
290
  paddingRight: {
291
- lg: "24px",
292
- md: "24px",
293
- sm: "16px",
294
- xs: "16px"
291
+ lg: '24px',
292
+ md: '24px',
293
+ sm: '16px',
294
+ xs: '16px'
295
295
  }
296
296
  }
297
297
  }, ((_content$component$su2 = content.component.subcomponent[0]) === null || _content$component$su2 === void 0 ? void 0 : _content$component$su2.label_active) && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Chip, {
@@ -313,13 +313,13 @@ function Layout1$1(content) {
313
313
  marginBottom: '16px',
314
314
  whiteSpace: 'pre-wrap',
315
315
  fontSize: {
316
- xs: "2em",
317
- sm: "2em",
318
- md: "3.75em",
319
- lg: "3.75em",
320
- xl: "3.75em"
316
+ xs: '2em',
317
+ sm: '2em',
318
+ md: '3.75em',
319
+ lg: '3.75em',
320
+ xl: '3.75em'
321
321
  },
322
- fontWeight: "bold"
322
+ fontWeight: 'bold'
323
323
  }
324
324
  }), /*#__PURE__*/React.createElement(Typography, {
325
325
  component: 'p',
@@ -330,11 +330,11 @@ function Layout1$1(content) {
330
330
  marginBottom: '16px',
331
331
  whiteSpace: 'pre-wrap',
332
332
  fontSize: {
333
- xs: "1.125em",
334
- sm: "1.125em",
335
- md: "1.125em",
336
- lg: "1.125em",
337
- xl: "1.125em"
333
+ xs: '1.125em',
334
+ sm: '1.125em',
335
+ md: '1.125em',
336
+ lg: '1.125em',
337
+ xl: '1.125em'
338
338
  }
339
339
  }
340
340
  }), ((_content$component$su10 = content.component.subcomponent[0]) === null || _content$component$su10 === void 0 ? void 0 : _content$component$su10.button_active) && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
@@ -384,7 +384,8 @@ function Layout1$2(content) {
384
384
  return /*#__PURE__*/React.createElement(Grid, {
385
385
  container: true,
386
386
  alignItems: "center",
387
- direction: content.component.justify_content != 'right' ? 'row' : 'row-reverse'
387
+ direction: content.component.justify_content != 'right' ? 'row' : 'row-reverse',
388
+ mt: 10
388
389
  }, /*#__PURE__*/React.createElement(Grid, {
389
390
  item: true,
390
391
  xs: 12,
@@ -398,25 +399,25 @@ function Layout1$2(content) {
398
399
  }, /*#__PURE__*/React.createElement(Item$1, {
399
400
  elevation: 0,
400
401
  sx: {
401
- height: "100%",
402
- width: "100%",
403
- background: "none"
402
+ height: '100%',
403
+ width: '100%',
404
+ background: 'none'
404
405
  }
405
406
  }, /*#__PURE__*/React.createElement(Card, {
406
407
  elevation: 0,
407
408
  sx: {
408
- borderRadius: "24px",
409
- background: "none",
409
+ borderRadius: '24px',
410
+ background: 'none',
410
411
  backgroundSize: 'center',
411
412
  backgroundPosition: 'center'
412
413
  }
413
414
  }, /*#__PURE__*/React.createElement(CardMedia, {
414
415
  component: "img",
415
416
  sx: {
416
- width: "100%",
417
+ width: '100%',
417
418
  backgroundSize: 'center',
418
419
  backgroundPosition: 'center',
419
- transform: "translate(\n " + ((_content$component$su = content.component.subcomponent[0]) === null || _content$component$su === void 0 ? void 0 : _content$component$su.image_transform_x) + "%\n ,\n " + ((_content$component$su2 = content.component.subcomponent[0]) === null || _content$component$su2 === void 0 ? void 0 : _content$component$su2.image_transform_y) + "%)" + ("scale(" + ((_content$component$su3 = content.component.subcomponent[0]) !== null && _content$component$su3 !== void 0 && _content$component$su3.image_scale ? (_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.image_scale : "1") + ")")
420
+ transform: "translate(\n " + ((_content$component$su = content.component.subcomponent[0]) === null || _content$component$su === void 0 ? void 0 : _content$component$su.image_transform_x) + "%\n ,\n " + ((_content$component$su2 = content.component.subcomponent[0]) === null || _content$component$su2 === void 0 ? void 0 : _content$component$su2.image_transform_y) + "%)" + ("scale(" + ((_content$component$su3 = content.component.subcomponent[0]) !== null && _content$component$su3 !== void 0 && _content$component$su3.image_scale ? (_content$component$su4 = content.component.subcomponent[0]) === null || _content$component$su4 === void 0 ? void 0 : _content$component$su4.image_scale : '1') + ")")
420
421
  },
421
422
  alt: (_content$component$su5 = content.component.subcomponent[0]) !== null && _content$component$su5 !== void 0 && _content$component$su5.title ? (_content$component$su6 = content.component.subcomponent[0]) === null || _content$component$su6 === void 0 ? void 0 : _content$component$su6.title : 'imagen Keski',
422
423
  image: (_content$component$su7 = content.component.subcomponent[0]) !== null && _content$component$su7 !== void 0 && _content$component$su7.image ? (_content$component$su8 = content.component.subcomponent[0]) === null || _content$component$su8 === void 0 ? void 0 : _content$component$su8.image.url : 'none'
@@ -430,10 +431,10 @@ function Layout1$2(content) {
430
431
  }, /*#__PURE__*/React.createElement(Item$1, {
431
432
  elevation: 0,
432
433
  sx: {
433
- height: "100%",
434
- width: "100%",
435
- background: "none",
436
- paddingTop: "48px"
434
+ height: '100%',
435
+ width: '100%',
436
+ background: 'none',
437
+ paddingTop: '48px'
437
438
  }
438
439
  })), /*#__PURE__*/React.createElement(Grid, {
439
440
  item: true,
@@ -452,9 +453,9 @@ function Layout1$2(content) {
452
453
  } ), /*#__PURE__*/React.createElement(Item$1, {
453
454
  elevation: 0,
454
455
  sx: {
455
- height: "100%",
456
- width: "100%",
457
- background: "none"
456
+ height: '100%',
457
+ width: '100%',
458
+ background: 'none'
458
459
  }
459
460
  }, /*#__PURE__*/React.createElement(Box, null, ((_content$component$su9 = content.component.subcomponent[0]) === null || _content$component$su9 === void 0 ? void 0 : _content$component$su9.label_active) && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Chip, {
460
461
  disabled: true,
@@ -478,11 +479,11 @@ function Layout1$2(content) {
478
479
  sx: {
479
480
  whiteSpace: 'pre-wrap',
480
481
  fontSize: {
481
- xs: "2em",
482
- sm: "2em",
483
- md: "2em",
484
- lg: "2em",
485
- xl: "2em"
482
+ xs: '2em',
483
+ sm: '2em',
484
+ md: '2em',
485
+ lg: '2em',
486
+ xl: '2em'
486
487
  }
487
488
  }
488
489
  })), /*#__PURE__*/React.createElement(Box, {
@@ -497,11 +498,11 @@ function Layout1$2(content) {
497
498
  sx: {
498
499
  whiteSpace: 'pre-wrap',
499
500
  fontSize: {
500
- xs: "1.125em",
501
- sm: "1.125em",
502
- md: "1.125em",
503
- lg: "1.125em",
504
- xl: "1.125em"
501
+ xs: '1.125em',
502
+ sm: '1.125em',
503
+ md: '1.125em',
504
+ lg: '1.125em',
505
+ xl: '1.125em'
505
506
  }
506
507
  }
507
508
  })), ((_content$component$su17 = content.component.subcomponent[0]) === null || _content$component$su17 === void 0 ? void 0 : _content$component$su17.button_active) && /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
@@ -570,17 +571,17 @@ function Layout1$3(content) {
570
571
  sx: {
571
572
  whiteSpace: 'pre-wrap',
572
573
  fontSize: {
573
- xs: "1.875em",
574
- sm: "2.25em",
575
- md: "3em",
576
- lg: "3em",
577
- xl: "3em"
574
+ xs: '1.875em',
575
+ sm: '2.25em',
576
+ md: '3em',
577
+ lg: '3em',
578
+ xl: '3em'
578
579
  },
579
- paddingBottom: "32px"
580
+ paddingBottom: '32px'
580
581
  }
581
582
  }), /*#__PURE__*/React.createElement(Grid$1, {
582
583
  container: true,
583
- spacing: 2,
584
+ spacing: 1,
584
585
  alignItems: "center",
585
586
  justifyContent: "center"
586
587
  }, (_content$component$su = content.component.subcomponent) === null || _content$component$su === void 0 ? void 0 : _content$component$su.map(function (img, index) {
@@ -596,7 +597,7 @@ function Layout1$3(content) {
596
597
  elevation: 0,
597
598
  sx: {
598
599
  borderRadius: '24px',
599
- width: "100%",
600
+ width: '100%',
600
601
  height: {
601
602
  xl: 350,
602
603
  lg: 350,
@@ -607,12 +608,12 @@ function Layout1$3(content) {
607
608
  }
608
609
  }, /*#__PURE__*/React.createElement(CardMedia, {
609
610
  component: "img",
610
- alt: img.description ? img.description : "",
611
+ alt: img.description ? img.description : '',
611
612
  image: img.image ? img.image.url ? img.image.url : 'none' : 'none',
612
613
  sx: {
613
- width: "100%",
614
- height: "100%",
615
- transform: "translate(\n " + img.image_transform_x + "%\n ,\n " + img.image_transform_y + "%)" + ("scale(" + (img.image_scale ? img.image_scale : "1") + ")")
614
+ width: '100%',
615
+ height: '100%',
616
+ transform: "translate(\n " + img.image_transform_x + "%\n ,\n " + img.image_transform_y + "%)" + ("scale(" + (img.image_scale ? img.image_scale : '1') + ")")
616
617
  }
617
618
  })));
618
619
  }))));
@@ -774,33 +775,19 @@ function Item$2(props) {
774
775
  return null;
775
776
  } else {
776
777
  return content.length >= 1 ? /*#__PURE__*/React.createElement(Carousel, {
777
- autoPlay: false,
778
- indicators: false,
779
- navButtonsAlwaysVisible: true,
780
- navButtonsProps: {
781
- style: {
782
- backgroundColor: 'transparent',
783
- borderRadius: 0,
784
- color: '#767676'
785
- }
786
- },
787
- navButtonsWrapperProps: {
788
- style: {
789
- top: '0',
790
- bottom: 'unset'
791
- }
792
- },
778
+ autoPlay: true,
779
+ indicators: true,
780
+ navButtonsAlwaysVisible: false,
793
781
  sx: {
794
782
  width: '100%',
795
- height: '520px',
796
- paddingTop: '70px',
797
- "& .css-hn784z": {
783
+ height: '620px',
784
+ '& .css-hn784z': {
798
785
  left: {
799
786
  xs: 'calc(100% - 120px)'
800
787
  },
801
788
  height: 'auto'
802
789
  },
803
- "& .css-1abc02a": {
790
+ '& .css-1abc02a': {
804
791
  height: 'auto'
805
792
  }
806
793
  }
@@ -808,23 +795,20 @@ function Item$2(props) {
808
795
  return /*#__PURE__*/React.createElement(Grid$1, {
809
796
  container: true,
810
797
  key: i,
811
- spacing: 3,
798
+ spacing: 1,
812
799
  sx: {
813
800
  margin: 'auto',
814
801
  padding: 'auto'
815
802
  }
816
- }, /*#__PURE__*/React.createElement(Box, {
817
- sx: {
818
- position: 'absolute',
819
- top: {
820
- xs: '-20px',
821
- sm: '-50px'
822
- }
823
- }
824
- }, /*#__PURE__*/React.createElement(Typography, {
803
+ }, /*#__PURE__*/React.createElement(Grid$1, {
804
+ container: true,
805
+ justifyContent: 'center',
806
+ marginBottom: 1
807
+ }, /*#__PURE__*/React.createElement(Box, null, ' ', /*#__PURE__*/React.createElement(Typography, {
808
+ textAlign: 'center',
825
809
  component: 'h2',
826
810
  dangerouslySetInnerHTML: {
827
- __html: title ? title : 'Agregue un título'
811
+ __html: title ? title : ''
828
812
  },
829
813
  sx: {
830
814
  height: '100%',
@@ -836,27 +820,34 @@ function Item$2(props) {
836
820
  xs: '1.875em'
837
821
  }
838
822
  }
839
- })), items.map(function (item, j) {
823
+ }))), items.map(function (item, j) {
840
824
  var _ref;
841
825
  return /*#__PURE__*/React.createElement(Grid$1, {
842
826
  item: true,
843
827
  key: j,
844
- sm: 6,
828
+ sm: 5,
845
829
  md: 4,
846
- lg: 3,
847
- xl: 3,
830
+ lg: 2.9,
831
+ xl: 2.9,
848
832
  sx: {
849
833
  margin: {
850
834
  xs: '0px',
851
835
  sm: '0px'
852
836
  },
853
- width: 'object-fit',
854
- display: 'flex',
837
+ display: {
838
+ xs: '',
839
+ sm: 'flex'
840
+ },
855
841
  justifyContent: 'center',
856
842
  alignItems: 'center',
857
843
  '&.MuiGrid-item': {
858
- paddingLeft: '10px',
859
- paddingTop: '10px'
844
+ paddingLeft: {
845
+ xs: '35px',
846
+ sm: '55px',
847
+ md: '20px',
848
+ lg: '12px',
849
+ xl: '12px'
850
+ }
860
851
  }
861
852
  }
862
853
  }, /*#__PURE__*/React.createElement(Slide, {
@@ -878,7 +869,7 @@ function Item$2(props) {
878
869
  image: item.image ? item.image.url ? item.image.url : 'none' : 'none',
879
870
  sx: {
880
871
  aspectRatio: '1/1',
881
- transform: "translate(\n " + item.image_transform_x + "%\n ,\n " + item.image_transform_y + "%)" + ("scale(" + (item.image_scale ? item.image_scale : "1") + ")")
872
+ transform: "translate(\n " + item.image_transform_x + "%\n ,\n " + item.image_transform_y + "%)" + ("scale(" + (item.image_scale ? item.image_scale : '1') + ")")
882
873
  }
883
874
  })), /*#__PURE__*/React.createElement(CardContent, {
884
875
  sx: {
@@ -888,12 +879,20 @@ function Item$2(props) {
888
879
  paddingBottom: '8px'
889
880
  }
890
881
  }
882
+ }, /*#__PURE__*/React.createElement(Grid$1, {
883
+ height: {
884
+ xs: '2vh',
885
+ sm: '2vh',
886
+ md: '3.1vh',
887
+ lg: '3.2vh',
888
+ xl: '3.2vh'
889
+ }
891
890
  }, /*#__PURE__*/React.createElement(Typography, {
892
- component: 'h3',
893
891
  dangerouslySetInnerHTML: {
894
892
  __html: item.title ? item.title : 'Agrega título'
895
893
  },
896
894
  sx: {
895
+ padding: '1px !important',
897
896
  display: '-webkit-box',
898
897
  WebkitLineClamp: 1,
899
898
  WebkitBoxOrient: 'vertical',
@@ -903,17 +902,19 @@ function Item$2(props) {
903
902
  fontSize: {
904
903
  xs: '1em',
905
904
  sm: '1em',
906
- md: '1em',
907
- lg: '1em',
908
- xl: '1em'
905
+ md: '1.3em',
906
+ lg: '1.3em',
907
+ xl: '1.3em'
909
908
  }
910
909
  }
911
- }), /*#__PURE__*/React.createElement(Typography, {
910
+ })), /*#__PURE__*/React.createElement(Grid$1, null, /*#__PURE__*/React.createElement(Typography, {
912
911
  component: 'p',
913
912
  dangerouslySetInnerHTML: {
914
913
  __html: item.subtitle ? item.subtitle : 'Agrega subtítulo'
915
914
  },
916
915
  sx: {
916
+ padding: '1px !important',
917
+ maxHeight: '40px',
917
918
  display: '-webkit-box',
918
919
  WebkitLineClamp: 2,
919
920
  WebkitBoxOrient: 'vertical',
@@ -928,7 +929,15 @@ function Item$2(props) {
928
929
  xl: '1em'
929
930
  }
930
931
  }
931
- }), item.button_active && /*#__PURE__*/React.createElement(Button, {
932
+ })), item.button_active && /*#__PURE__*/React.createElement(Grid$1, {
933
+ height: {
934
+ xs: '2vh',
935
+ sm: '2vh',
936
+ md: '2vh',
937
+ lg: '2vh',
938
+ xl: '2vh'
939
+ }
940
+ }, /*#__PURE__*/React.createElement(Button, {
932
941
  variant: "contained",
933
942
  href: item.button_action ? item.button_action : '#',
934
943
  target: item.link == 4 ? '_blank' : '_self',
@@ -939,7 +948,7 @@ function Item$2(props) {
939
948
  borderRadius: '50px',
940
949
  fontSize: '12px'
941
950
  }
942
- }, item.button_title ? item.button_title : 'Nombre botón')))));
951
+ }, item.button_title ? item.button_title : 'Nombre botón'))))));
943
952
  }));
944
953
  })) : /*#__PURE__*/React.createElement(Grid$1, {
945
954
  container: true,
@@ -998,7 +1007,7 @@ function Item$2(props) {
998
1007
  image: item.image.url ? item.image.url : 'https://via.placeholder.com/300x300.png?text=No+Image',
999
1008
  sx: {
1000
1009
  aspectRatio: '1/1',
1001
- transform: "translate(\n " + item.image_transform_x + "%\n ,\n " + item.image_transform_y + "%)" + ("scale(" + (item.image_scale ? item.image_scale : "1") + ")")
1010
+ transform: "translate(\n " + item.image_transform_x + "%\n ,\n " + item.image_transform_y + "%)" + ("scale(" + (item.image_scale ? item.image_scale : '1') + ")")
1002
1011
  }
1003
1012
  }), /*#__PURE__*/React.createElement(CardContent, {
1004
1013
  sx: {
@@ -1086,13 +1095,7 @@ var List = /*#__PURE__*/function (_AtomicElements) {
1086
1095
 
1087
1096
  function Layout1$6(content) {
1088
1097
  return /*#__PURE__*/React.createElement(Grid$1, {
1089
- container: true,
1090
- sx: {
1091
- minHeight: '250px',
1092
- width: '100%',
1093
- margin: 'auto',
1094
- padding: '0px'
1095
- }
1098
+ container: true
1096
1099
  }, /*#__PURE__*/React.createElement(Item$3, {
1097
1100
  title: content.component.title,
1098
1101
  content: content.component.subcomponent,
@@ -1141,13 +1144,13 @@ function Item$3(props) {
1141
1144
  } else {
1142
1145
  return content.length >= 1 ? /*#__PURE__*/React.createElement(Carousel, {
1143
1146
  autoPlay: true,
1144
- indicators: false,
1147
+ indicators: true,
1145
1148
  swipe: true,
1146
1149
  cycleNavigation: true,
1147
1150
  sx: {
1148
1151
  width: '100%',
1149
- height: '250px',
1150
- paddingTop: '60px',
1152
+ height: '40vh',
1153
+ paddingTop: '20px',
1151
1154
  position: 'relative'
1152
1155
  }
1153
1156
  }, arrayFourElements.map(function (items, p) {
@@ -1156,21 +1159,15 @@ function Item$3(props) {
1156
1159
  key: p
1157
1160
  }, /*#__PURE__*/React.createElement(Grid$1, {
1158
1161
  container: true,
1159
- spacing: 0,
1160
1162
  sx: {
1161
- margin: 'auto',
1162
1163
  padding: 'auto'
1163
1164
  }
1164
- }, /*#__PURE__*/React.createElement(Box, {
1165
- sx: {
1166
- position: 'absolute',
1167
- top: {
1168
- xs: '-40px',
1169
- sm: '-70px'
1170
- },
1171
- zIndex: 1
1172
- }
1173
- }, " ", /*#__PURE__*/React.createElement(Typography, {
1165
+ }, /*#__PURE__*/React.createElement(Grid$1, {
1166
+ container: true,
1167
+ justifyContent: 'center',
1168
+ marginBottom: 1
1169
+ }, /*#__PURE__*/React.createElement(Box, null, ' ', /*#__PURE__*/React.createElement(Typography, {
1170
+ textAlign: 'center',
1174
1171
  component: 'h2',
1175
1172
  dangerouslySetInnerHTML: {
1176
1173
  __html: title ? title : ''
@@ -1185,30 +1182,31 @@ function Item$3(props) {
1185
1182
  xs: '1.875em'
1186
1183
  }
1187
1184
  }
1188
- })), items.map(function (item, j) {
1189
- return /*#__PURE__*/React.createElement(Grid$1, {
1190
- item: true,
1191
- key: j,
1192
- xs: 12,
1193
- sm: 6,
1194
- md: 4,
1195
- lg: 3,
1196
- xl: 3,
1197
- sx: {
1198
- margin: {
1199
- xs: '0px',
1200
- sm: '0px'
1185
+ }))), /*#__PURE__*/React.createElement(Grid$1, {
1186
+ item: true,
1187
+ xs: 12,
1188
+ sm: 12,
1189
+ md: 12,
1190
+ lg: 12,
1191
+ xl: 12,
1192
+ sx: {
1193
+ width: 'object-fit',
1194
+ display: 'flex',
1195
+ justifyContent: 'center',
1196
+ alignItems: 'center',
1197
+ '&.MuiGrid-item': {
1198
+ paddingLeft: {
1199
+ xs: '80px',
1200
+ sm: '12px',
1201
+ md: '12px',
1202
+ lg: '12px',
1203
+ xl: '12px'
1201
1204
  },
1202
- width: 'object-fit',
1203
- display: 'flex',
1204
- justifyContent: 'center',
1205
- alignItems: 'center',
1206
- '&.MuiGrid-item': {
1207
- paddingLeft: '17px',
1208
- paddingTop: '10px'
1209
- }
1205
+ paddingTop: '10px'
1210
1206
  }
1211
- }, /*#__PURE__*/React.createElement(Slide, {
1207
+ }
1208
+ }, items.map(function (item, j) {
1209
+ return /*#__PURE__*/React.createElement(Slide, {
1212
1210
  direction: "left",
1213
1211
  "in": visible
1214
1212
  }, /*#__PURE__*/React.createElement(Card, {
@@ -1216,20 +1214,23 @@ function Item$3(props) {
1216
1214
  sx: {
1217
1215
  width: '100%',
1218
1216
  height: '100%',
1217
+ maxHeight: '200px',
1219
1218
  borderRadius: '10px',
1220
- background: 'none'
1219
+ background: 'none',
1220
+ margin: 'auto'
1221
1221
  }
1222
1222
  }, /*#__PURE__*/React.createElement(CardMedia, {
1223
1223
  component: "img",
1224
1224
  image: item.image ? item.image.url ? item.image.url : 'none' : 'none',
1225
1225
  alt: item.title ? item.title : 'none',
1226
1226
  sx: {
1227
- width: '100%',
1228
- height: '140px',
1229
- transform: "translate(" + item.image_transform_x + "%, " + item.image_transform_y + "%) scale(" + (item.image_scale ? item.image_scale : '1') + ")"
1227
+ width: '200px',
1228
+ height: 'auto',
1229
+ maxHeight: '200px',
1230
+ objectFit: 'contain'
1230
1231
  }
1231
- }))));
1232
- })));
1232
+ })));
1233
+ }))));
1233
1234
  })) : null;
1234
1235
  }
1235
1236
  }
@@ -1363,8 +1364,10 @@ function CanvasContainer(props) {
1363
1364
  backgroundColor: json.component.bg_type === 1 ? json.component.bg_color1 : undefined,
1364
1365
  backgroundImage: json.component.bg_type === 2 ? "linear-gradient(to " + json.component.bg_gradiant_orientation + ", " + json.component.bg_color1 + ", " + json.component.bg_color2 + ")" : json.component.bg_type === 3 ? "url(" + ((_json$component$bg_im = json.component.bg_image) === null || _json$component$bg_im === void 0 ? void 0 : _json$component$bg_im.url) + ")" : undefined,
1365
1366
  backgroundPosition: 'center',
1367
+ backgroundAttachment: 'fixed',
1366
1368
  backgroundSize: 'cover',
1367
- backgroundRepeat: 'no-repeat'
1369
+ backgroundRepeat: 'no-repeat',
1370
+ justifyContent: 'center'
1368
1371
  }
1369
1372
  }, /*#__PURE__*/React.createElement(Box, {
1370
1373
  sx: {
@@ -3080,39 +3083,39 @@ function Layout(content) {
3080
3083
  preserveAspectRatio: 'xMidYMid slice'
3081
3084
  }
3082
3085
  };
3083
- var callToAction = "Ingresa a Keski Creator desde tu panel administrativo para editar esta vista.";
3086
+ var callToAction = 'Ingresa a Keski Creator desde tu panel administrativo para editar esta vista.';
3084
3087
  var infoLoadingMap = {
3085
3088
  'landing/content/1': {
3086
- title: "Página de inicio",
3087
- description: "Esta página es muy importante, aquí es la primera impresión de tus clientes. Agrega las secciones necesarias para que tu cliente te conozca, utiliza un diseño agradable y atractivo para captar su atención desde el primer momento. Personaliza el contenido para reflejar la esencia de tu marca y los valores de tu negocio."
3089
+ title: 'Página de inicio',
3090
+ description: 'Esta página es muy importante, aquí es la primera impresión de tus clientes. Agrega las secciones necesarias para que tu cliente te conozca, utiliza un diseño agradable y atractivo para captar su atención desde el primer momento. Personaliza el contenido para reflejar la esencia de tu marca y los valores de tu negocio.'
3088
3091
  },
3089
3092
  'landing/content/2': {
3090
- title: "Productos",
3091
- description: "En esta sección puedes detallar los productos que ofreces. Organiza tu catálogo y facilita la navegación."
3093
+ title: 'Productos',
3094
+ description: 'En esta sección puedes detallar los productos que ofreces. Organiza tu catálogo y facilita la navegación.'
3092
3095
  },
3093
3096
  'landing/content/3': {
3094
- title: "Nosotros",
3095
- description: "Aquí puedes contar la historia de tu empresa, presentar a tu equipo y destacar tus valores y misión. Es una excelente oportunidad para generar confianza y credibilidad. Usa esta sección para humanizar tu marca y conectar emocionalmente con tus visitantes."
3097
+ title: 'Nosotros',
3098
+ description: 'Aquí puedes contar la historia de tu empresa, presentar a tu equipo y destacar tus valores y misión. Es una excelente oportunidad para generar confianza y credibilidad. Usa esta sección para humanizar tu marca y conectar emocionalmente con tus visitantes.'
3096
3099
  },
3097
3100
  'landing/content/4': {
3098
- title: "Catálogo",
3099
- description: "Muestra una lista detallada de todos los productos o servicios que ofreces. Organiza tu catálogo de manera que sea fácil de navegar y busca resaltar tus productos más populares o nuevos lanzamientos. Puedes incluir filtros y categorías para mejorar la experiencia del usuario."
3101
+ title: 'Catálogo',
3102
+ description: 'Muestra una lista detallada de todos los productos o servicios que ofreces. Organiza tu catálogo de manera que sea fácil de navegar y busca resaltar tus productos más populares o nuevos lanzamientos. Puedes incluir filtros y categorías para mejorar la experiencia del usuario.'
3100
3103
  },
3101
3104
  'landing/content/5': {
3102
- title: "Servicios",
3103
- description: "En esta página puedes detallar los diferentes servicios que ofreces. Describe cada servicio de manera clara y concisa, incluyendo sus beneficios y características. Utiliza imágenes y testimonios para reforzar la calidad de tus servicios y motivar a los visitantes a contactarte."
3105
+ title: 'Servicios',
3106
+ description: 'En esta página puedes detallar los diferentes servicios que ofreces. Describe cada servicio de manera clara y concisa, incluyendo sus beneficios y características. Utiliza imágenes y testimonios para reforzar la calidad de tus servicios y motivar a los visitantes a contactarte.'
3104
3107
  },
3105
3108
  'landing/content/6': {
3106
- title: "Blog",
3107
- description: "Comparte artículos, noticias y actualizaciones relacionadas con tu negocio. Un blog activo puede mejorar tu SEO y mantener a tus clientes informados y comprometidos. Publica contenido relevante y útil que pueda interesar a tus visitantes y mostrar tu expertise en la industria."
3109
+ title: 'Blog',
3110
+ description: 'Comparte artículos, noticias y actualizaciones relacionadas con tu negocio. Un blog activo puede mejorar tu SEO y mantener a tus clientes informados y comprometidos. Publica contenido relevante y útil que pueda interesar a tus visitantes y mostrar tu expertise en la industria.'
3108
3111
  },
3109
3112
  'landing/content/7': {
3110
- title: "Ubicación",
3111
- description: "Aquí puedes mostrar a tus clientes dónde estás ubicado. Incluye un mapa interactivo, tu dirección completa y cualquier otra información de contacto relevante. Si tienes varias ubicaciones, asegúrate de incluir detalles para cada una. También puedes agregar instrucciones sobre cómo llegar y el horario de atención."
3113
+ title: 'Ubicación',
3114
+ description: 'Aquí puedes mostrar a tus clientes dónde estás ubicado. Incluye un mapa interactivo, tu dirección completa y cualquier otra información de contacto relevante. Si tienes varias ubicaciones, asegúrate de incluir detalles para cada una. También puedes agregar instrucciones sobre cómo llegar y el horario de atención.'
3112
3115
  },
3113
- 'placeholder': {
3114
- title: "En construccion",
3115
- description: "Bienvenido a la página principal. Aquí encontrarás información general y acceso a las diferentes secciones."
3116
+ placeholder: {
3117
+ title: 'En construccion',
3118
+ description: 'Bienvenido a la página principal. Aquí encontrarás información general y acceso a las diferentes secciones.'
3116
3119
  }
3117
3120
  };
3118
3121
  var visible = true;
@@ -3126,8 +3129,8 @@ function Layout(content) {
3126
3129
  },
3127
3130
  height: {
3128
3131
  xs: '80vh',
3129
- sm: "80vh",
3130
- md: "80vh"
3132
+ sm: '80vh',
3133
+ md: '80vh'
3131
3134
  },
3132
3135
  backgroundPosition: 'center',
3133
3136
  justifyContent: 'center',
@@ -3147,18 +3150,18 @@ function Layout(content) {
3147
3150
  lg: '80vh'
3148
3151
  },
3149
3152
  justifyContent: 'center',
3150
- alignItems: "center",
3153
+ alignItems: 'center',
3151
3154
  paddingLeft: {
3152
- lg: "0px",
3153
- md: "24px",
3154
- sm: "16px",
3155
- xs: "16px"
3155
+ lg: '0px',
3156
+ md: '24px',
3157
+ sm: '16px',
3158
+ xs: '16px'
3156
3159
  },
3157
3160
  paddingRight: {
3158
- lg: "24px",
3159
- md: "24px",
3160
- sm: "16px",
3161
- xs: "16px"
3161
+ lg: '24px',
3162
+ md: '24px',
3163
+ sm: '16px',
3164
+ xs: '16px'
3162
3165
  },
3163
3166
  textAlign: 'center'
3164
3167
  }
@@ -3168,11 +3171,11 @@ function Layout(content) {
3168
3171
  marginBottom: '16px',
3169
3172
  whiteSpace: 'pre-wrap',
3170
3173
  fontSize: {
3171
- xs: "2em",
3172
- sm: "2em",
3173
- md: "3.75em",
3174
- lg: "3.75em",
3175
- xl: "3.75em"
3174
+ xs: '2em',
3175
+ sm: '2em',
3176
+ md: '3.75em',
3177
+ lg: '3.75em',
3178
+ xl: '3.75em'
3176
3179
  },
3177
3180
  color: '#60269E'
3178
3181
  }
@@ -3182,11 +3185,11 @@ function Layout(content) {
3182
3185
  marginBottom: '16px',
3183
3186
  justifyContent: 'center',
3184
3187
  fontSize: {
3185
- xs: "1.25em",
3186
- sm: "1.25em",
3187
- md: "1.25em",
3188
- lg: "1.25em",
3189
- xl: "1.25em"
3188
+ xs: '1.25em',
3189
+ sm: '1.25em',
3190
+ md: '1.25em',
3191
+ lg: '1.25em',
3192
+ xl: '1.25em'
3190
3193
  }
3191
3194
  }
3192
3195
  }, infoLoadingMap[content.component.view_placeholder].description), /*#__PURE__*/React.createElement(Lottie, {
@@ -3199,11 +3202,11 @@ function Layout(content) {
3199
3202
  marginBottom: '16px',
3200
3203
  justifyContent: 'center',
3201
3204
  fontSize: {
3202
- xs: "1.25em",
3203
- sm: "1.25em",
3204
- md: "1.25em",
3205
- lg: "1.25em",
3206
- xl: "1.25em"
3205
+ xs: '1.25em',
3206
+ sm: '1.25em',
3207
+ md: '1.25em',
3208
+ lg: '1.25em',
3209
+ xl: '1.25em'
3207
3210
  }
3208
3211
  }
3209
3212
  }, callToAction))));