@total_onion/onion-library 2.0.197 → 2.0.199

package/components/block-accent-image-v3/accent-image-v3.twig

@@ -13,7 +13,122 @@
 </style>
 <section {{block.anchor ? "id=" ~ block.anchor : ''}} class="{{blockClassName}} cmpl-core-group-container-styles {{loop ? block.className.index ~ '-' ~ loop.index : ''}} {{classNameEntryPoint}} {{block.id}} lazy-fade" {{dataAttributeEntryPoint}} data-blockid="{{block.id}}" data-assetkey="{{blockClassName}}">
 	{% if fields.accent_image_v3.enable_accent_image_v3 %}
-		{{ include('components/accent-image-v3.twig', {fields, block, blockClassName, is_preview}, with_context = false, ignore_missing = true) }}
+		{% for image in fields.accent_image_v3.accent_images %}
+			{% set accentImage = get_image(image.accent_image_v3_image) %}
+			{% set rotationDesktop = image.desktop_positioning.image_rotation_desktop|default(0) %}
+			{% set rotationMobile = image.mobile_positioning.image_rotation_mobile|default(rotationDesktop) %}
+			{% set opacity = image.accent_image_opacity|default(1) %}
+			{% set borderRadius = image.accent_image_border_radius|default('0px') %}
+			{% set zIndex = image.accent_z_index %}
+			{% set mobileSettings = image.mobile_positioning %}
+			{% set oneHundredWidth = image.set_width_and_height_to_100 %}
+			{% set imageFitStyle = image.image_fit_style|ru %}
+			{% if image.use_desktop_positioning_for_mobile %}
+				{% set mobileSettings = image.desktop_positioning %}
+			{% endif %}
+			{% set mobilePositioning = mobileSettings.horizontal_offset ~ '% ' ~ mobileSettings.vertical_offset ~ '%' %}
+			{% set desktopPositioning = image.desktop_positioning.horizontal_offset ~ '% ' ~ image.desktop_positioning.vertical_offset ~ '%' %}
+			{% set desktopWidth = 'calc(' ~ image.desktop_accent_image_width ~ '/ var(--desktop-design-reference) * var(--screen-width-desktop))' %}
+			{% set mobileWidth = 'calc(' ~ image.mobile_accent_image_width ~ '/ var(--mobile-design-reference) * var(--screen-width-mobile))' %}
+			{% if oneHundredWidth %}
+				{% set desktopWidth = '100%' %}
+				{% set mobileWidth = '100%' %}
+			{% endif %}
+			{% set accentImageContainerElement = 'div' %}
+			{% set accentImageCtaType = image.accent_image_cta_type|ru %}
+			{% if image.enable_accent_image_cta %}
+				{% if image.accent_image_cta_type|ru == 'link' %}
+					{% set accentImageContainerElement = 'a' %}
+				{% endif %}
+			{% endif %}
+			{% set suffix = block.id ~ '-' ~ loop.index %}
+			{% if image.animations.enable_animations %}
+				{{include('components/animations-style-v3.twig', { fields: image, suffix }, with_context = false)}}
+			{% endif %}
+			<style>
+				.loaded .{{block.id}}-{{loop.index}}.{{blockClassName}}__accent-image {
+					{{include('components/animations-v3.twig', { fields: image, block: block, blockClassName: blockClassName, suffix }, with_context = false)}}
+					animation: var(--animation-name) var(--animation-duration) var(--animation-delay) var(--animation-easing) var(--animation-repeat) var(--animation-fill-mode) var(--animation-direction);
+				}
+				.{{block.id}}-{{loop.index}}.{{blockClassName}}__accent-image {
+					z-index: {{zIndex}}
+					;
+					grid-area: main;
+					pointer-events: {{image.enable_accent_image_cta ? 'all' : 'none'}};
+					position: absolute;
+					place-self: {{mobileSettings.vertical_snap|ru}}
+					{{mobileSettings.horizontal_snap|ru}}
+					;
+					width: {{mobileWidth}}
+					;
+					height: {{mobileWidth}}
+					;
+					translate: {{mobilePositioning}}
+					;
+				}
+				.{{block.id}}-{{loop.index}}.{{blockClassName}}__accent-image .{{blockClassName}}__image-element.element {
+					width: 100%;
+					height: 100%;
+					display: flex;
+					object-fit: {{imageFitStyle}}
+					;
+					border-radius: {{borderRadius}}
+					;
+					border: 0 solid transparent;
+					opacity: {{opacity}}
+					;
+					rotate: {{rotationMobile ~ 'deg'}};
+				}
+				.{{blockClassName}}__image-number {
+						z-index: 99;
+						position: absolute;
+						font-size: 40px;
+						left: 50%;
+						top: 50%;
+						transform: translate(-50%, -50%);
+						color: white;
+						text-shadow: 1px 1px 1px blue;
+				}
+				@media screen and (min-width: 768px) {
+					.{{block.id}}-{{loop.index}}.{{blockClassName}}__accent-image {
+						place-self: {{image.desktop_positioning.vertical_snap|ru}}
+						{{image.desktop_positioning.horizontal_snap|ru}};
+						width: {{desktopWidth}};
+						height: {{desktopWidth}};
+						translate: {{desktopPositioning}};
+					}
+					.{{block.id}}-{{loop.index}}.{{blockClassName}}__accent-image .{{blockClassName}}__image-element.element {
+						width: 100%;
+						height: 100%;
+						display: flex;
+						object-fit: {{imageFitStyle}};
+						border-radius: {{borderRadius}};
+						border: 0 solid transparent;
+						opacity: {{opacity}};
+						rotate: {{rotationDesktop ~ 'deg'}};
+					}
+				}
+			</style>
+			<{{accentImageContainerElement}}
+				{{accentImageCtaType == 'link' ? 'href="' ~ image.accent_image_link.url ~ '" ' ~ 'target="' ~ image.accent_image_link.target ~ '" ' : ''}}
+				class="{{block.id}}-{{ loop.index }} {{blockClassName}}__accent-image">
+				{% if image.inline_raw_svg %}
+					{{fn('get_raw_svg', accentImage.id, blockClassName ~ '__image-element element')}}
+				{% else %}
+				<img
+					class="{{block.id}}-{{ loop.index }} {{blockClassName}}__image-element element"
+					src="{{ accentImage.src }}"
+					width="{{ accentImage.width }}"
+					height="{{ accentImage.height }}"
+					alt="{{ accentImage.alt }}"
+					loading="lazy"
+				/>
+				{% endif %}
+				
+				{% if fields.accent_image_v3.show_image_number and is_preview %}
+					<div class="{{blockClassName}}__image-number">{{ loop.index }}</div>
+				{% endif %}
+			</{{accentImageContainerElement}}>
+		{% endfor %}
 	{% endif %}
-	{{htmlEntryPoint}}
 </section>

package/components/block-back-to-top-button-v3/back-to-top-button-v3.twig

@@ -32,6 +32,9 @@
 				<span class="{{blockClassName}}__arrow" style="--arrow-colour: {{arrowColour}}"></span>
 			{% endif %}
 		</button>
-		{{htmlEntryPoint}}
+		{% if fields.animations.enable_animations %}
+			{{ include('components/animations-style-v3.twig', { fields, block, blockClassName }, with_context = false) }}
+		{% endif %}
+
 	</section>
 {% endif %}

package/components/block-group-container-v3/group-container-v3.twig

@@ -63,5 +63,8 @@
 			</div>
 		{% endfor %}
 	</div>
-	{{htmlEntryPoint}}
+	{% if fields.animations.enable_animations %}
+		{{ include('components/animations-style-v3.twig', { fields, block, blockClassName }, with_context = false) }}
+	{% endif %}
+
 </{{blockElementType}}>

package/components/block-post-info-v3/post-info-v3/post-image.twig

@@ -14,6 +14,8 @@
 {% set imageAspectRatioPortrait = '--image-aspect-ratio-portrait:' ~ field.image_aspect_ratio_portrait ~ ';' %}
 {% set imageAspectRatioMobile = '--image-aspect-ratio-mobile:' ~ field.image_aspect_ratio_mobile ~ ';' %}
 {% set imageFitStyle = '--image-fit-style:' ~ (field.image_fit_style|ru|default('contain')) ~ ';' %}
+{% set linkToAssociatedPost = field.link_to_associated_post %}
+
 {% set styleVars = imageWidthPercentDesktop ~ imageWidthPercentMobile ~ imageWidthPercentMobilePx ~ imageWidthPercentDesktopPx ~ imageAspectRatioDesktop ~ imageAspectRatioPortrait ~ imageAspectRatioMobile ~ imageFitStyle %}
 <style>
 	.{{blockClassName}}__post-image-container.{{block.id}}{
@@ -22,7 +24,8 @@
 		{{positionVars}}
 	}
 </style>
