cmspageblocks 1.0.9 → 1.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/build/index.js
CHANGED
|
@@ -3090,7 +3090,7 @@ function _taggedTemplateLiteral(strings, raw) {
|
|
|
3090
3090
|
}
|
|
3091
3091
|
|
|
3092
3092
|
var _templateObject$2;
|
|
3093
|
-
var SliderContainer = styled__default["default"].div(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n.carousel .control-arrow,.carousel.carousel-slider .control-arrow{-webkit-transition:all .25s ease-in;-moz-transition:all .25s ease-in;-ms-transition:all .25s ease-in;-o-transition:all .25s ease-in;transition:all .25s ease-in;opacity:.4;filter:alpha(opacity=40);position:absolute;z-index:2;top:20px;background:none;border:0;font-size:32px;cursor:pointer}.carousel .control-arrow:focus,.carousel .control-arrow:hover{opacity:1;filter:alpha(opacity=100)}.carousel .control-arrow:before,.carousel.carousel-slider .control-arrow:before{margin:0 5px;display:inline-block;border-top:8px solid transparent;border-bottom:8px solid transparent;content:''}.carousel .control-disabled.control-arrow{opacity:0;filter:alpha(opacity=0);cursor:inherit;display:none}.carousel .control-prev.control-arrow{left:0}.carousel .control-prev.control-arrow:before{border-right:8px solid #fff}.carousel .control-next.control-arrow{right:0}.carousel .control-next.control-arrow:before{border-left:8px solid #fff}.carousel-root{outline:none}.carousel{position:relative;width:100%}.carousel *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.carousel img{width:100%;display:inline-block;pointer-events:none}.carousel .carousel{position:relative}.carousel .control-arrow{outline:0;border:0;background:none;top:50%;margin-top:-13px;font-size:18px}.carousel .thumbs-wrapper{margin:20px;overflow:hidden}.carousel .thumbs{-webkit-transition:all .15s ease-in;-moz-transition:all .15s ease-in;-ms-transition:all .15s ease-in;-o-transition:all .15s ease-in;transition:all .15s ease-in;-webkit-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0);-ms-transform:translate3d(0, 0, 0);-o-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);position:relative;list-style:none;white-space:nowrap}.carousel .thumb{-webkit-transition:border .15s ease-in;-moz-transition:border .15s ease-in;-ms-transition:border .15s ease-in;-o-transition:border .15s ease-in;transition:border .15s ease-in;display:inline-block;margin-right:6px;white-space:nowrap;overflow:hidden;border:3px solid #fff;padding:2px}.carousel .thumb:focus{border:3px solid #ccc;outline:none}.carousel .thumb.selected,.carousel .thumb:hover{border:3px solid #333}.carousel .thumb img{vertical-align:top}.carousel.carousel-slider{position:relative;margin:0;overflow:hidden}.carousel.carousel-slider .control-arrow{top:0;color:#fff;font-size:26px;bottom:0;margin-top:0;padding:5px}.carousel.carousel-slider .control-arrow:hover{background:rgba(0,0,0,0.2)}.carousel .slider-wrapper{overflow:hidden;margin:auto;width:100%;-webkit-transition:height .15s ease-in;-moz-transition:height .15s ease-in;-ms-transition:height .15s ease-in;-o-transition:height .15s ease-in;transition:height .15s ease-in}.carousel .slider-wrapper.axis-horizontal .slider{-ms-box-orient:horizontal;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-moz-flex;display:-webkit-flex;display:flex}.carousel .slider-wrapper.axis-horizontal .slider .slide{flex-direction:column;flex-flow:column}.carousel .slider-wrapper.axis-vertical{-ms-box-orient:horizontal;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-moz-flex;display:-webkit-flex;display:flex}.carousel .slider-wrapper.axis-vertical .slider{-webkit-flex-direction:column;flex-direction:column}.carousel .slider{margin:0;padding:0;position:relative;list-style:none;width:100%}.carousel .slider.animated{-webkit-transition:all .35s ease-in-out;-moz-transition:all .35s ease-in-out;-ms-transition:all .35s ease-in-out;-o-transition:all .35s ease-in-out;transition:all .35s ease-in-out}.carousel .slide{min-width:100%;margin:0;position:relative;text-align:center}.carousel .slide img{width:100%;vertical-align:top;border:0}.carousel .slide iframe{display:inline-block;width:calc(100% - 80px);margin:0 40px 40px;border:0}.carousel .slide .legend{-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out;transition:all .5s ease-in-out;position:absolute;bottom:40px;left:50%;margin-left:-45%;width:90%;border-radius:10px;background:#000;color:#fff;padding:10px;font-size:12px;text-align:center;opacity:0.25;-webkit-transition:opacity .35s ease-in-out;-moz-transition:opacity .35s ease-in-out;-ms-transition:opacity .35s ease-in-out;-o-transition:opacity .35s ease-in-out;transition:opacity .35s ease-in-out}.carousel .control-dots{position:absolute;bottom:0;margin:10px 0;padding:0;text-align:center;width:100%;z-index:1}@media (min-width: 960px){.carousel .control-dots{bottom:0}}.carousel .control-dots .dot{-webkit-transition:opacity .25s ease-in;-moz-transition:opacity .25s ease-in;-ms-transition:opacity .25s ease-in;-o-transition:opacity .25s ease-in;transition:opacity .25s ease-in;opacity:.3;filter:alpha(opacity=30);box-shadow:1px 1px 2px rgba(0,0,0,0.9);background:#fff;border-radius:50%;width:8px;height:8px;cursor:pointer;display:inline-block;margin:0 8px}.carousel .control-dots .dot.selected,.carousel .control-dots .dot:hover{opacity:1;filter:alpha(opacity=100)}.carousel .carousel-status{position:absolute;top:0;right:0;padding:5px;font-size:10px;text-shadow:1px 1px 1px rgba(0,0,0,0.9);color:#fff}.carousel:hover .slide .legend{opacity:1}\n ul li {\n padding: 0;\n }\n div img {\n object-fit: cover;\n }\n .carousel .thumbs-wrapper {\n margin: 16px;\n }\n max-width: 100%;\n .carousel .thumbs {\n padding: 0;\n }\n\n"])));
|
|
3093
|
+
var SliderContainer = styled__default["default"].div(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n.carousel .control-arrow,.carousel.carousel-slider .control-arrow{-webkit-transition:all .25s ease-in;-moz-transition:all .25s ease-in;-ms-transition:all .25s ease-in;-o-transition:all .25s ease-in;transition:all .25s ease-in;opacity:.4;filter:alpha(opacity=40);position:absolute;z-index:2;top:20px;background:none;border:0;font-size:32px;cursor:pointer}.carousel .control-arrow:focus,.carousel .control-arrow:hover{opacity:1;filter:alpha(opacity=100)}.carousel .control-arrow:before,.carousel.carousel-slider .control-arrow:before{margin:0 5px;display:inline-block;border-top:8px solid transparent;border-bottom:8px solid transparent;content:''}.carousel .control-disabled.control-arrow{opacity:0;filter:alpha(opacity=0);cursor:inherit;display:none}.carousel .control-prev.control-arrow{left:0}.carousel .control-prev.control-arrow:before{border-right:8px solid #fff}.carousel .control-next.control-arrow{right:0}.carousel .control-next.control-arrow:before{border-left:8px solid #fff}.carousel-root{outline:none}.carousel{position:relative;width:100%}.carousel *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.carousel img{width:100%;display:inline-block;pointer-events:none}.carousel .carousel{position:relative}.carousel .control-arrow{outline:0;border:0;background:none;top:50%;margin-top:-13px;font-size:18px}.carousel .thumbs-wrapper{margin:20px;overflow:hidden}.carousel .thumbs{-webkit-transition:all .15s ease-in;-moz-transition:all .15s ease-in;-ms-transition:all .15s ease-in;-o-transition:all .15s ease-in;transition:all .15s ease-in;-webkit-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0);-ms-transform:translate3d(0, 0, 0);-o-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);position:relative;list-style:none;white-space:nowrap}.carousel .thumb{-webkit-transition:border .15s ease-in;-moz-transition:border .15s ease-in;-ms-transition:border .15s ease-in;-o-transition:border .15s ease-in;transition:border .15s ease-in;display:inline-block;margin-right:6px;white-space:nowrap;overflow:hidden;border:3px solid #fff;padding:2px}.carousel .thumb:focus{border:3px solid #ccc;outline:none}.carousel .thumb.selected,.carousel .thumb:hover{border:3px solid #333}.carousel .thumb img{vertical-align:top}.carousel.carousel-slider{position:relative;margin:0;overflow:hidden}.carousel.carousel-slider .control-arrow{top:0;color:#fff;font-size:26px;bottom:0;margin-top:0;padding:5px}.carousel.carousel-slider .control-arrow:hover{background:rgba(0,0,0,0.2)}.carousel .slider-wrapper{overflow:hidden;margin:auto;width:100%;-webkit-transition:height .15s ease-in;-moz-transition:height .15s ease-in;-ms-transition:height .15s ease-in;-o-transition:height .15s ease-in;transition:height .15s ease-in}.carousel .slider-wrapper.axis-horizontal .slider{-ms-box-orient:horizontal;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-moz-flex;display:-webkit-flex;display:flex}.carousel .slider-wrapper.axis-horizontal .slider .slide{flex-direction:column;flex-flow:column}.carousel .slider-wrapper.axis-vertical{-ms-box-orient:horizontal;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-moz-flex;display:-webkit-flex;display:flex}.carousel .slider-wrapper.axis-vertical .slider{-webkit-flex-direction:column;flex-direction:column}.carousel .slider{margin:0;padding:0;position:relative;list-style:none;width:100%}.carousel .slider.animated{-webkit-transition:all .35s ease-in-out;-moz-transition:all .35s ease-in-out;-ms-transition:all .35s ease-in-out;-o-transition:all .35s ease-in-out;transition:all .35s ease-in-out}.carousel .slide{min-width:100%;margin:0;position:relative;text-align:center}.carousel .slide img{width:100%;vertical-align:top;border:0}.carousel .slide iframe{display:inline-block;width:calc(100% - 80px);margin:0 40px 40px;border:0}.carousel .slide .legend{-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out;transition:all .5s ease-in-out;position:absolute;bottom:40px;left:50%;margin-left:-45%;width:90%;border-radius:10px;background:#000;color:#fff;padding:10px;font-size:12px;text-align:center;opacity:0.25;-webkit-transition:opacity .35s ease-in-out;-moz-transition:opacity .35s ease-in-out;-ms-transition:opacity .35s ease-in-out;-o-transition:opacity .35s ease-in-out;transition:opacity .35s ease-in-out}.carousel .control-dots{position:absolute;bottom:0;margin:10px 0;padding:0;text-align:center;width:100%;z-index:1}@media (min-width: 960px){.carousel .control-dots{bottom:0}}.carousel .control-dots .dot{-webkit-transition:opacity .25s ease-in;-moz-transition:opacity .25s ease-in;-ms-transition:opacity .25s ease-in;-o-transition:opacity .25s ease-in;transition:opacity .25s ease-in;opacity:.3;filter:alpha(opacity=30);box-shadow:1px 1px 2px rgba(0,0,0,0.9);background:#fff;border-radius:50%;width:8px;height:8px;cursor:pointer;display:inline-block;margin:0 8px}.carousel .control-dots .dot.selected,.carousel .control-dots .dot:hover{opacity:1;filter:alpha(opacity=100)}.carousel .carousel-status{position:absolute;top:0;right:0;padding:5px;font-size:10px;text-shadow:1px 1px 1px rgba(0,0,0,0.9);color:#fff}.carousel:hover .slide .legend{opacity:1}\n ul li {\n padding: 0;\n }\n div img {\n object-fit: cover;\n }\n .carousel .thumbs-wrapper {\n margin: 16px;\n }\n max-width: 100%;\n width: 100%;\n .carousel .thumbs {\n padding: 0;\n }\n\n"])));
|
|
3094
3094
|
|
|
3095
3095
|
function ImageGallery(_ref) {
|
|
3096
3096
|
var options = _ref.options;
|
|
@@ -3117,6 +3117,7 @@ function ImageSlider(_ref) {
|
|
|
3117
3117
|
return /*#__PURE__*/React__default["default"].createElement(SliderContainer, null, /*#__PURE__*/React__default["default"].createElement(js.Carousel, {
|
|
3118
3118
|
showThumbs: false,
|
|
3119
3119
|
swipeable: true,
|
|
3120
|
+
showStatus: false,
|
|
3120
3121
|
dynamicHeight: true,
|
|
3121
3122
|
width: "100%"
|
|
3122
3123
|
}, options.content.map(function (slide) {
|
|
@@ -67776,7 +67777,7 @@ var MEDIA = Object.keys(BREAKPOINTS).reduce(function (acc, label) {
|
|
|
67776
67777
|
}, {});
|
|
67777
67778
|
|
|
67778
67779
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
67779
|
-
var BlockContainer = styled__default["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\ndisplay: flex;\nflex-direction: row;\nflex-wrap: wrap;\n
|
|
67780
|
+
var BlockContainer = styled__default["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\ndisplay: flex;\nflex-direction: row;\nflex-wrap: wrap;\n", ";\n.ql-align-center {\n text-align: center;\n}\nul {\n list-style: initial;\n list-style-position: outside;\n padding: 0 0 0 16px;\n li {\n font-size: 1.6rem;\n line-height: 2.4rem;\n padding: 4px 0;\n }\n}\nh1 {\n font-size: 2.8rem;\n line-height: 3.4rem;\n padding: 24px 0 16px;\n}\nh2 {\n font-size: 2.2rem;\n line-height: 2.8rem;\n padding: 16px 0 8px;\n}\np {\n font-size: 1.6rem;\n line-height: 2.4rem;\n max-width: 75ch;\n margin: 0;\n}\ndiv {\n box-sizing: border-box;\n}\nimg {\n display: block;\n width: 100%;\n max-width: 100%;\n /* position: absolute; */\n}\n.half {\n width: 50%;\n ", ";\n}\n.col {\n &-12 {\n width: 100%;\n }\n &-1 {\n width: calc(1 / 12 * 100%);\n }\n &-2 {\n width: calc(2 / 12 * 100%);\n }\n &-3 {\n width: calc(3 / 12 * 100%);\n }\n &-4 {\n width: calc(4 / 12 * 100%);\n }\n &-5 {\n width: calc(5 / 12 * 100%);\n }\n &-6 {\n width: calc(50%);\n }\n &-7 {\n width: calc(7 / 12 * 100%);\n }\n &-8 {\n width: calc(8 / 12 * 100%);\n }\n &-9 {\n width: calc(9 / 12 * 100%);\n }\n &-10 {\n width: calc(10 / 12 * 100%);\n }\n &-11 {\n width: calc(11 / 12 * 100%);\n }\n}\n.center {\n margin: 0 auto;\n}\n", ";\na {\n /* padding: 2px 0; */\n color: ", " !important;\n text-decoration: none;\n position: relative;\n &:before {\n transition: 0.2s all ease-in;\n position: absolute;\n content: '';\n height: 1px;\n width: 20px;\n bottom: 0;\n left: 0;\n background: ", ";\n }\n &:hover {\n &:before {\n width: 100%;\n }\n }\n}\n.image-gallery-fullscreen-button.active {\n top: 0;\n bottom: auto;\n background-color: #000;\n &:before {\n content: '\\274c';\n }\n}\n.image-gallery-content {\n .image-gallery-image {\n img {\n max-height: 500px;\n height: 500px;\n ", ";\n }\n }\n}\n.image-gallery-content.fullscreen {\n .image-gallery-image {\n img {\n /* max-height: 75vh; */\n width: auto;\n margin: 0 auto;\n }\n }\n}\n\n.image-gallery {\n max-width: 100%;\n overflow: hidden;\n}\n.page_row {\n max-width: 1240px;\n width: 100%;\n margin: 0px auto;\n padding: 16px;\n width: 100%;\n flex-direction: column;\n @media (min-width: 676px) {\n // flex-direction: row;\n }\n &.full-width {\n max-width: 100%;\n padding: 0;\n }\n\n &.container-width {\n margin: 0 auto;\n @media (min-width: 676px) {\n max-width: 640px;\n }\n\n @media (min-width: 868px) {\n max-width: 820px;\n }\n\n @media (min-width: 992px) {\n max-width: 960px;\n }\n\n @media (min-width: 1290px) {\n max-width: 1260px;\n }\n }\n }\n"], ["\ndisplay: flex;\nflex-direction: row;\nflex-wrap: wrap;\n", ";\n.ql-align-center {\n text-align: center;\n}\nul {\n list-style: initial;\n list-style-position: outside;\n padding: 0 0 0 16px;\n li {\n font-size: 1.6rem;\n line-height: 2.4rem;\n padding: 4px 0;\n }\n}\nh1 {\n font-size: 2.8rem;\n line-height: 3.4rem;\n padding: 24px 0 16px;\n}\nh2 {\n font-size: 2.2rem;\n line-height: 2.8rem;\n padding: 16px 0 8px;\n}\np {\n font-size: 1.6rem;\n line-height: 2.4rem;\n max-width: 75ch;\n margin: 0;\n}\ndiv {\n box-sizing: border-box;\n}\nimg {\n display: block;\n width: 100%;\n max-width: 100%;\n /* position: absolute; */\n}\n.half {\n width: 50%;\n ", ";\n}\n.col {\n &-12 {\n width: 100%;\n }\n &-1 {\n width: calc(1 / 12 * 100%);\n }\n &-2 {\n width: calc(2 / 12 * 100%);\n }\n &-3 {\n width: calc(3 / 12 * 100%);\n }\n &-4 {\n width: calc(4 / 12 * 100%);\n }\n &-5 {\n width: calc(5 / 12 * 100%);\n }\n &-6 {\n width: calc(50%);\n }\n &-7 {\n width: calc(7 / 12 * 100%);\n }\n &-8 {\n width: calc(8 / 12 * 100%);\n }\n &-9 {\n width: calc(9 / 12 * 100%);\n }\n &-10 {\n width: calc(10 / 12 * 100%);\n }\n &-11 {\n width: calc(11 / 12 * 100%);\n }\n}\n.center {\n margin: 0 auto;\n}\n", ";\na {\n /* padding: 2px 0; */\n color: ", " !important;\n text-decoration: none;\n position: relative;\n &:before {\n transition: 0.2s all ease-in;\n position: absolute;\n content: '';\n height: 1px;\n width: 20px;\n bottom: 0;\n left: 0;\n background: ", ";\n }\n &:hover {\n &:before {\n width: 100%;\n }\n }\n}\n.image-gallery-fullscreen-button.active {\n top: 0;\n bottom: auto;\n background-color: #000;\n &:before {\n content: '\\\\274c';\n }\n}\n.image-gallery-content {\n .image-gallery-image {\n img {\n max-height: 500px;\n height: 500px;\n ", ";\n }\n }\n}\n.image-gallery-content.fullscreen {\n .image-gallery-image {\n img {\n /* max-height: 75vh; */\n width: auto;\n margin: 0 auto;\n }\n }\n}\n\n.image-gallery {\n max-width: 100%;\n overflow: hidden;\n}\n.page_row {\n max-width: 1240px;\n width: 100%;\n margin: 0px auto;\n padding: 16px;\n width: 100%;\n flex-direction: column;\n @media (min-width: 676px) {\n // flex-direction: row;\n }\n &.full-width {\n max-width: 100%;\n padding: 0;\n }\n\n &.container-width {\n margin: 0 auto;\n @media (min-width: 676px) {\n max-width: 640px;\n }\n\n @media (min-width: 868px) {\n max-width: 820px;\n }\n\n @media (min-width: 992px) {\n max-width: 960px;\n }\n\n @media (min-width: 1290px) {\n max-width: 1260px;\n }\n }\n }\n"])), MEDIA.TABLET(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n margin: 80px 0 0;\n"]))), MEDIA.PHONE(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n width: 100%;\n "]))), MEDIA.TABLET(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {\n width: 100%;\n }\n "]))), function (props) {
|
|
67780
67781
|
return props.theme.linkColor;
|
|
67781
67782
|
}, function (props) {
|
|
67782
67783
|
return props.theme.primaryColor;
|
package/package.json
CHANGED
package/src/Main.css.js
CHANGED
|
@@ -5,7 +5,6 @@ export const BlockContainer = styled.div`
|
|
|
5
5
|
display: flex;
|
|
6
6
|
flex-direction: row;
|
|
7
7
|
flex-wrap: wrap;
|
|
8
|
-
/* padding: 0 0 80px; */
|
|
9
8
|
${MEDIA.TABLET`
|
|
10
9
|
margin: 80px 0 0;
|
|
11
10
|
`};
|
|
@@ -153,8 +152,7 @@ a {
|
|
|
153
152
|
max-width: 100%;
|
|
154
153
|
overflow: hidden;
|
|
155
154
|
}
|
|
156
|
-
.page_row
|
|
157
|
-
.row {
|
|
155
|
+
.page_row {
|
|
158
156
|
max-width: 1240px;
|
|
159
157
|
width: 100%;
|
|
160
158
|
margin: 0px auto;
|
|
@@ -162,7 +160,7 @@ a {
|
|
|
162
160
|
width: 100%;
|
|
163
161
|
flex-direction: column;
|
|
164
162
|
@media (min-width: 676px) {
|
|
165
|
-
flex-direction: row;
|
|
163
|
+
// flex-direction: row;
|
|
166
164
|
}
|
|
167
165
|
&.full-width {
|
|
168
166
|
max-width: 100%;
|
|
@@ -5,7 +5,7 @@ import { SliderContainer } from './ImageSlide.css'
|
|
|
5
5
|
export default function ImageSlider({options}) {
|
|
6
6
|
return (
|
|
7
7
|
<SliderContainer>
|
|
8
|
-
<Carousel showThumbs={false} swipeable={true} dynamicHeight={true} width="100%">
|
|
8
|
+
<Carousel showThumbs={false} swipeable={true} showStatus={false} dynamicHeight={true} width="100%">
|
|
9
9
|
{options.content.map(slide => {
|
|
10
10
|
if (!slide.active) return;
|
|
11
11
|
return ( <div key={slide.image[0].reference} style={{ height: 600 }}>
|