setAttributes({
[`${controlName}ovl_bgImgAttachment`]:
ovl_bgImgAttachment,
})
}
/>
{ovl_bgImgAttachment === "fixed" && (
Note: Attachment Fixed works only on desktop.
)}
setAttributes({
[`${controlName}ovl_bgImgRepeat`]:
ovl_bgImgRepeat,
})
}
/>
setAttributes({
[`${controlName}ovl_backgroundSize`]:
ovl_backgroundSize,
})
}
/>
{ovl_backgroundSize === "custom" && (
<>
setAttributes({
[`${controlName}ovl_bgImgCustomSizeUnit`]:
ovl_bgImgCustomSizeUnit,
})
}
/>
setAttributes({
[`${controlName}ovl_bgImgCustomSize`]:
ovl_bgImgCustomSize,
})
}
/>
)}
)}
{resOption === "Tablet" && (
<>
setAttributes({
[`TAB${controlName}ovl_bgImgPos`]:
TABovl_bgImgPos,
})
}
/>
{TABovl_bgImgPos === "custom" && (
<>
setAttributes({
[`TAB${controlName}ovl_bgImgcustomPosXUnit`]:
TABovl_bgImgcustomPosXUnit,
})
}
/>
setAttributes({
[`TAB${controlName}ovl_bgImgcustomPosX`]:
TABovl_bgImgcustomPosX,
})
}
/>
setAttributes({
[`TAB${controlName}ovl_bgImgcustomPosYUnit`]:
TABovl_bgImgcustomPosYUnit,
})
}
/>
setAttributes({
[`TAB${controlName}ovl_bgImgcustomPosY`]:
TABovl_bgImgcustomPosY,
})
}
/>
)}
setAttributes({
[`${controlName}ovl_bgImgAttachment`]:
ovl_bgImgAttachment,
})
}
/>
{ovl_bgImgAttachment === "fixed" && (
Note: Attachment Fixed works only on desktop.
)}
setAttributes({
[`TAB${controlName}ovl_bgImgRepeat`]:
TABovl_bgImgRepeat,
})
}
/>
setAttributes({
[`TAB${controlName}ovl_backgroundSize`]:
TABovl_backgroundSize,
})
}
/>
{TABovl_backgroundSize === "custom" && (
<>
setAttributes({
[`TAB${controlName}ovl_bgImgCustomSizeUnit`]:
TABovl_bgImgCustomSizeUnit,
})
}
/>
setAttributes({
[`TAB${controlName}ovl_bgImgCustomSize`]:
TABovl_bgImgCustomSize,
})
}
/>
)}
)}
{resOption === "Mobile" && (
<>
setAttributes({
[`MOB${controlName}ovl_bgImgPos`]:
MOBovl_bgImgPos,
})
}
/>
{MOBovl_bgImgPos === "custom" && (
<>
setAttributes({
[`MOB${controlName}ovl_bgImgcustomPosXUnit`]:
MOBovl_bgImgcustomPosXUnit,
})
}
/>
setAttributes({
[`MOB${controlName}ovl_bgImgcustomPosX`]:
MOBovl_bgImgcustomPosX,
})
}
/>
setAttributes({
[`MOB${controlName}ovl_bgImgcustomPosYUnit`]:
MOBovl_bgImgcustomPosYUnit,
})
}
/>
setAttributes({
[`MOB${controlName}ovl_bgImgcustomPosY`]:
MOBovl_bgImgcustomPosY,
})
}
/>
)}
setAttributes({
[`${controlName}ovl_bgImgAttachment`]:
ovl_bgImgAttachment,
})
}
/>
{ovl_bgImgAttachment === "fixed" && (
Note: Attachment Fixed works only on desktop.
)}
setAttributes({
[`MOB${controlName}ovl_bgImgRepeat`]:
MOBovl_bgImgRepeat,
})
}
/>
setAttributes({
[`MOB${controlName}ovl_backgroundSize`]:
MOBovl_backgroundSize,
})
}
/>
{MOBovl_backgroundSize === "custom" && (
<>
setAttributes({
[`MOB${controlName}ovl_bgImgCustomSizeUnit`]:
MOBovl_bgImgCustomSizeUnit,
})
}
/>
setAttributes({
[`MOB${controlName}ovl_bgImgCustomSize`]:
MOBovl_bgImgCustomSize,
})
}
/>
)}
)}
)}
)}
)}
{overlayType === "gradient" && (
setAttributes({
[`${controlName}overlayGradient`]: overlayGradient,
})
}
/>
)}
setAttributes({
[`${controlName}ovl_opacity`]: ovl_opacity,
})
}
step={0.01}
min={0}
max={1}
/>
setAttributes({
[`${controlName}ovl_blendMode`]: ovl_blendMode,
})
}
/>
setAttributes({
[`${controlName}ovl_allowFilters`]: !ovl_allowFilters,
})
}
/>
{ovl_allowFilters && (
<>
setAttributes({
[`${controlName}ovl_fltrBlur`]: ovl_fltrBlur,
})
}
step={0.1}
min={0}
max={10}
/>
setAttributes({
[`${controlName}ovl_fltrBrightness`]: ovl_fltrBrightness,
})
}
step={1}
min={0}
max={200}
/>
setAttributes({
[`${controlName}ovl_fltrContrast`]: ovl_fltrContrast,
})
}
step={1}
min={0}
max={200}
/>
setAttributes({
[`${controlName}ovl_fltrSaturation`]: ovl_fltrSaturation,
})
}
step={1}
min={0}
max={200}
/>
setAttributes({
[`${controlName}ovl_fltrHue`]: ovl_fltrHue,
})
}
step={1}
min={0}
max={360}
/>
)}
)}
{ovl_hoverType === "hover" && (
<>
{[
{ label: "Classic", value: "classic" },
{ label: "Gradient", value: "gradient" },
].map(({ value, label }) => (
))}
{hov_overlayType === "classic" && (
<>
setAttributes({
[`hov_${controlName}overlayColor`]: hov_overlayColor,
})
}
/>
{noOverlayBgi === false && (
<>
setAttributes({
[`hov_${controlName}ovl_bgImageURL`]: url,
[`hov_${controlName}ovl_bgImageID`]: id,
})
}
type="image"
value={hov_ovl_bgImageID}
render={({ open }) =>
!hov_ovl_bgImageURL && (
<>
)
}
/>
{hov_ovl_bgImageURL && (
<>
setAttributes({
[`hov_${controlName}ovl_bgImageURL`]: null,
})
}
/>
{resOption === "Desktop" && (
<>
setAttributes({
[`hov_${controlName}ovl_bgImgPos`]:
hov_ovl_bgImgPos,
})
}
/>
{hov_ovl_bgImgPos === "custom" && (
<>
setAttributes({
[`hov_${controlName}ovl_bgImgcustomPosXUnit`]:
hov_ovl_bgImgcustomPosXUnit,
})
}
/>
setAttributes({
[`hov_${controlName}ovl_bgImgcustomPosX`]:
hov_ovl_bgImgcustomPosX,
})
}
/>
setAttributes({
[`hov_${controlName}ovl_bgImgcustomPosYUnit`]:
hov_ovl_bgImgcustomPosYUnit,
})
}
/>
setAttributes({
[`hov_${controlName}ovl_bgImgcustomPosY`]:
hov_ovl_bgImgcustomPosY,
})
}
/>
)}
setAttributes({
[`hov_${controlName}ovl_bgImgAttachment`]:
hov_ovl_bgImgAttachment,
})
}
/>
{hov_ovl_bgImgAttachment === "fixed" && (
Note: Attachment Fixed works only on desktop.
)}
setAttributes({
[`hov_${controlName}ovl_bgImgRepeat`]:
hov_ovl_bgImgRepeat,
})
}
/>
setAttributes({
[`hov_${controlName}ovl_backgroundSize`]:
hov_ovl_backgroundSize,
})
}
/>
{hov_ovl_backgroundSize === "custom" && (
<>
setAttributes({
[`hov_${controlName}ovl_bgImgCustomSizeUnit`]:
hov_ovl_bgImgCustomSizeUnit,
})
}
/>
setAttributes({
[`hov_${controlName}ovl_bgImgCustomSize`]:
hov_ovl_bgImgCustomSize,
})
}
/>
)}
)}
{resOption === "Tablet" && (
<>
setAttributes({
[`hov_TAB${controlName}ovl_bgImgPos`]:
hov_TABovl_bgImgPos,
})
}
/>
{hov_TABovl_bgImgPos === "custom" && (
<>
setAttributes({
[`hov_TAB${controlName}ovl_bgImgcustomPosXUnit`]:
hov_TABovl_bgImgcustomPosXUnit,
})
}
/>
setAttributes({
[`hov_TAB${controlName}ovl_bgImgcustomPosX`]:
hov_TABovl_bgImgcustomPosX,
})
}
/>
setAttributes({
[`hov_TAB${controlName}ovl_bgImgcustomPosYUnit`]:
hov_TABovl_bgImgcustomPosYUnit,
})
}
/>
setAttributes({
[`hov_TAB${controlName}ovl_bgImgcustomPosY`]:
hov_TABovl_bgImgcustomPosY,
})
}
/>
)}
setAttributes({
[`hov_${controlName}ovl_bgImgAttachment`]:
hov_ovl_bgImgAttachment,
})
}
/>
{hov_ovl_bgImgAttachment === "fixed" && (
Note: Attachment Fixed works only on desktop.
)}
setAttributes({
[`hov_TAB${controlName}ovl_bgImgRepeat`]:
hov_TABovl_bgImgRepeat,
})
}
/>
setAttributes({
[`hov_TAB${controlName}ovl_backgroundSize`]:
hov_TABovl_backgroundSize,
})
}
/>
{hov_TABovl_backgroundSize === "custom" && (
<>
setAttributes({
[`hov_TAB${controlName}ovl_bgImgCustomSizeUnit`]:
hov_TABovl_bgImgCustomSizeUnit,
})
}
/>
setAttributes({
[`hov_TAB${controlName}ovl_bgImgCustomSize`]:
hov_TABovl_bgImgCustomSize,
})
}
/>
)}
)}
{resOption === "Mobile" && (
<>
setAttributes({
[`hov_MOB${controlName}ovl_bgImgPos`]:
hov_MOBovl_bgImgPos,
})
}
/>
{hov_MOBovl_bgImgPos === "custom" && (
<>
setAttributes({
[`hov_MOB${controlName}ovl_bgImgcustomPosXUnit`]:
hov_MOBovl_bgImgcustomPosXUnit,
})
}
/>
setAttributes({
[`hov_MOB${controlName}ovl_bgImgcustomPosX`]:
hov_MOBovl_bgImgcustomPosX,
})
}
/>
setAttributes({
[`hov_MOB${controlName}ovl_bgImgcustomPosYUnit`]:
hov_MOBovl_bgImgcustomPosYUnit,
})
}
/>
setAttributes({
[`hov_MOB${controlName}ovl_bgImgcustomPosY`]:
hov_MOBovl_bgImgcustomPosY,
})
}
/>
)}
setAttributes({
[`hov_${controlName}ovl_bgImgAttachment`]:
hov_ovl_bgImgAttachment,
})
}
/>
{hov_ovl_bgImgAttachment === "fixed" && (
Note: Attachment Fixed works only on desktop.
)}
setAttributes({
[`hov_MOB${controlName}ovl_bgImgRepeat`]:
hov_MOBovl_bgImgRepeat,
})
}
/>
setAttributes({
[`hov_MOB${controlName}ovl_backgroundSize`]:
hov_MOBovl_backgroundSize,
})
}
/>
{hov_MOBovl_backgroundSize === "custom" && (
<>
setAttributes({
[`hov_MOB${controlName}ovl_bgImgCustomSizeUnit`]:
hov_MOBovl_bgImgCustomSizeUnit,
})
}
/>
setAttributes({
[`hov_MOB${controlName}ovl_bgImgCustomSize`]:
hov_MOBovl_bgImgCustomSize,
})
}
/>
)}
)}
)}
)}
)}
{hov_overlayType === "gradient" && (
setAttributes({
[`hov_${controlName}overlayGradient`]: hov_overlayGradient,
})
}
/>
)}
{!noTransition && (
setAttributes({
[`${controlName}ovl_bg_transition`]: ovl_bg_transition,
})
}
/>
)}
setAttributes({
[`hov_${controlName}ovl_opacity`]: undefined,
})
}
>
setAttributes({
[`hov_${controlName}ovl_opacity`]: hov_ovl_opacity,
})
}
step={0.01}
min={0}
max={1}
/>
{!noTransition && hov_ovl_opacity && (
setAttributes({
[`${controlName}ovl_opacityTransition`]:
ovl_opacityTransition,
})
}
step={0.01}
min={0}
max={5}
/>
)}
setAttributes({
[`hov_${controlName}ovl_blendMode`]: hov_ovl_blendMode,
})
}
/>
setAttributes({
[`hov_${controlName}ovl_allowFilters`]: !hov_ovl_allowFilters,
})
}
/>
{hov_ovl_allowFilters && (
<>
setAttributes({
[`hov_${controlName}ovl_fltrBlur`]: hov_ovl_fltrBlur,
})
}
step={0.1}
min={0}
max={10}
/>
setAttributes({
[`hov_${controlName}ovl_fltrBrightness`]:
hov_ovl_fltrBrightness,
})
}
step={1}
min={0}
max={200}
/>
setAttributes({
[`hov_${controlName}ovl_fltrContrast`]:
hov_ovl_fltrContrast,
})
}
step={1}
min={0}
max={200}
/>
setAttributes({
[`hov_${controlName}ovl_fltrSaturation`]:
hov_ovl_fltrSaturation,
})
}
step={1}
min={0}
max={200}
/>
setAttributes({
[`hov_${controlName}ovl_fltrHue`]: hov_ovl_fltrHue,
})
}
step={1}
min={0}
max={360}
/>
{!noTransition && (
setAttributes({
[`${controlName}ovl_filtersTransition`]:
ovl_filtersTransition,
})
}
step={0.01}
min={0}
max={5}
/>
)}
)}
)}
);
}