-<a aria-label="{{post.title}}" href="{{post.link}}" data-pattern-post-info="link" data-image-select="{{ imageSelect }}" class="{{blockClassName}}__post-image-container {{blockClassName}}__info-item {{blockClassName}}__info-item--{{postType}} {{blockClassName}}__post-image-container--{{imageSelect|replace({'_':'-'})}} {{block.id}}">
+<a aria-label="{{post.title}}" href="{{linkToAssociatedPost ? get_post(post.associated_post).link : post.link}}" data-pattern-post-info="link" data-image-select="{{ imageSelect }}" class="{{blockClassName}}__post-image-container {{blockClassName}}__info-item {{blockClassName}}__info-item--{{postType}} {{blockClassName}}__post-image-container--{{imageSelect|replace({'_':'-'})}} {{block.id}}">
+
 	{% set imageSizes = imageSizes|default('(min-width: 1440px) 50vw, (min-width: 768px) 50vw, (min-width: 500px) 50vw, 100vw') %}
 	{% set imageFields = [] %}
 	{% set imageFields = imageFields|merge({'enable_image' : true}) %}
@@ -33,7 +36,9 @@
 	{% elseif attribute(post, 'post_image') %}
 		{% set imageFields = imageFields|merge({'image' : attribute(post, 'post_image')}) %}
 	{% endif %}
-	{{ include('components/single-image.twig', {
+	{% set imageFields = imageFields|merge({'enable_image' : true}) %}
+	{% set imageFields = imageFields|merge({'desktop_image' : imageFields.image}) %}
+	{{ include('components/responsive-image-v3.twig', {
 		fields: imageFields,
 		block: block,
 		blockClassName: imageClassname,

package/components/block-post-info-v3/post-info-v3/post-tags.twig

@@ -3,6 +3,7 @@
 {% set textEditorContainerClasses = include('components/text-editor-settings-container-classes-v3.twig', { fields: field, block, blockClassName, is_preview }, with_context = false) %}
 {% set textEditorElementClasses = include('components/text-editor-settings-element-classes-v3.twig', { fields: field, block, blockClassName, is_preview }, with_context = false) %}
 {% set elementType = field.element_type|ru %}
+{% set numberOfTags = field.number_of_tags %}
 
 <style>
 	.{{blockClassName}}__post-tags.{{block.id}}{
@@ -11,5 +12,11 @@
 	}
 </style>
 <div class="{{blockClassName}}__post-tags {{blockClassName}}__info-item {{block.id}}">
-	<div class="{{blockClassName}}__cta cmpl-cta-style-{{field.cta_style}}">{{post.tags.0.name}}</div>
+	<div class="{{blockClassName}}__cta cmpl-cta-style-{{field.cta_style}}">
+
+		{% for tag in post.tags | slice(0, numberOfTags) %}
+			{{ tag.name }}
+		{% endfor %}
+
+	</div>
 </div>

package/components/block-raw-html-v3/raw-html-v3.twig

@@ -10,5 +10,8 @@
 {{previewEntryPoint}}
 <section {{block.anchor ? "id=" ~ block.anchor : ''}} class="{{blockClassName}} {{block.className}} {{classNameEntryPoint}} lazy-fade" {{dataAttributeEntryPoint}} data-blockid="{{block.id}}" style="{{sectionStyles}}" data-assetkey="{{blockClassName}}">
 	{{fields.code}}
-	{{htmlEntryPoint}}
+	{% if fields.animations.enable_animations %}
+		{{ include('components/animations-style-v3.twig', { fields, block, blockClassName }, with_context = false) }}
+	{% endif %}
+
 </section>

package/components/block-scrolling-banner-v3/scrolling-banner-v3.twig

@@ -65,4 +65,8 @@
 			</div>
 		</div>
 	{% endif %}
+	{% if fields.animations.enable_animations %}
+		{{ include('components/animations-style-v3.twig', { fields, block, blockClassName }, with_context = false) }}
+	{% endif %}
+
 </section>

package/components/block-single-responsive-image-v3/single-responsive-image-v3.twig

@@ -12,5 +12,148 @@
 	}
 </style>
 <section {{block.anchor ? "id=" ~ block.anchor : ''}} class="{{blockClassName}} {{fields.section_class}} {{classNameEntryPoint}} lazy-fade {{block.id}}" data-jsload="false" {{dataAttributeEntryPoint}} data-blockid="{{block.id}}" data-assetkey="{{blockClassName}}">
-	{{htmlEntryPoint}}
+	{% if fields.enable_image|default(fields.image_enabled) %}
+		{% set renderDynamic = fields.child_patterns.render_dynamic|default(0) %}
+		{% set suffix = fields.child_patterns.suffix %}
+
+		{% set desktopType = fields.desktop_image_aspect_ratio|ru|default('original') %}
+		{% set tabletType = fields.tablet_image_aspect_ratio|ru|default('original') %}
+		{% set mobileType = fields.mobile_image_aspect_ratio|ru|default('original') %}
+
+		{% set desktopImage = get_image(fields.desktop_image) %}
+		{% set tabletImage = get_image(fields.tablet_image)|default(desktopImage) %}
+		{% set mobileImage = get_image(fields.mobile_image) %}
+
+		{% set imageSizes = fields.custom_image_sizes %}
+		{% set sizes = imageSizes|default('(min-width: 1440px) 100vw, (min-width: 1024px) 1024px, (min-width: 768px) 768px, (min-width: 500px) 100vw, 250px') %}
+
+		{% set imageFitStyle = '--image-fit-style:' ~ (fields.image_fit_style|ru|default('cover')) ~ ';' %}
+		{% set imageObjectPositionAlign = '--image-object-position-align:' ~ (fields.image_object_position_align|ru) ~ ';' %}
+		{% set imageWidth = '--image-width:' ~ fields.image_width|default(100) ~ '%;' %}
+		{% set imageWidthMobile = '--image-width-mobile:' ~ fields.image_width_mobile|default(100) ~ '%;' %}
+		{% set imageWidthPortrait = '--image-width-portrait:' ~ fields.image_width_portrait|default(100) ~ '%;' %}
+		{% set imageOpacity = '--image-opacity:' ~ fields.image_opacity|default(1) ~ ';' %}
+		{% set imageZIndex = '--image-z-index:' ~ fields.image_z_index|default(0) ~ ';' %}
+		{% set imagePosition = '--image-position:' ~ fields.image_position|ru ~ ';' %}
+		{% set imageGridArea = '--image-grid-area:' ~ fields.image_grid_area|ru|default('main') ~ ';' %}
+		{% set imageBorderRadius = '--image-border-radius:' ~ fields.image_border_radius ~ ';' %}
+		{% set imageAspectRatioDesktop = '--image-aspect-ratio-desktop:' ~ fields.image_aspect_ratio_desktop ~ ';' %}
+		{% set imageAspectRatioPortrait = '--image-aspect-ratio-portrait:' ~ fields.image_aspect_ratio_portrait ~ ';' %}
+		{% set imageAspectRatioMobile = '--image-aspect-ratio-mobile:' ~ fields.image_aspect_ratio_mobile ~ ';' %}
+		{% set imageOffsetVert = '--image-offset-vert:' ~ fields.image_offset_vertical ~ '%;' %}
+		{% set imageOffsetHoriz = '--image-offset-horiz:' ~ fields.image_offset_horizontal ~ '%;' %}
+		{% set enableImageBorder = fields.enable_image_border %}
+		{% if enableImageBorder %}
+			{% set imageBorderColour = '--image-border-colour:' ~ (fields.image_border_colour|ru|default(000)) ~ ';' %}
+			{% set imageBorderWidth = '--image-border-width:' ~ (fields.image_border_width|ru|default(1)) ~ ';' %}
+			{% set imageBorderStyle = '--image-border-style:' ~ (fields.image_border_style|ru|default('solid')) ~ ';' %}
+		{% endif %}
+		{% set imageMinHeightMobile = '--image-min-height-mobile:' ~ (fields.image_min_height_mobile|ru|default('auto')) ~ ';' %}
+		{% set imageMinHeightDesktop = '--image-min-height-desktop:' ~ (fields.image_min_height_desktop|ru|default('auto')) ~ ';' %}
+		{% set subtractHeaderHeight = '--cancel-header-height:' ~ (fields.subtract_header_height ? '0px' : 'var(--global-site-header-height, 0px)') ~ ';' %}
+		{% set imageBorderString = imageBorderColour ~ imageBorderWidth ~ imageBorderStyle %}
+		{% set pictureStylesString = imageFitStyle ~ imageObjectPositionAlign ~ imageWidth ~ imageWidthMobile ~ imageWidthPortrait ~ imageOpacity ~ imageAspectRatioDesktop ~ imageAspectRatioPortrait ~ imageAspectRatioMobile ~ imageOffsetVert ~ imageOffsetHoriz ~ imageBorderRadius ~ imagePosition ~ imageGridArea ~ imageMinHeightMobile ~ imageMinHeightDesktop ~ subtractHeaderHeight ~ imageZIndex %}
+		{% set enableEagerLoading = fields.enable_eager_image_loading ? 'loading="eager" fetchpriority="high"' : 'loading="lazy"' %}
+
+		{% set selectedAspectRatioDesktop = fields.desktop_image_aspect_ratio|ru %}
+		{% set selectedAspectRatioTablet = fields.tablet_image_aspect_ratio|ru %}
+		{% set selectedAspectRatioMobile = fields.mobile_image_aspect_ratio|ru %}
+
+		{% if selectedAspectRatioDesktop == 'original' %}
+			{% set isSVG = desktopImage.post_mime_type == 'image/svg+xml' %}
+			{% set selectedAspectRatioDesktop = null %}
+			{% set mainImageSrc = isSVG ? desktopImage.src : gt_image_mainsrc(desktopImage) %}
+			{% set desktopSrcset = isSVG ? desktopImage.src : gt_image_srcset(desktopImage) %}
+		{% elseif selectedAspectRatioDesktop == 'custom_aspect_ratio' %}
+			{% set isSVG = desktopImage.post_mime_type == 'image/svg+xml' %}
+			{% set customAspectRatio = fields.desktop_custom_aspect_ratio %}
+			{% set mainImageSrc = isSVG ? desktopImage.src : gt_image_mainsrc(desktopImage, {"aspect_ratio": customAspectRatio|replace({'/' : 'x', ':' : 'x'})}) %}
+			{% set desktopSrcset = isSVG ? desktopImage.src : gt_image_srcset(desktopImage, {"aspect_ratio": customAspectRatio|replace({'/' : 'x', ':' : 'x'})}) %}
+		{% else %}
+			{% set isSVG = desktopImage.post_mime_type == 'image/svg+xml' %}
+			{% set mainImageSrc = isSVG ? desktopImage.src : gt_image_mainsrc(desktopImage, {"aspect_ratio" : selectedAspectRatioDesktop}) %}
+			{% set desktopSrcset = isSVG ? desktopImage.src : gt_image_srcset(desktopImage, {"aspect_ratio" : selectedAspectRatioDesktop}) %}
+		{% endif %}
+
+		{% if selectedAspectRatioTablet == 'original' %}
+			{% set isSVG = tabletImage.post_mime_type == 'image/svg+xml' %}
+			{% set selectedAspectRatioTablet = null %}
+			{% set tabletSrcset =  isSVG ? tabletImage.src : gt_image_srcset(tabletImage)%}
+		{% elseif selectedAspectRatioTablet == 'custom_aspect_ratio' %}
+			{% set isSVG = tabletImage.post_mime_type == 'image/svg+xml' %}
+			{% set customAspectRatio = fields.tablet_custom_aspect_ratio %}
+			{% set mainImageSrc = isSVG ? tabletImage.src : gt_image_mainsrc(tabletImage, {"aspect_ratio": customAspectRatio|replace({'/' : 'x', ':' : 'x'})}) %}
+			{% set tabletSrcset = isSVG ? tabletImage.src : gt_image_srcset(tabletImage, {"aspect_ratio": customAspectRatio|replace({'/' : 'x', ':' : 'x'})}) %}
+		{% else %}
+			{% set isSVG = tabletImage.post_mime_type == 'image/svg+xml' %}
+			{% set tabletSrcset =  isSVG ? tabletImage.src : gt_image_srcset(tabletImage, {"aspect_ratio" : selectedAspectRatioTablet})%}
+		{% endif %}
+
+		{% if selectedAspectRatioMobile == 'original' %}
+			{% set isSVG = mobileImage.post_mime_type == 'image/svg+xml' %}
+			{% set selectedAspectRatioMobile = null %}
+			{% set mobileSrcset =  isSVG ? mobileImage.src : gt_image_srcset(mobileImage) %}
+		{% elseif selectedAspectRatioMobile == 'custom_aspect_ratio' %}
+			{% set isSVG = mobileImage.post_mime_type == 'image/svg+xml' %}
+			{% set customAspectRatio = fields.mobile_custom_aspect_ratio %}
+			{% set mainImageSrc = isSVG ? mobileImage.src : gt_image_mainsrc(mobileImage, {"aspect_ratio": customAspectRatio|replace({'/' : 'x', ':' : 'x'})}) %}
+			{% set mobileSrcset = isSVG ? mobileImage.src : gt_image_srcset(mobileImage, {"aspect_ratio": customAspectRatio|replace({'/' : 'x', ':' : 'x'})}) %}
+		{% else %}
+			{% set isSVG = mobileImage.post_mime_type == 'image/svg+xml' %}
+			{% set mobileSrcset =  isSVG ? mobileImage.src : gt_image_srcset(mobileImage, {"aspect_ratio" : selectedAspectRatioMobile})%}
+		{% endif %}
+		{% set parallaxEnabled = fields.parallax_enabled %}
+		{% if parallaxEnabled %}
+			{% set parallaxDepth = 'data-depth=' ~ fields.parallax_depth ~ " " %}
+			{% set parallaxOffsetY = 'data-y-offset=' ~ fields.parallax_offset_y ~ " " %}
+		{% endif %}
+
+		<style>
+			.{{blockClassName|default('cbl-image')}}__picture.{{block.id}}{
+				{{pictureStylesString}}
+				{{imageBorderString}}
+				{% if selectedAspectRatioDesktop == 'custom_aspect_ratio' %}
+					--image-aspect-ratio-desktop: {{fields.desktop_custom_aspect_ratio}}
+					;
+				{% elseif selectedAspectRatioDesktop %}
+					--image-aspect-ratio-desktop: {{selectedAspectRatioDesktop|replace({'x': '/'})}}
+					;
+				{% endif %}
+
+				{% if selectedAspectRatioTablet == 'custom_aspect_ratio' %}
+					--image-aspect-ratio-portrait: {{fields.tablet_custom_aspect_ratio}}
+					;
+				{% elseif selectedAspectRatioTablet %}
+					--image-aspect-ratio-portrait: {{selectedAspectRatioTablet|replace({'x': '/'})}}
+					;
+				{% endif %}
+
+				{% if selectedAspectRatioMobile == 'custom_aspect_ratio' %}
+					--image-aspect-ratio-mobile: {{fields.mobile_custom_aspect_ratio}}
+					;
+				{% elseif selectedAspectRatioMobile %}
+					--image-aspect-ratio-mobile: {{selectedAspectRatioMobile|replace({'x': '/'})}}
+					;
+				{% endif %}
+			}
+		</style>
+		<picture class="{{ blockClassName|default('cbl-image') }}__picture {{block.id}}" data-pattern-suffix="{{suffix}}" data-pattern-dynamic="{{renderDynamic}}" data-assetkey="responsive-image" data-enableparallax="{{ parallaxEnabled }}">
+			{% if desktopImage %}
+				<source data-type="srcSetDesktop" data-pattern-suffix="{{suffix}}" media="(min-width: 1024px)" class="{{ blockClassName|default('cbl-image') }}__source {{ blockClassName|default('cbl-image') }}--desktop" width="{{ desktopImage.width }}" height="{{ desktopImage.height }}" sizes="{{ sizes }}" srcset="{{desktopSrcset}}"/>
+			{% endif %}
+			{% if tabletImage %}
+				<source data-type="srcSetTablet" data-pattern-suffix="{{suffix}}" media="(min-width: 768px)" width="{{ tabletImage.width }}" height="{{ tabletImage.height }}" class="{{ blockClassName|default('cbl-image') }}__source {{ blockClassName|default('cbl-image') }}--tablet" sizes="{{ sizes }}" srcset="{{ tabletSrcset }}"/>
+			{% endif %}
+			{% if mobileImage %}
+				<source data-type="srcSetMobile" data-pattern-suffix="{{suffix}}" class="{{ blockClassName|default('cbl-image') }}__source {{ blockClassName|default('cbl-image') }}__source--mobile" width="{{ mobileImage.width }}" height="{{ mobileImage.height }}" sizes="{{ sizes }}" srcset="{{ mobileSrcset }}"/>
+			{% endif %}
+			<img data-type="srcGeneral" data-elementname="main-image" data-pattern-suffix="{{suffix}}" data-pattern-dynamic="{{renderDynamic}}" {{ enableEagerLoading }} class="{{ blockClassName|default('cbl-image') }}__image" src="{{mainImageSrc}}" alt="{{ desktopImage.alt }}" {{ parallaxDepth }} {{ parallaxOffsetY }}/>
+		</picture>
+	{% endif %}
+
+
+	{% if fields.animations.enable_animations %}
+		{{ include('components/animations-style-v3.twig', { fields, block, blockClassName }, with_context = false) }}
+	{% endif %}
+
 </section>

package/components/block-site-copyright-notice-v3/index.html

@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>Site Copyright Notice</title>
+		<link rel="stylesheet" href="../../public/publicBundle.css" />
+	</head>
+
+	<body>
+		<site-copyright-notice-v3
+			id=""
+			class="site-copyright-notice-v3 cmpl-block-settings cmpl-block-padding"
+			data-scopeid=""
+			data-sectionclass=""
+			data-copyright-text="@Total Onion"
+			data-cssload="true"
+			data-eager="false"
+			data-assetkey="site-copyright-notice-v3"
+		>
+		</site-copyright-notice-v3>
+	</body>
+
+	<script type="module">
+		import lazyloader from "../../onion-loader-local.js";
+		lazyloader.options.debugLogMessages = false;
+		lazyloader.lazyloaderInit();
+	</script>
+
+	<template id="site-copyright-notice-v3">
+		<div class="site-copyright-notice-v3__title"></div>
+	</template>
+</html>

package/components/block-site-copyright-notice-v3/site-copyright-notice-v3.scss

@@ -3,7 +3,7 @@
 @use '../../breakpoints';
 
 .site-copyright-notice-v3 {
-	color: var(--site-copyright-notice-colour);
+	color: var(--site-copyright-notice-colour, black);
 	font-size: core-functions-v3.fontSize(
 		var(--site-copyright-font-size-mobile, 14px)
 	);

package/components/block-site-copyright-notice-v3/site-copyright-notice-v3.twig

@@ -12,19 +12,19 @@
 {% set sectionStyles =  styleEntryPoint ~ siteCopyrightColour ~ siteCopyrightFontSizeDesktop ~ siteCopyrightFontSizePortrait ~ siteCopyrightFontSizeMobile %}
 
 <style>
-	.{{blockClassName}}.{{block.id}}{
+	.site-copyright-notice-v3.{{block.id}}{
 		{{sectionStyles}}
 	}
 </style>
-<section {{block.anchor ? "id=" ~ block.anchor : ''}} class="{{blockClassName}} {{fields.section_class}} {{classNameEntryPoint}} {{block.id}} lazy-fade" {{dataAttributeEntryPoint}} data-jsload="false" data-blockid="{{block.id}}" data-pattern-site-copyright-notice data-assetkey="{{blockClassName}}">
+<section {{block.anchor ? "id=" ~ block.anchor : ''}} class="site-copyright-notice-v3 {{fields.section_class}} {{classNameEntryPoint}} {{block.id}} lazy-fade" {{dataAttributeEntryPoint}} data-jsload="false" data-blockid="{{block.id}}" data-pattern-site-copyright-notice data-assetkey="site-copyright-notice-v3">
 
 	{% if fields.enable_site_copyright_notice %}
 		<div
-			class="{{blockClassName}}__title">
+			class="site-copyright-notice-v3__title">
 			<!-- site-copyright-notice -->
 			{{options.site_copyright_notice_v3|default('@Total Onion')}}
 			<!-- end-site-copyright-notice -->
 		</div>
 	{% endif %}
-	{{htmlEntryPoint}}
+
 </section>

package/components/block-standard-content-v3/standard-content-v3.twig

@@ -1,7 +1,5 @@
-{# Do not edit this file outside of the component library as your changes will be lost with future updates. #}
 {% set blockClassName = "standard-content-v3" %}
 {% set displaytype = 'grid' %}
-
 {% set classNameEntryPoint = include('entry-points/entry-point-classes.twig', { fields, block }, with_context = false) %}
 {% set htmlEntryPoint = include('entry-points/entry-point-html-v3.twig', { fields, block, blockClassName, options, cta_styles, environment,  is_preview, nav_menus, imageSizes }, with_context = false) %}
 {% set dataAttributeEntryPoint = include('entry-points/entry-point-data-attribute.twig', { fields, block }, with_context = false) %}
@@ -16,5 +14,32 @@
 	}
 </style>
 <section {{ block.anchor ? 'id=' ~ block.anchor : '' }} class="{{blockClassName}} {{fields.section_class}} {{classNameEntryPoint}} {{ block.id }} lazy-fade" {{dataAttributeEntryPoint}} data-assetkey="{{blockClassName}}">
-	{{htmlEntryPoint}}
+	{% set contentContainerStyles =  include('components/content-box-settings-v3.twig', { fields, block, blockClassName }, with_context = false) %}
+	<style>
+		.{{blockClassName}}__inner-container.{{block.id}}{
+			{{contentContainerStyles}}
+		}
+	</style>
+	{% set currentBlockId = block.id %}
+	<div class="{{blockClassName}}__inner-container {{block.id}}">
+		{% for item in fields.content_sections %}
+			{% if block %}
+				{% set block = block|merge({'anchor' : ''}) %}
+				{% set block = block|merge({'id' : block.id ~ '-' ~ loop.index}) %}
+				{% set block = block|merge({'className' : ''}) %}
+			{% endif %}
+			{% set path = '' %}
+			{% if item.acf_fc_layout == 'spacer_v3' or item.acf_fc_layout == 'divider_v3' or item.acf_fc_layout == 'breadcrumb_display' or item.acf_fc_layout == 'block_interactions_v3' %}
+				{% set path = 'blocks' %}
+			{% else %}
+				{% set path = 'components' %}
+			{% endif %}
+			{{ include(path ~ '/' ~ (item.acf_fc_layout|replace({ '_': '-' })) ~ '.twig', { fields: item, block, contentImageSizes, blockClassName, options, nav_menus, cta_styles}, with_context = false, ignore_missing = true) }}
+		{% endfor %}
+	</div>
+
+	{% if fields.animations.enable_animations %}
+		{{ include('components/animations-style-v3.twig', { fields, block, blockClassName }, with_context = false) }}
+	{% endif %}
+
 </section>

package/components/block-sub-group-container-v3/sub-group-container-v3.twig

@@ -52,5 +52,8 @@
 			</div>
 		{% endfor %}
 	</div>
-	{{htmlEntryPoint}}
+	{% if fields.animations.enable_animations %}
+		{{ include('components/animations-style-v3.twig', { fields, block, blockClassName }, with_context = false) }}
+	{% endif %}
+
 </{{blockElementType}}>

package/components/block-video-content-v3/video-content-v3.twig

@@ -103,5 +103,8 @@
 			</div>
 		</div>
 	{% endif %}
+	{% if fields.animations.enable_animations %}
+		{{ include('components/animations-style-v3.twig', { fields, block, blockClassName }, with_context = false) }}
+	{% endif %}
 
 </section>

package/components/component-content-box-v3/content-box-v3.twig

@@ -1,4 +1,4 @@
-{% set contentContainerStyles =  include('components/content-box-settings-v3.twig', { fields, block, blockClassName }, with_context = false) %}
+{# {% set contentContainerStyles =  include('components/content-box-settings-v3.twig', { fields, block, blockClassName }, with_context = false) %}
 <style>
 	.{{blockClassName}}__inner-container.{{block.id}}{
 		{{contentContainerStyles}}
@@ -20,4 +20,4 @@
 		{% endif %}
 		{{ include(path ~ '/' ~ (item.acf_fc_layout|replace({ '_': '-' })) ~ '.twig', { fields: item, block, contentImageSizes, blockClassName, options, nav_menus, cta_styles}, with_context = false, ignore_missing = true) }}
 	{% endfor %}
-</div>
+</div> #}

package/components/component-video-component-v3/video-component-v3.twig

@@ -1,4 +1,4 @@
-{% set videoEnabled = fields.enable_video %}
+{# {% set videoEnabled = fields.enable_video %}
 {% set renderDynamic = fields.child_pattern_settings.render_dynamic|default(0) %}
 {% set videoPlayingZindexClass = fields.video_playing_high_z_index ? 'video-playing--high-z-index' : '' %}
 {% if videoEnabled %}
@@ -87,4 +87,4 @@
 			{% endif %}
 		</div>
 	</div>
-{% endif %}
+{% endif %} #}

package/components/entrypoint-entry-point-html-v3/entry-point-html-v3.twig

@@ -1,24 +1,19 @@
-{% if fields.buy_now_button.enable_buy_now_button %}
+{# {% if fields.buy_now_button.enable_buy_now_button %}
 	{{ include('components/buy-now-button-v3.twig', {fields, block, blockClassName, options, environment}, with_context = false, ignore_missing = true) }}
-{% endif %}
-{% if fields.enable_scrolling_banner %}
+{% endif %} #}
+{# {% if fields.enable_scrolling_banner %}
 	{{ include('components/scrolling-banner-v3.twig', {fields, block, blockClassName}, with_context = false, ignore_missing = true) }}
-{% endif %}
-{% if fields.accent_image_v2.enable_accent_image_v2 %}
-	{{ include('components/accent-image-v3.twig', {fields, block, blockClassName, is_preview}, with_context = false, ignore_missing = true) }}
-{% endif %}
-{% if fields.enable_image %}
+{% endif %} #}
+
+{# {% if fields.enable_image %}
 	{{ include('components/responsive-image-v3.twig', {fields, block, blockClassName, is_preview}, with_context = false, ignore_missing = true) }}
-{% endif %}
-{% if fields.enable_video %}
-	{{ include('components/video-component-v3.twig', { fields, block, blockClassName }, with_context = false) }}
-{% endif %}
-{% if (fields.enable_content_box and fields.content_sections|length > 0) %}
+{% endif %} #}
+
+{# {% if (fields.enable_content_box and fields.content_sections|length > 0) %}
 	{{ include('components/content-box-v3.twig', { fields, block, options, cta_styles, blockClassName, nav_menus, languages }, with_context = false) }}
-{% endif %}
-{% if fields.animations.enable_animations %}
-	{{ include('components/animations-style-v3.twig', { fields, block, blockClassName }, with_context = false) }}
-{% endif %}
-{% if fields.lottie_animations.enable_lottie_animations %}
-	{{ include('components/lottie-animations-v3.twig', { fields, block, blockClassName }, with_context = false) }}
-{% endif %}
+{% endif %} #}
+	{# {% if fields.animations.enable_animations %}
+{{ include('components/animations-style-v3.twig', { fields, block, blockClassName }, with_context = false) }}
+{% endif %} #}
+{# {% if fields.lottie_animations.enable_lottie_animations %}
+{{ include('components/lottie-animations-v3.twig', { fields, block, blockClassName }, with_context = false) }}{% endif %} #}

package/onion-loader-local.js

@@ -0,0 +1,222 @@
+import jsAssetList from './public/jsAssets.mjs';
+const coreAssets = jsAssetList.dynamicAssets;
+
+/* eslint-disable no-use-before-define */
+/* eslint-disable no-console */
+
+//*** Lazyloader ***//
+
+/**
+ * The options object for the lazyloader.
+ * @type {object}
+ * @property {string} rootMargin The root margin for the IntersectionObserver.
+ * @default '0% 0% 0%'
+ * @property {number} threshold The threshold for the IntersectionObserver.
+ * @property {boolean} debugLogMessages Whether to log debug messages.
+ * @property {array} lazyBlocksToSearchFor The array of lazy blocks to search for.
+ * @property {array} lazyBlocksFound The array of lazy blocks found.
+ * @property {array} assetArray The array of assets to load.
+ * @property {object} assetMap The asset map object.
+ * @property {boolean} ignoreCss Whether to ignore the css.
+ * @property {boolean} lazy Whether to lazy load the assets (after Assets alias).
+ * @property {string} filePath The file path for the js assets.
+ * @default 'js/blocks/'
+ * @property {string} filePathCss The file path for the css assets (after Assets alias).
+ * @default 'scss/blocks/'
+ */
+
+const options = {
+	rootMargin: '100% 0px 300px 0px',
+	threshold: 0,
+	debugLogMessages: false,
+	lazyBlocksToSearchFor: [],
+	lazyBlocksFound: [],
+	coreAssets: [...coreAssets],
+	projectAssets: [],
+	assetMap: {},
+	css: true,
+	lazy: true,
+	cssLoadingStyle: 'component', // 'component' or 'bundle'
+	filePrefix: 'dev', //'nodemodules', 'assets' or 'dev'
+	fileSuffixJs: '.js',
+	fileSuffixCss: '.css',
+	filePath: 'js/blocks',
+	filePathCss: 'scss/blocks'
+};
+
+/**
+ * Initializes the lazyloader.
+ */
+function lazyloaderInit() {
+	const assetArray = options.coreAssets.concat(options.projectAssets);
+	options.debugLogMessages && console.log('Lazy Loader initialized!');
+	options.lazyBlocksToSearchFor = [];
+	assetArray.forEach((asset) => {
+		if (asset.assetKey.includes('-v3')) {
+			options.assetMap[asset.assetKey] = {
+				js: () =>
+					import(
+						`./public/block-${asset.assetKey}/${asset.assetKey}${options.fileSuffixJs}`
+					)
+			};
+		}
+
+		// Add to lazy blocks to search for
+		options.lazyBlocksToSearchFor.push(
+			`[data-assetkey="${asset.assetKey}"]`
+		);
+	});
+
+	options.lazyBlocksToSearchFor.forEach((block) => {
+		if (document.querySelector(block)) {
+			options.lazyBlocksFound.push(document.querySelector(block));
+		}
+	});
+
+	// options.lazyBlocksFound = Array.from(
+	// 	document.querySelectorAll(options.lazyBlocksToSearchFor)
+	// );
+
+	// If data eager loading attribute is true - load js straight away
+	options.lazyBlocksFound.forEach((block) => {
+		if (block.dataset.eager == 'true') {
+			callBlockJs(block);
+		}
+	});
+
+	options.debugLogMessages && console.log('Lazyloader Options', options);
+
+	// Check if the browser has intersection observer which is needed for the Lazyloader or if all assets should load immediately anyway.
+	if (options.lazy === false || !('IntersectionObserver' in window)) {
+		options.debugLogMessages && console.log('running eager loading');
+		try {
+			options.lazyBlocksFound.forEach((block) => {
+				callBlockJs(block);
+			});
+		} catch (error) {
+			console.log(error);
+		}
+	} else {
+		options.debugLogMessages && console.log('running normal process');
+		observerInit(options.lazyBlocksFound);
+	}
+}
+
+/**
+ * Initializes the IntersectionObserver for the lazy loading of blocks.
+ * @param {array} elementsToObserve The array of block elements to observe.
+ */
+function observerInit(elementsToObserve = []) {
+	const observer = new IntersectionObserver(intersectionCallback, options);
+	elementsToObserve.forEach((element) => {
+		if (element) {
+			observer.observe(element);
+		}
+	});
+}
+
+/**
+ * Callback function for the IntersectionObserver.
+ * @param {array} entries The entries array from the IntersectionObserver.
+ * @param {object} observer The IntersectionObserver object.
+ */
+const intersectionCallback = (entries, observer) => {
+	options.debugLogMessages && console.log('Observer entries', entries);
+	entries.forEach((entry) => {
+		if (entry.isIntersecting) {
+			const lazyTarget = entry.target;
+			try {
+				callBlockJs(lazyTarget);
+			} catch (error) {
+				console.log(
+					error,
+					'block data assetkey:',
+					lazyTarget.dataset.assetkey,
+					' - ',
+					'asset import function:',
+					options.assetMap[lazyTarget.dataset.assetkey],
+					'are you missing an asset key or import function?'
+				);
+			}
+			observer.unobserve(lazyTarget);
+			options.debugLogMessages &&
+				console.log('Unobserving lazyElement', lazyTarget);
+		}
+	});
+};
+
+/**
+ * Calls the block asset functions and adds the loaded class to the block.
+ * @param {object} block The block element.
+ */
+function callBlockJs(block) {
+	if (!block.classList.contains('loaded')) {
+		Promise.all([
+			options.assetMap[block.dataset.assetkey].js(),
+			block.dataset.cssload !== 'false' && loadCss(block.dataset.assetkey)
+		]).then((module) => {
+			try {
+				if (block.dataset.jsload !== 'false') {
+					module[0].default({
+						block,
+						css: false
+					});
+				} else {
+					options.debugLogMessages &&
+						console.log(
+							`Skipping JS load for block: ${block.dataset.assetkey}`
+						);
+				}
+				// block.classList.add('loaded');
+			} catch (error) {
+				console.log('could not load block js', error);
+			}
+		});
+	}
+}
+
+/**
+ * Checks to see if the css for the block has already been included in the 'criticalconfig' window object.
+ * Will return true if it is.
+ * @param {string} assetKey The assetkey string of the block.
+ * @returns {boolean}
+ */
+export function inCriticalCssConfig(assetKey) {
+	if (!globalThis.criticalConfig) {
+		return false;
+	}
+	if (
+		globalThis.criticalConfig &&
+		globalThis.criticalConfig.indexOf(assetKey) === -1
+	) {
+		return false;
+	}
+	return true;
+}
+
+/**
+ * Dynamically loads the css for the block if it has not already been included in critical css or the css property is set to false.
+ * @param {string} assetKey The assetkey string of the block.
+ * @param {object} options The options object which will at the very least contain the css property set to true.
+ * @returns {promise}
+ */
+export function loadCss(assetKey) {
+	if (options.css == true) {
+		const promise = new Promise((resolve) => {
+			if (!inCriticalCssConfig(assetKey)) {
+				const link = `<link rel="stylesheet" href="./public/block-${assetKey}/${assetKey}${options.fileSuffixCss}" />`;
+				document.head.insertAdjacentHTML('beforeend', link);
+				resolve(true);
+			} else {
+				return resolve(true);
+			}
+		});
+	}
+}
+
+const api = {
+	lazyloaderInit,
+	options
+};
+
+export default api;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@total_onion/onion-library",
-	"version": "2.0.197",
+	"version": "2.0.199",
 	"description": "Component library",
 	"main": "index.js",
 	"scripts": {
@@ -18,7 +18,6 @@
 	},
 	"homepage": "https://github.com/TotalOnion/onion-library#readme",
 	"dependencies": {
-		"@total_onion/onion-loader": "^1.0.10",
 		"@total_onion/onion-modalcontroller": "^1.0.5",
 		"@total_onion/onion-utils": "^1.0.10",
 		"@total_onion/onion-videocontroller": "^1.0.2",

package/public/block-site-copyright-notice-v3/site-copyright-notice-v3.css

@@ -0,0 +1,3 @@
+.site-copyright-notice-v3 {
+	color: red;
+}

package/public/block-site-copyright-notice-v3/site-copyright-notice-v3.js

@@ -1,7 +1,60 @@
 export default function sitecopyrightnoticev3Js(options = {}) {
-  try {
-    const { block } = options;
-  } catch (error) {
-    console.error(error);
-  }
+	try {
+		const {block} = options;
+
+		customElements.define(
+			'site-copyright-notice-v3',
+			class extends HTMLElement {
+				static observedAttributes = ['data-copyright-text'];
+				constructor() {
+					super();
+					let template = document.querySelector(
+						'#site-copyright-notice-v3'
+					);
+					let templateContent = template.content;
+
+					// const shadowRoot = this.attachShadow({mode: 'open'});
+					// shadowRoot.appendChild(
+					// 	document.importNode(templateContent, true)
+					// );
+					// shadowRoot.querySelector(
+					// 	'.site-copyright-notice-v3__title'
+					// ).innerText = this.dataset.copyrightText;
+
+					this.appendChild(
+						document.importNode(templateContent, true)
+					);
+
+					this.classList.add('loaded');
+				}
+				connectedCallback() {
+					console.log('Custom element added to page.');
+					this.querySelector(
+						'.site-copyright-notice-v3__title'
+					).innerText = this.dataset.copyrightText;
+				}
+
+				// disconnectedCallback() {
+				// 	console.log('Custom element removed from page.');
+				// }
+
+				// connectedMoveCallback() {
+				// 	console.log('Custom element moved with moveBefore()');
+				// }
+
+				// adoptedCallback() {
+				// 	console.log('Custom element moved to new page.');
+				// }
+
+				attributeChangedCallback(name, oldValue, newValue) {
+					console.log(`Attribute ${name} has changed.`);
+					this.querySelector(
+						'.site-copyright-notice-v3__title'
+					).innerText = this.dataset.copyrightText;
+				}
+			}
+		);
+	} catch (error) {
+		console.error(error);
+	}
 }

package/components/block-site-copyright-notice-v3/site-copyright-notice-v3.js

@@ -1,7 +0,0 @@
-export default function sitecopyrightnoticev3Js(options = {}) {
-	try {
-		const {block} = options;
-	} catch (error) {
-		console.error(error);
-	}
-}

package/fields.json

@@ -1,4 +0,0 @@
-{
-	"source": "acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47]",
-	"layouts": "<div class=\"layout\" data-id=\"65e73e1d5ad6d\" data-layout=\"standard_content_box_v2\">\n                    \n            <input type=\"hidden\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][acf_fc_layout]\" value=\"standard_content_box_v2\">            \n            <div class=\"acf-fc-layout-handle\" title=\"Drag to reorder\" data-name=\"collapse-layout\">\n                <span class=\"acf-fc-layout-order\">1</span> <span class=\"acfe-layout-title acf-js-tooltip\" title=\"Layout: Text v2\"><span class=\"acfe-layout-title-text\"><span>Text v2</span></span></span>            </div>\n            \n            <input type=\"text\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_layout_658063d590f0f_title\" class=\"acfe-flexible-control-title\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_layout_658063d590f0f_title]\" value=\"Text v2\" placeholder=\"Text v2\" data-acfe-flexible-control-title-input=\"1\"><input type=\"hidden\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_layout_658063d590f0f_toggle\" class=\"acfe-flexible-layout-toggle\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_layout_658063d590f0f_toggle]\" value=\"\">            <div class=\"acf-fc-layout-controls\">\n                                    <a class=\"acf-icon small light acf-js-tooltip acfe-flexible-icon dashicons dashicons-category\" href=\"#\" title=\"Copy layout\" data-acfe-flexible-control-copy=\"standard_content_box_v2\"></a>                                    <a class=\"acf-icon small light acf-js-tooltip acfe-flexible-icon dashicons dashicons-hidden\" href=\"#\" title=\"Toggle layout\" data-acfe-flexible-control-toggle=\"standard_content_box_v2\"></a>                                    <a class=\"acf-icon -plus small light acf-js-tooltip\" href=\"#\" data-name=\"add-layout\" title=\"Add layout\"></a>                                    <a class=\"acf-icon -duplicate small light acf-js-tooltip\" href=\"#\" data-name=\"duplicate-layout\" title=\"Duplicate layout\"></a>                                    <a class=\"acf-icon -minus small light acf-js-tooltip\" href=\"#\" data-name=\"remove-layout\" title=\"Remove layout\"></a>                                    <a class=\"acf-icon -collapse small acf-js-tooltip\" href=\"#\" data-name=\"collapse-layout\" title=\"Click to toggle\"></a>                            </div>\n                    <div class=\"acf-fields \">\n                \n        <div class=\"acf-field acf-field-true-false acf-field-6580636e8fad2\" data-name=\"enable_standard_content_box_v2\" data-type=\"true_false\" data-key=\"field_6580636e8fad2\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6580636e8fad2\">Enable content box v2</label></div>\n<div class=\"acf-input\">\n<div class=\"acf-true-false\">\n\t\t\t<input type=\"hidden\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6580636e8fad2]\" value=\"0\">\t<label>\n\t\t<input type=\"checkbox\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6580636e8fad2\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6580636e8fad2]\" value=\"1\" class=\"acf-switch-input\" autocomplete=\"off\">\n\t\t\t<div class=\"acf-switch\"><span class=\"acf-switch-on\">Yes</span><span class=\"acf-switch-off\">No</span><div class=\"acf-switch-slider\"></div></div>\t\t\t\t</label>\n</div>\n\t\t\t</div>\n</div>\n<div class=\"acf-field acf-field-accordion acf-field-657305391a395 acf-accordion\" data-type=\"accordion\" data-key=\"field_657305391a395\">\n<div class=\"acf-label acf-accordion-title\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a395\">Text Editor Settings</label></div>\n<div class=\"acf-input acf-accordion-content\">\n\t\t<div class=\"acf-fields\"><div class=\"acf-field acf-field-tab acf-field-657305391a3e1\" data-type=\"tab\" data-key=\"field_657305391a3e1\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a3e1\">Desktop</label></div>\n<div class=\"acf-input\">\n\t\t<a href=\"\" class=\"acf-tab-button\" data-placement=\"top\" data-endpoint=\"0\" data-key=\"field_657305391a3e1\">Desktop</a>\n\t\t\t<a href=\"\" class=\"acf-tab-button\" data-placement=\"top\" data-endpoint=\"0\" data-key=\"field_657305391a3e1\">Desktop</a></div>\n</div><div class=\"acf-field acf-field-select acf-field-65730630ec0cd\" data-name=\"typographic_style\" data-type=\"select\" data-key=\"field_65730630ec0cd\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65730630ec0cd\">Typographic style</label></div>\n<div class=\"acf-input\">\n<input type=\"hidden\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65730630ec0cd-input\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_65730630ec0cd]\" value=\"\"><select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65730630ec0cd\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_65730630ec0cd]\" data-ui=\"1\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"0\" data-select2-id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65730630ec0cd\" data-ajax=\"0\"><option value=\"__h1-l-sizing\" data-select2-id=\"70\">H1 Large</option><option value=\"__h1-sizing\" data-select2-id=\"71\">H1</option><option value=\"__h2-sizing\" data-select2-id=\"72\">H2</option><option value=\"__h3-sizing\" data-select2-id=\"73\">H3</option><option value=\"__h4-sizing\" data-select2-id=\"74\">H4</option><option value=\"__h5-sizing\" data-select2-id=\"75\">H5</option><option value=\"__h6-sizing\" data-select2-id=\"76\">H6</option><option value=\"__sh1-sizing\" data-select2-id=\"77\">SH1</option><option value=\"__sh2-sizing\" data-select2-id=\"78\">SH2</option><option value=\"__sh3-sizing\" data-select2-id=\"79\">SH3</option><option value=\"__sh4-sizing\" data-select2-id=\"80\">SH4</option><option value=\"__sh5-sizing\" data-select2-id=\"81\">SH5</option><option value=\"__sh6-sizing\" data-select2-id=\"82\">SH6</option><option value=\"__p-l-sizing\" data-select2-id=\"83\">P large</option><option value=\"__p-sizing\" selected=\"selected\" data-i=\"0\" data-select2-id=\"84\">P</option><option value=\"__p-s-sizing\" data-select2-id=\"85\">P small</option><option value=\"__p-xs-sizing\" data-select2-id=\"86\">P extra small</option><option value=\"__p-xxs-sizing\" data-select2-id=\"87\">P extra extra small</option><option value=\"__p-xxxs-sizing\" data-select2-id=\"88\">P extra extra extra small</option></select></div>\n</div><div class=\"acf-field acf-field-select acf-field-6584704d5ba56\" data-name=\"desktop_default_text_colour\" data-type=\"select\" data-key=\"field_6584704d5ba56\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_6584704d5ba56\">Desktop default text colour</label></div>\n<div class=\"acf-input\">\n<select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_6584704d5ba56\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_6584704d5ba56]\" data-ui=\"0\" data-ajax=\"0\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"1\"><option value=\"\" selected=\"selected\" data-i=\"0\">Select</option><option value=\"__var(--theme-primary-text-colour)\">Theme primary text</option><option value=\"__var(--theme-secondary-text-colour)\">Theme secondary text</option><option value=\"__var(--theme-tertiary-text-colour)\">Theme tertiary text</option></select></div>\n</div><div class=\"acf-field acf-field-select acf-field-657305391a472\" style=\"width:50%;\" data-name=\"desktop_default_text_align\" data-type=\"select\" data-key=\"field_657305391a472\" data-width=\"50\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a472\">Desktop default text align</label></div>\n<div class=\"acf-input\">\n<input type=\"hidden\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a472-input\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a472]\" value=\"\"><select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a472\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a472]\" data-ui=\"1\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"1\" data-select2-id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a472\" data-ajax=\"1\"><option value=\"\" selected=\"selected\" data-i=\"0\" data-select2-id=\"90\">- Select -</option></select></div>\n</div><div class=\"acf-field acf-field-select acf-field-657305391a4b9\" style=\"width:50%;\" data-name=\"desktop_default_text_transform\" data-type=\"select\" data-key=\"field_657305391a4b9\" data-width=\"50\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a4b9\">Desktop default text transform</label><p class=\"description\">Leave empty to allow mixed case</p></div>\n<div class=\"acf-input\">\n<input type=\"hidden\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a4b9-input\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a4b9]\" value=\"\"><select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a4b9\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a4b9]\" data-ui=\"1\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"1\" data-select2-id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a4b9\" data-ajax=\"1\"><option value=\"\" selected=\"selected\" data-i=\"0\" data-select2-id=\"92\">- Select -</option></select></div>\n</div><div class=\"acf-field acf-field-select acf-field-657305391a502\" style=\"width:50%;\" data-name=\"desktop_default_font_weight\" data-type=\"select\" data-key=\"field_657305391a502\" data-width=\"50\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a502\">Desktop default font weight</label></div>\n<div class=\"acf-input\">\n<input type=\"hidden\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a502-input\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a502]\" value=\"\"><select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a502\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a502]\" data-ui=\"1\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"1\" data-select2-id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a502\" data-ajax=\"1\"><option value=\"\" selected=\"selected\" data-i=\"0\" data-select2-id=\"94\">- Select -</option></select></div>\n</div><div class=\"acf-field acf-field-range acf-field-65afed77d3cf9\" style=\"width:50%;\" data-name=\"wysiwyg_max_width\" data-type=\"range\" data-key=\"field_65afed77d3cf9\" data-width=\"50\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65afed77d3cf9\">Wysiwyg Max Width (%)</label></div>\n<div class=\"acf-input\">\n<div class=\"acf-range-wrap\"><input type=\"range\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65afed77d3cf9\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_65afed77d3cf9]\" value=\"100\" min=\"0\" max=\"100\" step=\"1\"><input type=\"number\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65afed77d3cf9-alt\" value=\"100\" step=\"1\" style=\"width: 3.9em;\"></div></div>\n</div><div class=\"acf-field acf-field-tab acf-field-657305391a549\" data-type=\"tab\" data-key=\"field_657305391a549\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a549\">Mobile</label></div>\n<div class=\"acf-input\">\n\t\t<a href=\"\" class=\"acf-tab-button\" data-placement=\"top\" data-endpoint=\"0\" data-key=\"field_657305391a549\">Mobile</a>\n\t\t\t<a href=\"\" class=\"acf-tab-button\" data-placement=\"top\" data-endpoint=\"0\" data-key=\"field_657305391a549\">Mobile</a></div>\n</div><div class=\"acf-field acf-field-select acf-field-65847772ec801 acf-hidden\" data-name=\"typographic_style_mobile\" data-type=\"select\" data-key=\"field_65847772ec801\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65847772ec801\">Typographic style mobile</label></div>\n<div class=\"acf-input\">\n<input type=\"hidden\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65847772ec801-input\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_65847772ec801]\" value=\"\"><select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65847772ec801\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_65847772ec801]\" data-ui=\"1\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"0\" data-select2-id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65847772ec801\" data-ajax=\"1\"><option value=\"__p-sizing\" selected=\"selected\" data-i=\"0\" data-select2-id=\"96\">P</option></select></div>\n</div><div class=\"acf-field acf-field-select acf-field-657305391a56c acf-hidden\" data-name=\"mobile_default_text_colour\" data-type=\"select\" data-key=\"field_657305391a56c\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a56c\">Mobile default text colour</label><p class=\"description\">Leave empty to use default theme colour</p></div>\n<div class=\"acf-input\">\n<input type=\"hidden\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a56c-input\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a56c]\" value=\"\"><select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a56c\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a56c]\" data-ui=\"1\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"1\" data-select2-id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a56c\" data-ajax=\"0\"><option value=\"\" selected=\"selected\" data-i=\"0\" data-select2-id=\"98\">- Select -</option><option value=\"__var(--theme-primary-text-colour)\" data-select2-id=\"99\">Theme primary text colour</option><option value=\"__var(--theme-secondary-text-colour)\" data-select2-id=\"100\">Theme secondary text colour</option><option value=\"__var(--theme-tertiary-text-colour)\" data-select2-id=\"101\">Theme tertiary text</option></select></div>\n</div><div class=\"acf-field acf-field-select acf-field-657305391a5d6 acf-hidden\" style=\"width:50%;\" data-name=\"mobile_default_text_align\" data-type=\"select\" data-key=\"field_657305391a5d6\" data-width=\"50\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a5d6\">Mobile default text align</label></div>\n<div class=\"acf-input\">\n<input type=\"hidden\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a5d6-input\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a5d6]\" value=\"\"><select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a5d6\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a5d6]\" data-ui=\"1\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"1\" data-select2-id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a5d6\" data-ajax=\"0\"><option value=\"\" selected=\"selected\" data-i=\"0\" data-select2-id=\"103\">- Select -</option><option value=\"__left\" data-select2-id=\"104\">Left</option><option value=\"__center\" data-select2-id=\"105\">Center</option><option value=\"__right\" data-select2-id=\"106\">Right</option></select></div>\n</div><div class=\"acf-field acf-field-select acf-field-657305391a642 acf-hidden\" style=\"width:50%;\" data-name=\"mobile_default_text_transform\" data-type=\"select\" data-key=\"field_657305391a642\" data-width=\"50\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a642\">Mobile default text transform</label><p class=\"description\">Leave empty to allow mixed case</p></div>\n<div class=\"acf-input\">\n<input type=\"hidden\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a642-input\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a642]\" value=\"\"><select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a642\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a642]\" data-ui=\"1\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"1\" data-select2-id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a642\" data-ajax=\"0\"><option value=\"\" selected=\"selected\" data-i=\"0\" data-select2-id=\"108\">- Select -</option><option value=\"__uppercase\" data-select2-id=\"109\">Uppercase</option><option value=\"__capitalize\" data-select2-id=\"110\">Capitalize</option></select></div>\n</div><div class=\"acf-field acf-field-select acf-field-657305391a6a0 acf-hidden\" style=\"width:50%;\" data-name=\"mobile_default_font_weight\" data-type=\"select\" data-key=\"field_657305391a6a0\" data-width=\"50\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a6a0\">Mobile default font weight</label></div>\n<div class=\"acf-input\">\n<input type=\"hidden\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a6a0-input\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a6a0]\" value=\"\"><select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a6a0\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a6a0]\" data-ui=\"1\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"1\" data-select2-id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a6a0\" data-ajax=\"0\"><option value=\"\" selected=\"selected\" data-i=\"0\" data-select2-id=\"112\">- Select -</option><option value=\"__default\" data-select2-id=\"113\">Default</option><option value=\"__bold\" data-select2-id=\"114\">Bold</option></select></div>\n</div><div class=\"acf-field acf-field-range acf-field-65afed47d3cf8 acf-hidden\" style=\"width:50%;\" data-name=\"wysiwyg_max_width_mobile\" data-type=\"range\" data-key=\"field_65afed47d3cf8\" data-width=\"50\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65afed47d3cf8\">Wysiwyg Max Width Mobile(%)</label></div>\n<div class=\"acf-input\">\n<div class=\"acf-range-wrap\"><input type=\"range\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65afed47d3cf8\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_65afed47d3cf8]\" value=\"100\" min=\"0\" max=\"100\" step=\"1\"><input type=\"number\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65afed47d3cf8-alt\" value=\"100\" step=\"1\" style=\"width: 3.9em;\"></div></div>\n</div><div class=\"acf-field acf-field-tab acf-field-657305391a6ee\" data-type=\"tab\" data-key=\"field_657305391a6ee\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a6ee\">General</label></div>\n<div class=\"acf-input\">\n\t\t<a href=\"\" class=\"acf-tab-button\" data-placement=\"top\" data-endpoint=\"0\" data-key=\"field_657305391a6ee\">General</a>\n\t\t\t<a href=\"\" class=\"acf-tab-button\" data-placement=\"top\" data-endpoint=\"0\" data-key=\"field_657305391a6ee\">General</a></div>\n</div><div class=\"acf-field acf-field-select acf-field-65730562d621d acf-hidden\" data-name=\"element_type\" data-type=\"select\" data-key=\"field_65730562d621d\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65730562d621d\">Element type</label></div>\n<div class=\"acf-input\">\n<select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_65730562d621d\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_65730562d621d]\" data-ui=\"0\" data-ajax=\"0\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"0\"><option value=\"__h1\">H1</option><option value=\"__h2\">H2</option><option value=\"__h3\">H3</option><option value=\"__h4\">H4</option><option value=\"__h5\">H5</option><option value=\"__h6\">H6</option><option value=\"__p\" selected=\"selected\" data-i=\"0\">P</option></select></div>\n</div><div class=\"acf-field acf-field-true-false acf-field-657305391a737 acf-hidden\" data-name=\"enable_text_outline\" data-type=\"true_false\" data-key=\"field_657305391a737\" data-conditions=\"[[{&quot;field&quot;:&quot;field_657305391a42a&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;&quot;}]]\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a737\">Enable Text outline</label></div>\n<div class=\"acf-input\">\n<div class=\"acf-true-false\">\n\t\t\t<input type=\"hidden\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a737]\" value=\"0\">\t<label>\n\t\t<input type=\"checkbox\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a737\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a737]\" value=\"1\" class=\"acf-switch-input\" autocomplete=\"off\">\n\t\t\t<div class=\"acf-switch\"><span class=\"acf-switch-on\">Yes</span><span class=\"acf-switch-off\">No</span><div class=\"acf-switch-slider\"></div></div>\t\t\t\t</label>\n</div>\n\t\t\t</div>\n</div><div class=\"acf-field acf-field-range acf-field-657305391a77f acf-hidden\" data-name=\"text_outline_width\" data-type=\"range\" data-key=\"field_657305391a77f\" data-conditions=\"[[{&quot;field&quot;:&quot;field_657305391a42a&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;&quot;},{&quot;field&quot;:&quot;field_657305391a737&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;1&quot;}]]\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a77f\">Text outline width</label></div>\n<div class=\"acf-input\">\n<div class=\"acf-range-wrap\"><input type=\"range\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a77f\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a77f]\" value=\"1\" min=\"0\" max=\"10\" step=\"1\" disabled=\"\"><input type=\"number\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a77f-alt\" value=\"1\" step=\"1\" style=\"width: 3.2em;\"></div></div>\n</div><div class=\"acf-field acf-field-color-picker acf-field-657305391a7c6 acf-hidden\" data-name=\"text_outline_colour\" data-type=\"color_picker\" data-key=\"field_657305391a7c6\" data-conditions=\"[[{&quot;field&quot;:&quot;field_657305391a42a&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;&quot;},{&quot;field&quot;:&quot;field_657305391a737&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;1&quot;}]]\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a7c6\">Text outline colour</label></div>\n<div class=\"acf-input\">\n        <div class=\"acf-color-picker\" data-display=\"default\" data-button_label=\"Select Color\" data-allow_null=\"1\" data-color_picker=\"1\" data-absolute=\"0\" data-input=\"1\" data-colors=\"[]\" data-alpha=\"0\">\n            \n            <input type=\"hidden\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a7c6]\" value=\"\" disabled=\"\"><input type=\"text\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a7c6\" class=\"wp-color-picker\" value=\"\" autocomplete=\"off\">            \n                \n                            \n                        \n        </div>\n        </div>\n</div><div class=\"acf-field acf-field-true-false acf-field-657305391a80f acf-hidden\" data-name=\"enable_text_shadow\" data-type=\"true_false\" data-key=\"field_657305391a80f\" data-conditions=\"[[{&quot;field&quot;:&quot;field_657305391a42a&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;&quot;}]]\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a80f\">Enable Text Shadow</label></div>\n<div class=\"acf-input\">\n<div class=\"acf-true-false\">\n\t\t\t<input type=\"hidden\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a80f]\" value=\"0\">\t<label>\n\t\t<input type=\"checkbox\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a80f\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a80f]\" value=\"1\" class=\"acf-switch-input\" autocomplete=\"off\">\n\t\t\t<div class=\"acf-switch\"><span class=\"acf-switch-on\">Yes</span><span class=\"acf-switch-off\">No</span><div class=\"acf-switch-slider\"></div></div>\t\t\t\t</label>\n</div>\n\t\t\t</div>\n</div><div class=\"acf-field acf-field-range acf-field-657305391a859 acf-hidden\" data-name=\"text_shadow_horizontal_offset\" data-type=\"range\" data-key=\"field_657305391a859\" data-conditions=\"[[{&quot;field&quot;:&quot;field_657305391a80f&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;1&quot;}]]\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a859\">Text shadow horizontal offset</label></div>\n<div class=\"acf-input\">\n<div class=\"acf-range-wrap\"><input type=\"range\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a859\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a859]\" value=\"0\" min=\"-40\" max=\"40\" step=\"1\" disabled=\"\"><input type=\"number\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a859-alt\" value=\"0\" step=\"1\" style=\"width: 3.9em;\"></div></div>\n</div><div class=\"acf-field acf-field-range acf-field-657305391a8a1 acf-hidden\" data-name=\"text_shadow_vertical_offset\" data-type=\"range\" data-key=\"field_657305391a8a1\" data-conditions=\"[[{&quot;field&quot;:&quot;field_657305391a80f&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;1&quot;}]]\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a8a1\">Text shadow vertical offset</label></div>\n<div class=\"acf-input\">\n<div class=\"acf-range-wrap\"><input type=\"range\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a8a1\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a8a1]\" value=\"0\" min=\"-40\" max=\"40\" step=\"1\" disabled=\"\"><input type=\"number\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a8a1-alt\" value=\"0\" step=\"1\" style=\"width: 3.9em;\"></div></div>\n</div><div class=\"acf-field acf-field-range acf-field-657305391a8fd acf-hidden\" data-name=\"text_shadow_blur\" data-type=\"range\" data-key=\"field_657305391a8fd\" data-conditions=\"[[{&quot;field&quot;:&quot;field_657305391a80f&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;1&quot;}]]\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a8fd\">Text shadow blur</label></div>\n<div class=\"acf-input\">\n<div class=\"acf-range-wrap\"><input type=\"range\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a8fd\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a8fd]\" value=\"0\" min=\"0\" max=\"20\" step=\"1\" disabled=\"\"><input type=\"number\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a8fd-alt\" value=\"0\" step=\"1\" style=\"width: 3.2em;\"></div></div>\n</div><div class=\"acf-field acf-field-color-picker acf-field-657305391a955 acf-hidden\" data-name=\"text_shadow_colour\" data-type=\"color_picker\" data-key=\"field_657305391a955\" data-conditions=\"[[{&quot;field&quot;:&quot;field_657305391a80f&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;1&quot;}]]\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a955\">Text shadow colour</label></div>\n<div class=\"acf-input\">\n        <div class=\"acf-color-picker\" data-display=\"default\" data-button_label=\"Select Color\" data-allow_null=\"1\" data-color_picker=\"1\" data-absolute=\"0\" data-input=\"1\" data-colors=\"[]\" data-alpha=\"1\">\n            \n            <input type=\"hidden\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a955]\" value=\"rgba(255,255,255,0.5)\" disabled=\"\"><input type=\"text\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a955\" class=\"wp-color-picker\" value=\"rgba(255,255,255,0.5)\" autocomplete=\"off\" data-alpha-enabled=\"true\" data-alpha-color-type=\"hex\" style=\"width: 278px;\">            \n                \n                            \n                        \n        </div>\n        </div>\n</div><div class=\"acf-field acf-field-true-false acf-field-657305391a99f acf-hidden\" data-name=\"enable_wysiwyg_decoration\" data-type=\"true_false\" data-key=\"field_657305391a99f\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a99f\">Enable wysiwyg decoration</label></div>\n<div class=\"acf-input\">\n<div class=\"acf-true-false\">\n\t\t\t<input type=\"hidden\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a99f]\" value=\"0\">\t<label>\n\t\t<input type=\"checkbox\" id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a99f\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a99f]\" value=\"1\" class=\"acf-switch-input\" autocomplete=\"off\">\n\t\t\t<div class=\"acf-switch\"><span class=\"acf-switch-on\">Yes</span><span class=\"acf-switch-off\">No</span><div class=\"acf-switch-slider\"></div></div>\t\t\t\t</label>\n</div>\n\t\t\t</div>\n</div><div class=\"acf-field acf-field-select acf-field-657305391a9e8 acf-hidden\" data-name=\"wysiwyg_decoration_style\" data-type=\"select\" data-key=\"field_657305391a9e8\" data-conditions=\"[[{&quot;field&quot;:&quot;field_657305391a99f&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;1&quot;}]]\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a9e8\">Container decoration style</label></div>\n<div class=\"acf-input\">\n<select id=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6581ad01408dc_field_657305391a9e8\" class=\"\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6581ad01408dc_field_657305391a9e8]\" data-ui=\"0\" data-ajax=\"0\" data-multiple=\"0\" data-placeholder=\"Select\" data-allow_null=\"0\" disabled=\"\"><option value=\"__wysiwyg-decoration-1\" selected=\"selected\" data-i=\"0\">Decoration style 1</option></select></div>\n</div></div>\n\t\t\t</div>\n</div><div class=\"acf-field acf-field-accordion\" data-type=\"accordion\"><div class=\"acf-input\"><div class=\"acf-fields\" data-endpoint=\"1\"></div></div></div>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n<div class=\"acf-field acf-field-wysiwyg acf-field-6580636e8fbaa acf-hidden\" data-name=\"standard_content_box_text_content_v2\" data-type=\"wysiwyg\" data-key=\"field_6580636e8fbaa\" data-acfe-wysiwyg-auto-init=\"1\" data-acfe-wysiwyg-height=\"300\" data-conditions=\"[[{&quot;field&quot;:&quot;field_6580636e8fad2&quot;,&quot;operator&quot;:&quot;==&quot;,&quot;value&quot;:&quot;1&quot;}]]\" hidden=\"\">\n<div class=\"acf-label\">\n<label for=\"acf-field_63a06d8fb1a47-acfcloneindex-field_658063d590f11_field_6580636e8fbaa\">Text content</label></div>\n<div class=\"acf-input\">\n\t\t<div id=\"wp-acf-editor-65e73e1d73ae4-wrap\" class=\"acf-editor-wrap wp-core-ui wp-editor-wrap tmce-active delay\" data-toolbar=\"colour_bold_italic_underline_link\">\n\t\t\t<div id=\"wp-acf-editor-65e73e1d73ae4-editor-tools\" class=\"wp-editor-tools hide-if-no-js\">\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t<div id=\"wp-acf-editor-65e73e1d73ae4-editor-container\" class=\"wp-editor-container\">\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t<textarea id=\"acf-editor-65e73e1d73ae4\" class=\"wp-editor-area\" name=\"acf-7a9bb0ea-83d9-4315-a3b0-dcfb3ee03054[field_63a06d8fb1a47][65e73e1d5ad6d][field_658063d590f11_field_6580636e8fbaa]\" style=\"height:300px;\" disabled=\"\"></textarea>\t\t\t</div>\n\t\t</div>\n\t\t\t</div>\n</div>\n        \n            \n                            <div class=\"acfe-flexible-opened-actions\"><a href=\"javascript:void(0);\" class=\"button\">Close</a></div>\n                    \n            </div>\n        \n        </div>"
-}