npm - pro-gallery - Versions diffs - 5.0.140 → 5.0.141 - Mend

pro-gallery 5.0.140 → 5.0.141

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.

Files changed (9) hide show

package/dist/cjs/components/gallery/proGallery/navigationArrows.js CHANGED Viewed

@@ -111,7 +111,7 @@ function ArrowButton({ cursor, arrowsBaseClasses, containerStyle, prevContainerS
         className: arrowsBaseClasses.join(' '),
         onClick: () => setTimeout(nextAction, 0),
         ['aria-label']: `${isNext ? 'Next' : 'Previous'} Item`,
-        tabIndex: '-1',
+        tabIndex: '0',
         key: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',
         ['data-hook']: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',
         style: Object.assign(Object.assign({}, containerStyle), (directionIsLeft ? prevContainerStyle : nextContainerStyle)),

package/dist/cjs/components/gallery/proGallery/navigationArrows.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"navigationArrows.js","sourceRoot":"","sources":["../../../../../src/components/gallery/proGallery/navigationArrows.js"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { GALLERY_CONSTS, utils, optionsMap } from 'pro-gallery-lib';\nimport { ArrowFollower, MouseFollowerProvider } from '../../helpers/mouseCursorPosition.js';\nimport { getArrowBoxStyle, getArrowsRenderData } from '../../helpers/navigationArrowUtils.js';\n\nexport function NavigationArrows({\n options,\n hideLeftArrow,\n hideRightArrow,\n container,\n customNavArrowsRenderer,\n next,\n id,\n}) {\n const itemSpacing = options[optionsMap.layoutParams.structure.itemSpacing];\n const isRTL =\n options[optionsMap.behaviourParams.gallery.layoutDirection] ===\n GALLERY_CONSTS[optionsMap.behaviourParams.gallery.layoutDirection].RIGHT_TO_LEFT;\n const arrowsPosition = options[optionsMap.layoutParams.navigationArrows.position];\n const arrowsPadding = options[optionsMap.layoutParams.navigationArrows.padding];\n const scrollDirection = options[optionsMap.layoutParams.structure.scrollDirection];\n const mouseCursorContainerMaxWidth = options[optionsMap.layoutParams.navigationArrows.mouseCursorContainerMaxWidth];\n\n const {\n arrowRenderer: renderArrowSvg,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n } = getArrowsRenderData({\n customNavArrowsRenderer,\n arrowsColor: options[optionsMap.stylingParams.arrowsColor], //v5 TODO - get this in the nav arrows options\n arrowsSize: options[optionsMap.layoutParams.navigationArrows.size],\n arrowsType: options[optionsMap.layoutParams.navigationArrows.type],\n containerStyleType: options[optionsMap.layoutParams.navigationArrows.container.type],\n });\n const mouseCursorEnabled =\n arrowsPosition === GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.position].MOUSE_CURSOR;\n\n const { galleryHeight } = container;\n const infoHeight = options[optionsMap.layoutParams.info.height];\n const imageHeight = galleryHeight - infoHeight;\n\n // the nav arrows parent container top edge is itemSpacing/2 ABOVE the actual view, that calculates the middle point of gallery\n const galleryVerticalCenter = `50% + ${itemSpacing / 4}px`;\n\n // Determines the direction fix, the direction in which we move the nav arrows 'vertical position fix' pixels\n let directionFix;\n if (GALLERY_CONSTS.hasExternalAbovePlacement(options[optionsMap.layoutParams.info.placement])) {\n directionFix = -1;\n } else if (GALLERY_CONSTS.hasExternalBelowPlacement(options[optionsMap.layoutParams.info.placement])) {\n directionFix = 1;\n } else {\n // if we got here, we should be ITEM_CENTER, taken care of in layoutHelper.ts\n }\n const verticalPositionFix = {\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].ITEM_CENTER]: 0,\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].IMAGE_CENTER]:\n infoHeight * directionFix,\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].INFO_CENTER]:\n -imageHeight * directionFix,\n }[options[optionsMap.layoutParams.navigationArrows.verticalAlignment]];\n const arrowBoxStyle = getArrowBoxStyle({\n type: options[optionsMap.layoutParams.navigationArrows.container.type],\n backgroundColor: options[optionsMap.layoutParams.navigationArrows.container.backgroundColor],\n borderRadius: options[optionsMap.layoutParams.navigationArrows.container.borderRadius],\n });\n const containerStyle = mouseCursorEnabled\n ? {\n width: `${navArrowsContainerWidth}px`,\n height: `${navArrowsContainerHeight}px`,\n ...arrowBoxStyle,\n }\n : {\n width: `${navArrowsContainerWidth}px`,\n height: `${navArrowsContainerHeight}px`,\n padding: 0,\n top: `calc(${galleryVerticalCenter} - ${navArrowsContainerHeight / 2}px - \n ${verticalPositionFix / 2}px)`,\n ...arrowBoxStyle,\n };\n\n const arrowsPos =\n scrollDirection === GALLERY_CONSTS[optionsMap.layoutParams.structure.scrollDirection].HORIZONTAL &&\n arrowsPosition === GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.position].OUTSIDE_GALLERY\n ? `-${20 + navArrowsContainerWidth}px`\n : `${itemSpacing / 2 + (arrowsPadding ? arrowsPadding : 0)}px`;\n // itemSpacing effect the margin of the main div ('pro-gallery-parent-container') that SlideshowView is rendering, so the arrows should be places accordingly\n // arrowsPadding relevant only for arrowsPosition.ON_GALLERY\n\n const prevContainerStyle = { left: mouseCursorEnabled ? 0 : arrowsPos };\n const nextContainerStyle = { right: mouseCursorEnabled ? 0 : arrowsPos };\n\n const containerStylesByType = {\n BOX: 'box',\n SHADOW: 'shadow',\n NONE: 'only-arrows',\n };\n\n const containerStylingClass =\n containerStylesByType[options[optionsMap.layoutParams.navigationArrows.container.type]] \|\| '';\n\n const arrowsBaseClasses = [\n 'nav-arrows-container',\n containerStylingClass,\n utils.isMobile() ? ' pro-gallery-mobile-indicator' : '',\n ];\n const navigationArrowPortalId = `arrow-portal-container-${id}`;\n\n const ArrowRenderHandler = mouseCursorEnabled ? ArrowButtonWithCursorController : ArrowButton;\n const renderArrow = (directionIsLeft) => {\n return (\n <ArrowRenderHandler\n {...{\n renderArrowSvg,\n next,\n directionIsLeft,\n arrowsBaseClasses,\n containerStyle,\n prevContainerStyle,\n nextContainerStyle,\n isRTL,\n hideLeftArrow,\n hideRightArrow,\n arrowBoxStyle,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n navigationArrowPortalId,\n mouseCursorContainerMaxWidth,\n id,\n }}\n />\n );\n };\n\n const provideMouseFollower = (children) => {\n if (mouseCursorEnabled) {\n return <MouseFollowerProvider id={id}>{children}</MouseFollowerProvider>;\n }\n return children;\n };\n\n return (\n <ArrowsContainer\n hideLeftArrow={hideLeftArrow}\n hideRightArrow={hideRightArrow}\n mouseCursorEnabled={mouseCursorEnabled}\n isRTL={isRTL}\n navigationArrowPortalId={navigationArrowPortalId}\n >\n {provideMouseFollower(\n <>\n {hideLeftArrow ? null : renderArrow(true)}\n {hideRightArrow ? null : renderArrow(false)}\n </>\n )}\n </ArrowsContainer>\n );\n}\n\nexport function ArrowButton({\n cursor,\n arrowsBaseClasses,\n containerStyle,\n prevContainerStyle,\n nextContainerStyle,\n isRTL,\n directionIsLeft,\n renderArrowSvg,\n next,\n arrowBoxStyle,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n navigationArrowPortalId,\n}) {\n const isNext = (directionIsLeft && isRTL) \|\| (!directionIsLeft && !isRTL);\n const nextAction = () => next({ direction: directionIsLeft ? -1 : 1 });\n const buttonProps = {\n className: arrowsBaseClasses.join(' '),\n onClick: () => setTimeout(nextAction, 0),\n ['aria-label']: `${isNext ? 'Next' : 'Previous'} Item`,\n tabIndex: '-1',\n key: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',\n ['data-hook']: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',\n style: {\n ...containerStyle,\n ...(directionIsLeft ? prevContainerStyle : nextContainerStyle),\n },\n };\n if (cursor) {\n const { containerRef, isMouseEnter, position } = cursor;\n return (\n <button ref={(ref) => (containerRef.current = ref)} {...buttonProps}>\n {isMouseEnter &&\n ReactDOM.createPortal(\n <span\n style={{\n top: position.y - navArrowsContainerHeight / 2,\n left: position.x - navArrowsContainerWidth / 2,\n ...arrowBoxStyle,\n width: navArrowsContainerWidth,\n height: navArrowsContainerHeight,\n }}\n >\n {renderArrowSvg(directionIsLeft ? 'left' : 'right')}\n </span>,\n window.document.getElementById(navigationArrowPortalId)\n )}\n </button>\n );\n }\n return <button {...buttonProps}>{renderArrowSvg(directionIsLeft ? 'left' : 'right')}</button>;\n}\n\nexport function ArrowButtonWithCursorController(props) {\n const {\n directionIsLeft,\n next,\n mouseCursorContainerMaxWidth,\n hideLeftArrow,\n hideRightArrow,\n renderArrowSvg,\n containerStyle,\n arrowsBaseClasses,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n } = props;\n const isTheOnlyArrow = hideLeftArrow \|\| hideRightArrow;\n return (\n <ArrowFollower\n id={props.id}\n mouseCursorContainerMaxWidth={mouseCursorContainerMaxWidth}\n navArrowsContainerWidth={navArrowsContainerWidth}\n navArrowsContainerHeight={navArrowsContainerHeight}\n onNavigate={() => next({ direction: directionIsLeft ? -1 : 1 })}\n direction={directionIsLeft ? 'left' : 'right'}\n isTheOnlyArrow={isTheOnlyArrow}\n >\n {(x, y) => (\n <div\n style={{\n top: y,\n left: x,\n }}\n className=\"follow-mouse-cursor\"\n >\n <div\n className={arrowsBaseClasses.join(' ')}\n style={{\n ...containerStyle,\n top: -navArrowsContainerHeight / 2,\n left: -navArrowsContainerWidth / 2,\n }}\n >\n {renderArrowSvg(directionIsLeft ? 'left' : 'right')}\n </div>\n </div>\n )}\n </ArrowFollower>\n );\n}\n\nexport function ArrowsContainer({\n hideRightArrow,\n hideLeftArrow,\n mouseCursorEnabled,\n isRTL,\n children,\n navigationArrowPortalId,\n}) {\n if (mouseCursorEnabled) {\n const styleForMouseCursor = {\n justifyContent: hideLeftArrow ? 'flex-end' : hideRightArrow ? 'flex-start' : 'space-between',\n flexDirection: isRTL ? 'row-reverse' : 'row',\n };\n return (\n <div className=\"mouse-cursor\" style={{ ...styleForMouseCursor }}>\n <div id={navigationArrowPortalId} className=\"arrow-portal-container\" />\n {/* navigationArrowPortalId must be the first element to make sure the mouseCursor events work properly */}\n {children}\n </div>\n );\n }\n return React.Fragment ? <React.Fragment>{children}</React.Fragment> : <div>{children}</div>;\n}\n"]}
1	+ {"version":3,"file":"navigationArrows.js","sourceRoot":"","sources":["../../../../../src/components/gallery/proGallery/navigationArrows.js"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { GALLERY_CONSTS, utils, optionsMap } from 'pro-gallery-lib';\nimport { ArrowFollower, MouseFollowerProvider } from '../../helpers/mouseCursorPosition.js';\nimport { getArrowBoxStyle, getArrowsRenderData } from '../../helpers/navigationArrowUtils.js';\n\nexport function NavigationArrows({\n options,\n hideLeftArrow,\n hideRightArrow,\n container,\n customNavArrowsRenderer,\n next,\n id,\n}) {\n const itemSpacing = options[optionsMap.layoutParams.structure.itemSpacing];\n const isRTL =\n options[optionsMap.behaviourParams.gallery.layoutDirection] ===\n GALLERY_CONSTS[optionsMap.behaviourParams.gallery.layoutDirection].RIGHT_TO_LEFT;\n const arrowsPosition = options[optionsMap.layoutParams.navigationArrows.position];\n const arrowsPadding = options[optionsMap.layoutParams.navigationArrows.padding];\n const scrollDirection = options[optionsMap.layoutParams.structure.scrollDirection];\n const mouseCursorContainerMaxWidth = options[optionsMap.layoutParams.navigationArrows.mouseCursorContainerMaxWidth];\n\n const {\n arrowRenderer: renderArrowSvg,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n } = getArrowsRenderData({\n customNavArrowsRenderer,\n arrowsColor: options[optionsMap.stylingParams.arrowsColor], //v5 TODO - get this in the nav arrows options\n arrowsSize: options[optionsMap.layoutParams.navigationArrows.size],\n arrowsType: options[optionsMap.layoutParams.navigationArrows.type],\n containerStyleType: options[optionsMap.layoutParams.navigationArrows.container.type],\n });\n const mouseCursorEnabled =\n arrowsPosition === GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.position].MOUSE_CURSOR;\n\n const { galleryHeight } = container;\n const infoHeight = options[optionsMap.layoutParams.info.height];\n const imageHeight = galleryHeight - infoHeight;\n\n // the nav arrows parent container top edge is itemSpacing/2 ABOVE the actual view, that calculates the middle point of gallery\n const galleryVerticalCenter = `50% + ${itemSpacing / 4}px`;\n\n // Determines the direction fix, the direction in which we move the nav arrows 'vertical position fix' pixels\n let directionFix;\n if (GALLERY_CONSTS.hasExternalAbovePlacement(options[optionsMap.layoutParams.info.placement])) {\n directionFix = -1;\n } else if (GALLERY_CONSTS.hasExternalBelowPlacement(options[optionsMap.layoutParams.info.placement])) {\n directionFix = 1;\n } else {\n // if we got here, we should be ITEM_CENTER, taken care of in layoutHelper.ts\n }\n const verticalPositionFix = {\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].ITEM_CENTER]: 0,\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].IMAGE_CENTER]:\n infoHeight * directionFix,\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].INFO_CENTER]:\n -imageHeight * directionFix,\n }[options[optionsMap.layoutParams.navigationArrows.verticalAlignment]];\n const arrowBoxStyle = getArrowBoxStyle({\n type: options[optionsMap.layoutParams.navigationArrows.container.type],\n backgroundColor: options[optionsMap.layoutParams.navigationArrows.container.backgroundColor],\n borderRadius: options[optionsMap.layoutParams.navigationArrows.container.borderRadius],\n });\n const containerStyle = mouseCursorEnabled\n ? {\n width: `${navArrowsContainerWidth}px`,\n height: `${navArrowsContainerHeight}px`,\n ...arrowBoxStyle,\n }\n : {\n width: `${navArrowsContainerWidth}px`,\n height: `${navArrowsContainerHeight}px`,\n padding: 0,\n top: `calc(${galleryVerticalCenter} - ${navArrowsContainerHeight / 2}px - \n ${verticalPositionFix / 2}px)`,\n ...arrowBoxStyle,\n };\n\n const arrowsPos =\n scrollDirection === GALLERY_CONSTS[optionsMap.layoutParams.structure.scrollDirection].HORIZONTAL &&\n arrowsPosition === GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.position].OUTSIDE_GALLERY\n ? `-${20 + navArrowsContainerWidth}px`\n : `${itemSpacing / 2 + (arrowsPadding ? arrowsPadding : 0)}px`;\n // itemSpacing effect the margin of the main div ('pro-gallery-parent-container') that SlideshowView is rendering, so the arrows should be places accordingly\n // arrowsPadding relevant only for arrowsPosition.ON_GALLERY\n\n const prevContainerStyle = { left: mouseCursorEnabled ? 0 : arrowsPos };\n const nextContainerStyle = { right: mouseCursorEnabled ? 0 : arrowsPos };\n\n const containerStylesByType = {\n BOX: 'box',\n SHADOW: 'shadow',\n NONE: 'only-arrows',\n };\n\n const containerStylingClass =\n containerStylesByType[options[optionsMap.layoutParams.navigationArrows.container.type]] \|\| '';\n\n const arrowsBaseClasses = [\n 'nav-arrows-container',\n containerStylingClass,\n utils.isMobile() ? ' pro-gallery-mobile-indicator' : '',\n ];\n const navigationArrowPortalId = `arrow-portal-container-${id}`;\n\n const ArrowRenderHandler = mouseCursorEnabled ? ArrowButtonWithCursorController : ArrowButton;\n const renderArrow = (directionIsLeft) => {\n return (\n <ArrowRenderHandler\n {...{\n renderArrowSvg,\n next,\n directionIsLeft,\n arrowsBaseClasses,\n containerStyle,\n prevContainerStyle,\n nextContainerStyle,\n isRTL,\n hideLeftArrow,\n hideRightArrow,\n arrowBoxStyle,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n navigationArrowPortalId,\n mouseCursorContainerMaxWidth,\n id,\n }}\n />\n );\n };\n\n const provideMouseFollower = (children) => {\n if (mouseCursorEnabled) {\n return <MouseFollowerProvider id={id}>{children}</MouseFollowerProvider>;\n }\n return children;\n };\n\n return (\n <ArrowsContainer\n hideLeftArrow={hideLeftArrow}\n hideRightArrow={hideRightArrow}\n mouseCursorEnabled={mouseCursorEnabled}\n isRTL={isRTL}\n navigationArrowPortalId={navigationArrowPortalId}\n >\n {provideMouseFollower(\n <>\n {hideLeftArrow ? null : renderArrow(true)}\n {hideRightArrow ? null : renderArrow(false)}\n </>\n )}\n </ArrowsContainer>\n );\n}\n\nexport function ArrowButton({\n cursor,\n arrowsBaseClasses,\n containerStyle,\n prevContainerStyle,\n nextContainerStyle,\n isRTL,\n directionIsLeft,\n renderArrowSvg,\n next,\n arrowBoxStyle,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n navigationArrowPortalId,\n}) {\n const isNext = (directionIsLeft && isRTL) \|\| (!directionIsLeft && !isRTL);\n const nextAction = () => next({ direction: directionIsLeft ? -1 : 1 });\n const buttonProps = {\n className: arrowsBaseClasses.join(' '),\n onClick: () => setTimeout(nextAction, 0),\n ['aria-label']: `${isNext ? 'Next' : 'Previous'} Item`,\n tabIndex: '0',\n key: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',\n ['data-hook']: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',\n style: {\n ...containerStyle,\n ...(directionIsLeft ? prevContainerStyle : nextContainerStyle),\n },\n };\n if (cursor) {\n const { containerRef, isMouseEnter, position } = cursor;\n return (\n <button ref={(ref) => (containerRef.current = ref)} {...buttonProps}>\n {isMouseEnter &&\n ReactDOM.createPortal(\n <span\n style={{\n top: position.y - navArrowsContainerHeight / 2,\n left: position.x - navArrowsContainerWidth / 2,\n ...arrowBoxStyle,\n width: navArrowsContainerWidth,\n height: navArrowsContainerHeight,\n }}\n >\n {renderArrowSvg(directionIsLeft ? 'left' : 'right')}\n </span>,\n window.document.getElementById(navigationArrowPortalId)\n )}\n </button>\n );\n }\n return <button {...buttonProps}>{renderArrowSvg(directionIsLeft ? 'left' : 'right')}</button>;\n}\n\nexport function ArrowButtonWithCursorController(props) {\n const {\n directionIsLeft,\n next,\n mouseCursorContainerMaxWidth,\n hideLeftArrow,\n hideRightArrow,\n renderArrowSvg,\n containerStyle,\n arrowsBaseClasses,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n } = props;\n const isTheOnlyArrow = hideLeftArrow \|\| hideRightArrow;\n return (\n <ArrowFollower\n id={props.id}\n mouseCursorContainerMaxWidth={mouseCursorContainerMaxWidth}\n navArrowsContainerWidth={navArrowsContainerWidth}\n navArrowsContainerHeight={navArrowsContainerHeight}\n onNavigate={() => next({ direction: directionIsLeft ? -1 : 1 })}\n direction={directionIsLeft ? 'left' : 'right'}\n isTheOnlyArrow={isTheOnlyArrow}\n >\n {(x, y) => (\n <div\n style={{\n top: y,\n left: x,\n }}\n className=\"follow-mouse-cursor\"\n >\n <div\n className={arrowsBaseClasses.join(' ')}\n style={{\n ...containerStyle,\n top: -navArrowsContainerHeight / 2,\n left: -navArrowsContainerWidth / 2,\n }}\n >\n {renderArrowSvg(directionIsLeft ? 'left' : 'right')}\n </div>\n </div>\n )}\n </ArrowFollower>\n );\n}\n\nexport function ArrowsContainer({\n hideRightArrow,\n hideLeftArrow,\n mouseCursorEnabled,\n isRTL,\n children,\n navigationArrowPortalId,\n}) {\n if (mouseCursorEnabled) {\n const styleForMouseCursor = {\n justifyContent: hideLeftArrow ? 'flex-end' : hideRightArrow ? 'flex-start' : 'space-between',\n flexDirection: isRTL ? 'row-reverse' : 'row',\n };\n return (\n <div className=\"mouse-cursor\" style={{ ...styleForMouseCursor }}>\n <div id={navigationArrowPortalId} className=\"arrow-portal-container\" />\n {/* navigationArrowPortalId must be the first element to make sure the mouseCursor events work properly */}\n {children}\n </div>\n );\n }\n return React.Fragment ? <React.Fragment>{children}</React.Fragment> : <div>{children}</div>;\n}\n"]}

package/dist/esm/components/gallery/proGallery/navigationArrows.js CHANGED Viewed

@@ -106,7 +106,7 @@ export function ArrowButton({ cursor, arrowsBaseClasses, containerStyle, prevCon
         className: arrowsBaseClasses.join(' '),
         onClick: () => setTimeout(nextAction, 0),
         ['aria-label']: `${isNext ? 'Next' : 'Previous'} Item`,
-        tabIndex: '-1',
+        tabIndex: '0',
         key: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',
         ['data-hook']: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',
         style: Object.assign(Object.assign({}, containerStyle), (directionIsLeft ? prevContainerStyle : nextContainerStyle)),

package/dist/esm/components/gallery/proGallery/navigationArrows.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"navigationArrows.js","sourceRoot":"","sources":["../../../../../src/components/gallery/proGallery/navigationArrows.js"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { GALLERY_CONSTS, utils, optionsMap } from 'pro-gallery-lib';\nimport { ArrowFollower, MouseFollowerProvider } from '../../helpers/mouseCursorPosition.js';\nimport { getArrowBoxStyle, getArrowsRenderData } from '../../helpers/navigationArrowUtils.js';\n\nexport function NavigationArrows({\n options,\n hideLeftArrow,\n hideRightArrow,\n container,\n customNavArrowsRenderer,\n next,\n id,\n}) {\n const itemSpacing = options[optionsMap.layoutParams.structure.itemSpacing];\n const isRTL =\n options[optionsMap.behaviourParams.gallery.layoutDirection] ===\n GALLERY_CONSTS[optionsMap.behaviourParams.gallery.layoutDirection].RIGHT_TO_LEFT;\n const arrowsPosition = options[optionsMap.layoutParams.navigationArrows.position];\n const arrowsPadding = options[optionsMap.layoutParams.navigationArrows.padding];\n const scrollDirection = options[optionsMap.layoutParams.structure.scrollDirection];\n const mouseCursorContainerMaxWidth = options[optionsMap.layoutParams.navigationArrows.mouseCursorContainerMaxWidth];\n\n const {\n arrowRenderer: renderArrowSvg,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n } = getArrowsRenderData({\n customNavArrowsRenderer,\n arrowsColor: options[optionsMap.stylingParams.arrowsColor], //v5 TODO - get this in the nav arrows options\n arrowsSize: options[optionsMap.layoutParams.navigationArrows.size],\n arrowsType: options[optionsMap.layoutParams.navigationArrows.type],\n containerStyleType: options[optionsMap.layoutParams.navigationArrows.container.type],\n });\n const mouseCursorEnabled =\n arrowsPosition === GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.position].MOUSE_CURSOR;\n\n const { galleryHeight } = container;\n const infoHeight = options[optionsMap.layoutParams.info.height];\n const imageHeight = galleryHeight - infoHeight;\n\n // the nav arrows parent container top edge is itemSpacing/2 ABOVE the actual view, that calculates the middle point of gallery\n const galleryVerticalCenter = `50% + ${itemSpacing / 4}px`;\n\n // Determines the direction fix, the direction in which we move the nav arrows 'vertical position fix' pixels\n let directionFix;\n if (GALLERY_CONSTS.hasExternalAbovePlacement(options[optionsMap.layoutParams.info.placement])) {\n directionFix = -1;\n } else if (GALLERY_CONSTS.hasExternalBelowPlacement(options[optionsMap.layoutParams.info.placement])) {\n directionFix = 1;\n } else {\n // if we got here, we should be ITEM_CENTER, taken care of in layoutHelper.ts\n }\n const verticalPositionFix = {\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].ITEM_CENTER]: 0,\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].IMAGE_CENTER]:\n infoHeight * directionFix,\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].INFO_CENTER]:\n -imageHeight * directionFix,\n }[options[optionsMap.layoutParams.navigationArrows.verticalAlignment]];\n const arrowBoxStyle = getArrowBoxStyle({\n type: options[optionsMap.layoutParams.navigationArrows.container.type],\n backgroundColor: options[optionsMap.layoutParams.navigationArrows.container.backgroundColor],\n borderRadius: options[optionsMap.layoutParams.navigationArrows.container.borderRadius],\n });\n const containerStyle = mouseCursorEnabled\n ? {\n width: `${navArrowsContainerWidth}px`,\n height: `${navArrowsContainerHeight}px`,\n ...arrowBoxStyle,\n }\n : {\n width: `${navArrowsContainerWidth}px`,\n height: `${navArrowsContainerHeight}px`,\n padding: 0,\n top: `calc(${galleryVerticalCenter} - ${navArrowsContainerHeight / 2}px - \n ${verticalPositionFix / 2}px)`,\n ...arrowBoxStyle,\n };\n\n const arrowsPos =\n scrollDirection === GALLERY_CONSTS[optionsMap.layoutParams.structure.scrollDirection].HORIZONTAL &&\n arrowsPosition === GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.position].OUTSIDE_GALLERY\n ? `-${20 + navArrowsContainerWidth}px`\n : `${itemSpacing / 2 + (arrowsPadding ? arrowsPadding : 0)}px`;\n // itemSpacing effect the margin of the main div ('pro-gallery-parent-container') that SlideshowView is rendering, so the arrows should be places accordingly\n // arrowsPadding relevant only for arrowsPosition.ON_GALLERY\n\n const prevContainerStyle = { left: mouseCursorEnabled ? 0 : arrowsPos };\n const nextContainerStyle = { right: mouseCursorEnabled ? 0 : arrowsPos };\n\n const containerStylesByType = {\n BOX: 'box',\n SHADOW: 'shadow',\n NONE: 'only-arrows',\n };\n\n const containerStylingClass =\n containerStylesByType[options[optionsMap.layoutParams.navigationArrows.container.type]] \|\| '';\n\n const arrowsBaseClasses = [\n 'nav-arrows-container',\n containerStylingClass,\n utils.isMobile() ? ' pro-gallery-mobile-indicator' : '',\n ];\n const navigationArrowPortalId = `arrow-portal-container-${id}`;\n\n const ArrowRenderHandler = mouseCursorEnabled ? ArrowButtonWithCursorController : ArrowButton;\n const renderArrow = (directionIsLeft) => {\n return (\n <ArrowRenderHandler\n {...{\n renderArrowSvg,\n next,\n directionIsLeft,\n arrowsBaseClasses,\n containerStyle,\n prevContainerStyle,\n nextContainerStyle,\n isRTL,\n hideLeftArrow,\n hideRightArrow,\n arrowBoxStyle,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n navigationArrowPortalId,\n mouseCursorContainerMaxWidth,\n id,\n }}\n />\n );\n };\n\n const provideMouseFollower = (children) => {\n if (mouseCursorEnabled) {\n return <MouseFollowerProvider id={id}>{children}</MouseFollowerProvider>;\n }\n return children;\n };\n\n return (\n <ArrowsContainer\n hideLeftArrow={hideLeftArrow}\n hideRightArrow={hideRightArrow}\n mouseCursorEnabled={mouseCursorEnabled}\n isRTL={isRTL}\n navigationArrowPortalId={navigationArrowPortalId}\n >\n {provideMouseFollower(\n <>\n {hideLeftArrow ? null : renderArrow(true)}\n {hideRightArrow ? null : renderArrow(false)}\n </>\n )}\n </ArrowsContainer>\n );\n}\n\nexport function ArrowButton({\n cursor,\n arrowsBaseClasses,\n containerStyle,\n prevContainerStyle,\n nextContainerStyle,\n isRTL,\n directionIsLeft,\n renderArrowSvg,\n next,\n arrowBoxStyle,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n navigationArrowPortalId,\n}) {\n const isNext = (directionIsLeft && isRTL) \|\| (!directionIsLeft && !isRTL);\n const nextAction = () => next({ direction: directionIsLeft ? -1 : 1 });\n const buttonProps = {\n className: arrowsBaseClasses.join(' '),\n onClick: () => setTimeout(nextAction, 0),\n ['aria-label']: `${isNext ? 'Next' : 'Previous'} Item`,\n tabIndex: '-1',\n key: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',\n ['data-hook']: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',\n style: {\n ...containerStyle,\n ...(directionIsLeft ? prevContainerStyle : nextContainerStyle),\n },\n };\n if (cursor) {\n const { containerRef, isMouseEnter, position } = cursor;\n return (\n <button ref={(ref) => (containerRef.current = ref)} {...buttonProps}>\n {isMouseEnter &&\n ReactDOM.createPortal(\n <span\n style={{\n top: position.y - navArrowsContainerHeight / 2,\n left: position.x - navArrowsContainerWidth / 2,\n ...arrowBoxStyle,\n width: navArrowsContainerWidth,\n height: navArrowsContainerHeight,\n }}\n >\n {renderArrowSvg(directionIsLeft ? 'left' : 'right')}\n </span>,\n window.document.getElementById(navigationArrowPortalId)\n )}\n </button>\n );\n }\n return <button {...buttonProps}>{renderArrowSvg(directionIsLeft ? 'left' : 'right')}</button>;\n}\n\nexport function ArrowButtonWithCursorController(props) {\n const {\n directionIsLeft,\n next,\n mouseCursorContainerMaxWidth,\n hideLeftArrow,\n hideRightArrow,\n renderArrowSvg,\n containerStyle,\n arrowsBaseClasses,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n } = props;\n const isTheOnlyArrow = hideLeftArrow \|\| hideRightArrow;\n return (\n <ArrowFollower\n id={props.id}\n mouseCursorContainerMaxWidth={mouseCursorContainerMaxWidth}\n navArrowsContainerWidth={navArrowsContainerWidth}\n navArrowsContainerHeight={navArrowsContainerHeight}\n onNavigate={() => next({ direction: directionIsLeft ? -1 : 1 })}\n direction={directionIsLeft ? 'left' : 'right'}\n isTheOnlyArrow={isTheOnlyArrow}\n >\n {(x, y) => (\n <div\n style={{\n top: y,\n left: x,\n }}\n className=\"follow-mouse-cursor\"\n >\n <div\n className={arrowsBaseClasses.join(' ')}\n style={{\n ...containerStyle,\n top: -navArrowsContainerHeight / 2,\n left: -navArrowsContainerWidth / 2,\n }}\n >\n {renderArrowSvg(directionIsLeft ? 'left' : 'right')}\n </div>\n </div>\n )}\n </ArrowFollower>\n );\n}\n\nexport function ArrowsContainer({\n hideRightArrow,\n hideLeftArrow,\n mouseCursorEnabled,\n isRTL,\n children,\n navigationArrowPortalId,\n}) {\n if (mouseCursorEnabled) {\n const styleForMouseCursor = {\n justifyContent: hideLeftArrow ? 'flex-end' : hideRightArrow ? 'flex-start' : 'space-between',\n flexDirection: isRTL ? 'row-reverse' : 'row',\n };\n return (\n <div className=\"mouse-cursor\" style={{ ...styleForMouseCursor }}>\n <div id={navigationArrowPortalId} className=\"arrow-portal-container\" />\n {/* navigationArrowPortalId must be the first element to make sure the mouseCursor events work properly */}\n {children}\n </div>\n );\n }\n return React.Fragment ? <React.Fragment>{children}</React.Fragment> : <div>{children}</div>;\n}\n"]}
1	+ {"version":3,"file":"navigationArrows.js","sourceRoot":"","sources":["../../../../../src/components/gallery/proGallery/navigationArrows.js"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { GALLERY_CONSTS, utils, optionsMap } from 'pro-gallery-lib';\nimport { ArrowFollower, MouseFollowerProvider } from '../../helpers/mouseCursorPosition.js';\nimport { getArrowBoxStyle, getArrowsRenderData } from '../../helpers/navigationArrowUtils.js';\n\nexport function NavigationArrows({\n options,\n hideLeftArrow,\n hideRightArrow,\n container,\n customNavArrowsRenderer,\n next,\n id,\n}) {\n const itemSpacing = options[optionsMap.layoutParams.structure.itemSpacing];\n const isRTL =\n options[optionsMap.behaviourParams.gallery.layoutDirection] ===\n GALLERY_CONSTS[optionsMap.behaviourParams.gallery.layoutDirection].RIGHT_TO_LEFT;\n const arrowsPosition = options[optionsMap.layoutParams.navigationArrows.position];\n const arrowsPadding = options[optionsMap.layoutParams.navigationArrows.padding];\n const scrollDirection = options[optionsMap.layoutParams.structure.scrollDirection];\n const mouseCursorContainerMaxWidth = options[optionsMap.layoutParams.navigationArrows.mouseCursorContainerMaxWidth];\n\n const {\n arrowRenderer: renderArrowSvg,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n } = getArrowsRenderData({\n customNavArrowsRenderer,\n arrowsColor: options[optionsMap.stylingParams.arrowsColor], //v5 TODO - get this in the nav arrows options\n arrowsSize: options[optionsMap.layoutParams.navigationArrows.size],\n arrowsType: options[optionsMap.layoutParams.navigationArrows.type],\n containerStyleType: options[optionsMap.layoutParams.navigationArrows.container.type],\n });\n const mouseCursorEnabled =\n arrowsPosition === GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.position].MOUSE_CURSOR;\n\n const { galleryHeight } = container;\n const infoHeight = options[optionsMap.layoutParams.info.height];\n const imageHeight = galleryHeight - infoHeight;\n\n // the nav arrows parent container top edge is itemSpacing/2 ABOVE the actual view, that calculates the middle point of gallery\n const galleryVerticalCenter = `50% + ${itemSpacing / 4}px`;\n\n // Determines the direction fix, the direction in which we move the nav arrows 'vertical position fix' pixels\n let directionFix;\n if (GALLERY_CONSTS.hasExternalAbovePlacement(options[optionsMap.layoutParams.info.placement])) {\n directionFix = -1;\n } else if (GALLERY_CONSTS.hasExternalBelowPlacement(options[optionsMap.layoutParams.info.placement])) {\n directionFix = 1;\n } else {\n // if we got here, we should be ITEM_CENTER, taken care of in layoutHelper.ts\n }\n const verticalPositionFix = {\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].ITEM_CENTER]: 0,\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].IMAGE_CENTER]:\n infoHeight * directionFix,\n [GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.verticalAlignment].INFO_CENTER]:\n -imageHeight * directionFix,\n }[options[optionsMap.layoutParams.navigationArrows.verticalAlignment]];\n const arrowBoxStyle = getArrowBoxStyle({\n type: options[optionsMap.layoutParams.navigationArrows.container.type],\n backgroundColor: options[optionsMap.layoutParams.navigationArrows.container.backgroundColor],\n borderRadius: options[optionsMap.layoutParams.navigationArrows.container.borderRadius],\n });\n const containerStyle = mouseCursorEnabled\n ? {\n width: `${navArrowsContainerWidth}px`,\n height: `${navArrowsContainerHeight}px`,\n ...arrowBoxStyle,\n }\n : {\n width: `${navArrowsContainerWidth}px`,\n height: `${navArrowsContainerHeight}px`,\n padding: 0,\n top: `calc(${galleryVerticalCenter} - ${navArrowsContainerHeight / 2}px - \n ${verticalPositionFix / 2}px)`,\n ...arrowBoxStyle,\n };\n\n const arrowsPos =\n scrollDirection === GALLERY_CONSTS[optionsMap.layoutParams.structure.scrollDirection].HORIZONTAL &&\n arrowsPosition === GALLERY_CONSTS[optionsMap.layoutParams.navigationArrows.position].OUTSIDE_GALLERY\n ? `-${20 + navArrowsContainerWidth}px`\n : `${itemSpacing / 2 + (arrowsPadding ? arrowsPadding : 0)}px`;\n // itemSpacing effect the margin of the main div ('pro-gallery-parent-container') that SlideshowView is rendering, so the arrows should be places accordingly\n // arrowsPadding relevant only for arrowsPosition.ON_GALLERY\n\n const prevContainerStyle = { left: mouseCursorEnabled ? 0 : arrowsPos };\n const nextContainerStyle = { right: mouseCursorEnabled ? 0 : arrowsPos };\n\n const containerStylesByType = {\n BOX: 'box',\n SHADOW: 'shadow',\n NONE: 'only-arrows',\n };\n\n const containerStylingClass =\n containerStylesByType[options[optionsMap.layoutParams.navigationArrows.container.type]] \|\| '';\n\n const arrowsBaseClasses = [\n 'nav-arrows-container',\n containerStylingClass,\n utils.isMobile() ? ' pro-gallery-mobile-indicator' : '',\n ];\n const navigationArrowPortalId = `arrow-portal-container-${id}`;\n\n const ArrowRenderHandler = mouseCursorEnabled ? ArrowButtonWithCursorController : ArrowButton;\n const renderArrow = (directionIsLeft) => {\n return (\n <ArrowRenderHandler\n {...{\n renderArrowSvg,\n next,\n directionIsLeft,\n arrowsBaseClasses,\n containerStyle,\n prevContainerStyle,\n nextContainerStyle,\n isRTL,\n hideLeftArrow,\n hideRightArrow,\n arrowBoxStyle,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n navigationArrowPortalId,\n mouseCursorContainerMaxWidth,\n id,\n }}\n />\n );\n };\n\n const provideMouseFollower = (children) => {\n if (mouseCursorEnabled) {\n return <MouseFollowerProvider id={id}>{children}</MouseFollowerProvider>;\n }\n return children;\n };\n\n return (\n <ArrowsContainer\n hideLeftArrow={hideLeftArrow}\n hideRightArrow={hideRightArrow}\n mouseCursorEnabled={mouseCursorEnabled}\n isRTL={isRTL}\n navigationArrowPortalId={navigationArrowPortalId}\n >\n {provideMouseFollower(\n <>\n {hideLeftArrow ? null : renderArrow(true)}\n {hideRightArrow ? null : renderArrow(false)}\n </>\n )}\n </ArrowsContainer>\n );\n}\n\nexport function ArrowButton({\n cursor,\n arrowsBaseClasses,\n containerStyle,\n prevContainerStyle,\n nextContainerStyle,\n isRTL,\n directionIsLeft,\n renderArrowSvg,\n next,\n arrowBoxStyle,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n navigationArrowPortalId,\n}) {\n const isNext = (directionIsLeft && isRTL) \|\| (!directionIsLeft && !isRTL);\n const nextAction = () => next({ direction: directionIsLeft ? -1 : 1 });\n const buttonProps = {\n className: arrowsBaseClasses.join(' '),\n onClick: () => setTimeout(nextAction, 0),\n ['aria-label']: `${isNext ? 'Next' : 'Previous'} Item`,\n tabIndex: '0',\n key: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',\n ['data-hook']: !isNext ? 'nav-arrow-back' : 'nav-arrow-next',\n style: {\n ...containerStyle,\n ...(directionIsLeft ? prevContainerStyle : nextContainerStyle),\n },\n };\n if (cursor) {\n const { containerRef, isMouseEnter, position } = cursor;\n return (\n <button ref={(ref) => (containerRef.current = ref)} {...buttonProps}>\n {isMouseEnter &&\n ReactDOM.createPortal(\n <span\n style={{\n top: position.y - navArrowsContainerHeight / 2,\n left: position.x - navArrowsContainerWidth / 2,\n ...arrowBoxStyle,\n width: navArrowsContainerWidth,\n height: navArrowsContainerHeight,\n }}\n >\n {renderArrowSvg(directionIsLeft ? 'left' : 'right')}\n </span>,\n window.document.getElementById(navigationArrowPortalId)\n )}\n </button>\n );\n }\n return <button {...buttonProps}>{renderArrowSvg(directionIsLeft ? 'left' : 'right')}</button>;\n}\n\nexport function ArrowButtonWithCursorController(props) {\n const {\n directionIsLeft,\n next,\n mouseCursorContainerMaxWidth,\n hideLeftArrow,\n hideRightArrow,\n renderArrowSvg,\n containerStyle,\n arrowsBaseClasses,\n navArrowsContainerWidth,\n navArrowsContainerHeight,\n } = props;\n const isTheOnlyArrow = hideLeftArrow \|\| hideRightArrow;\n return (\n <ArrowFollower\n id={props.id}\n mouseCursorContainerMaxWidth={mouseCursorContainerMaxWidth}\n navArrowsContainerWidth={navArrowsContainerWidth}\n navArrowsContainerHeight={navArrowsContainerHeight}\n onNavigate={() => next({ direction: directionIsLeft ? -1 : 1 })}\n direction={directionIsLeft ? 'left' : 'right'}\n isTheOnlyArrow={isTheOnlyArrow}\n >\n {(x, y) => (\n <div\n style={{\n top: y,\n left: x,\n }}\n className=\"follow-mouse-cursor\"\n >\n <div\n className={arrowsBaseClasses.join(' ')}\n style={{\n ...containerStyle,\n top: -navArrowsContainerHeight / 2,\n left: -navArrowsContainerWidth / 2,\n }}\n >\n {renderArrowSvg(directionIsLeft ? 'left' : 'right')}\n </div>\n </div>\n )}\n </ArrowFollower>\n );\n}\n\nexport function ArrowsContainer({\n hideRightArrow,\n hideLeftArrow,\n mouseCursorEnabled,\n isRTL,\n children,\n navigationArrowPortalId,\n}) {\n if (mouseCursorEnabled) {\n const styleForMouseCursor = {\n justifyContent: hideLeftArrow ? 'flex-end' : hideRightArrow ? 'flex-start' : 'space-between',\n flexDirection: isRTL ? 'row-reverse' : 'row',\n };\n return (\n <div className=\"mouse-cursor\" style={{ ...styleForMouseCursor }}>\n <div id={navigationArrowPortalId} className=\"arrow-portal-container\" />\n {/* navigationArrowPortalId must be the first element to make sure the mouseCursor events work properly */}\n {children}\n </div>\n );\n }\n return React.Fragment ? <React.Fragment>{children}</React.Fragment> : <div>{children}</div>;\n}\n"]}

package/dist/statics/main.css CHANGED Viewed

@@ -439,7 +439,6 @@ body.pro-gallery {
   align-items: center;
   background: transparent;
   border: none;
-  outline: none;
   justify-content: center;
 }
 .nav-arrows-container:hover {
@@ -451,6 +450,9 @@ body.pro-gallery {
 .nav-arrows-container .slideshow-arrow {
   flex-shrink: 0;
 }
+.nav-arrows-container:focus {
+  box-shadow: inset 0 0 0 1px #fff, inset 0 0 1px 4px #116dff !important;
+}
 .arrow-portal-container span {
   animation: fadeIn 0.1s ease-in-out;

package/dist/statics/main.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sourceRoot":"","sources":["../../src/components/styles/_hoverEffects.scss","../../src/components/styles/consts.scss","../../src/components/styles/animations.scss","../../src/components/styles/gallery.scss"],"names":[],"mappings":"AAUK;EACC;;AAMI;EACE;;AAQN;EACE;;AAIA;EACE;;AAEF;EACE;;AAEF;EACE;;AAQJ;EACE;;AAIA;EACE;;AAMJ;EACE;;AAME;EACE;;AAON;EACE;;AAKA;EACE;;AAKN;EACE;EACA;;AAEA;EAEE;;AAEA;EACE;;AAMJ;EACE;;AAKA;EACE;;AAMJ;EACE;EACA;;AAKA;EACE;;AAMJ;EACE;EACA;;AAKA;EACE;;AA0BN;EACE;;AAEA;EACE;;AAGF;EACE;;AAKJ;EAGE;;AAEA;EACE;EACA,YClBU;;ADqBZ;AAAA;AAAA;EAEE;;AAQF;EACE;;AAEA;EACE;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAOJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAOJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAgCN;EACE;;AAEA;EACE;EACA,YC1NU;;AD6NZ;EACE;;AAGF;AAAA;EAEE;;AAKJ;EAGE;;AAEA;EACE;;AAGF;AAAA;AAAA;EAEE;;AAQF;EACE;;AAEA;EACE;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAOJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;;AEnjBV;EACI;;;AAIF;EACE;;AAGF;EACE;;;ACNJ;AAAA;EAEE;;;AAGF;EACE;EACA;;;AAGF;EAEE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;AAEA;EACE,OFmIY;EElIZ;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA,aF0E2B;EEzE3B;EACA,OF6GW;EE5GX;EACA;;AAEA;EACE;;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA,OFgFS;;;AE7EX;EACE,OF2EI;EE1EJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAGF;EACE;;AAEF;EACE;;;AAKF;EACA;EACA;EACA;EACA;EACA;EACA;;;AAKA;AAAA;EAEE;;AAGF;AAAA;AAAA;EAGE;;AAIA;EACE;EACA;;AAKF;EACE;IACE;IACA;;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAUA;EACE;;;AAWF;EACE;;;AAWF;EACE;;;AAOV;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,aFnK2B;EEoK3B;;AAGE;EACE,YF5IO;;AE+IT;EACE,YFvHM;;AE0HR;EACE,YF5HI;;AEiIV;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,aFrM2B;EEsM3B;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AAIF;EACE;;AAEA;EACE;EACA;;AAKN;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAGE;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEF;EACE;EACA;;AAKN;EAEE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;AACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAUE;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EAEA;;AAEA;EACE;;AAGF;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;AAKA;EACE;EACA;;AAIF;EACE;;AAGJ;EACE;;AAGJ;EACE;EACA;;AAEA;EACE;EACA;;AAGA;EACE;EACA;EACA;;AAQF;AAAA;AAAA;AAAA;EAEE;;AAIJ;AAAA;AAAA;AAAA;EAEE;EACA;AACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YF9WF;EE+WE,OFzYJ;EE0YI;EACA;;AAEA;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;EACE;EACA;;AAOR;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AACA;EACE;;AAIA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAON;EACE;EACA;;AAOA;AAAA;EAEE;;AAIJ;AAAA;EAEE;EACA;AACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YFheI;EEieJ,OF3fE;EE4fF;EACA;;AAEA;AAAA;EACE;;AAGF;AAAA;EACE;EACA;;AAIN;EAEE;EACA;;AAEA;EACE;EACA;EAEA;;AAEA;EACE;EACA;;AAKF;EACE;;AAEA;EACE;;AAMN;EACE;EACA;;AAIJ;EACE;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKR;EACE;IACE;;;AAIJ;EACE;;AAOE;AAAA;EACE;;AAKF;EACE;;AAQA;AAAA;EACE;;AAMN;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;;AAEA;AAAA;EAEE;EACA;;AAIJ;EACE;;AAEF;EACE;;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE;EACA,YFprBM;EEqrBN;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;;;AAGF;EACE;IACE;;EAGF;IACE;;EAGF;IACE;;;AAmBF;EAdA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAUE;EAlBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAgBF;EACI;;;AAIF;EACI","file":"main.css","sourcesContent":["@import 'consts.scss';\n\ndiv.pro-gallery {\n //common\n .gallery-item-container {\n //===================================================================\n //image hover animations\n\n &.main-color-on-hover:not(.hide-hover) {\n\n .gallery-item-content .gallery-item {\n transition: opacity .4s ease !important;\n }\n\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n .gallery-item {\n opacity: 0;\n }\n }\n }\n }\n\n &.zoom-in-on-hover:not(.hide-hover) {\n\n .gallery-item-hover:not(.hide-hover), .gallery-item-content, .hover-info-element {\n transition: transform 2.2s cubic-bezier(.14, .4, .09, .99) !important;\n }\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n transform: scale(1.1);\n }\n .gallery-item-hover:not(.hide-hover) {\n transform: scale(1.110); //make sure overlay cover all edges of an image.\n }\n .gallery-item-hover:not(.hide-hover) .hover-info-element {\n transform: scale(calc(1/1.110));\n }\n\n }\n }\n\n &.tilt-on-hover:not(.hide-hover) {\n\n .gallery-item-hover:not(.hide-hover), .gallery-item-content, .hover-info-element {\n transition: transform 1.2s cubic-bezier(.14, .4, .09, .99) !important;\n }\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n transform: scale(0.845) rotate(calc(var(--tiltAngleValue) * 1deg));\n }\n }\n }\n\n &.blur-on-hover:not(.hide-hover) {\n .gallery-item-content {\n transition: filter .4s linear !important;\n }\n\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n .gallery-item {\n filter: blur(6px);\n }\n }\n }\n }\n\n &.grayscale-on-hover:not(.hide-hover) {\n .gallery-item-content {\n transition: filter .6s ease !important;\n }\n\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n filter: grayscale(1);\n }\n }\n }\n\n &.shrink-on-hover:not(.hide-hover) {\n transition: background-color .4s ease !important;\n transition: transform .4s ease !important;\n\n &.simulate-hover,\n &:hover {\n transform: scale(0.985);\n\n div {\n transform: none !important;\n }\n }\n }\n\n &.invert-on-hover:not(.hide-hover) {\n .gallery-item-content {\n transition: filter .6s ease !important;\n }\n\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n filter: invert(1);\n }\n }\n }\n\n &.color-in-on-hover {\n .gallery-item-content {\n filter: grayscale(1);\n transition: filter .6s ease !important;\n }\n\n &.simulate-hover:not(.hide-hover),\n &:hover:not(.hide-hover) {\n .gallery-item-content {\n filter: grayscale(0);\n }\n }\n }\n\n &.darkened-on-hover {\n .gallery-item-content {\n filter: brightness(1);\n transition: filter .6s ease !important;\n }\n\n &.simulate-hover:not(.hide-hover),\n &:hover:not(.hide-hover) {\n .gallery-item-content {\n filter: brightness(0.7);\n }\n }\n }\n\n //&.slide-up-on-hover:not(.hide-hover) {\n // &.simulate-hover,\n // &:hover {\n // transition: transform .8s ease !important;\n // transform: translateY(-5%);\n // }\n //}\n\n //&.expand-on-hover:not(.hide-hover) {\n // &.simulate-hover,\n // &:hover {\n // transition: transform .4s ease !important;\n // transform: scale(1.03);\n // z-index: 9999;\n // }\n //}\n }\n\n //regular hover\n .gallery-item-container:not(.invert-hover) {\n\n .gallery-item-hover {\n transition: none;\n\n &:before {\n opacity: 0;\n }\n\n .gallery-item-hover-inner {\n opacity: 0;\n }\n\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n transition: none;\n\n &:before {\n opacity: 1;\n background: $bg-dark-opacity;\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n opacity: 1 !important;\n }\n }\n\n //===================================================================\n //overlay animations\n\n &.hover-animation-fade-in {\n .gallery-item-hover {\n transition: filter .4s ease, opacity .4s ease !important;\n\n &:before {\n transition: filter .4s ease, opacity .4s ease !important;\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n filter: opacity(1);\n }\n }\n }\n\n &.hover-animation-expand {\n .gallery-item-hover {\n transition: transform .4s ease, filter .2s ease, opacity .2s ease !important;\n\n &:before {\n transition: transform .4s ease, filter .2s ease, opacity .2s ease !important;\n transform: scale(0.9);\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .2s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: scale(1);\n filter: opacity(1);\n }\n }\n }\n\n &.hover-animation-slide-up {\n\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateY(100%);\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateY(0);\n filter: opacity(1);\n }\n }\n }\n\n &.hover-animation-slide-right {\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateX(-100%);\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateX(0);\n filter: opacity(1);\n }\n }\n }\n\n &.hover-animation-slide-left {\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateX(100%);\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateX(0);\n filter: opacity(1);\n }\n }\n }\n\n &.hover-animation-slide-down {\n\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateY(-100%);\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateY(0);\n filter: opacity(1);\n }\n }\n }\n\n //&.hover-animation-radius {\n // .gallery-item-hover {\n // &:before {\n // transform: scale(0);\n // border-radius: 100%;\n // }\n // }\n //\n // .gallery-item-hover.force-hover,\n //\n // &:hover .gallery-item-hover:not(.hide-hover) {\n //\n // transition: opacity .2s ease .6s !important;\n //\n //\n // &:before {\n // transition: transform .8s ease, border-radius .8s ease !important;\n // transform: scale(1);\n // border-radius: 0;\n // }\n // }\n //}\n }\n\n //invert-hover\n .gallery-item-container.invert-hover {\n\n .gallery-item-hover {\n transition: none;\n\n &:before {\n opacity: 1;\n background: $bg-dark-opacity;\n }\n\n .gallery-item-hover-inner {\n opacity: 1;\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n opacity: 1 !important;\n }\n\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n transition: none;\n\n &:before {\n opacity: 0;\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n opacity: 0 !important;\n }\n }\n\n //===================================================================\n //overlay animations\n\n &.hover-animation-fade-in {\n .gallery-item-hover {\n transition: filter .4s ease, opacity .4s ease !important;\n\n &:before {\n transition: filter .4s ease, opacity .4s ease !important;\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n filter: opacity(0);\n }\n }\n }\n\n &.hover-animation-expand {\n .gallery-item-hover {\n transition: transform 0.4s ease, filter .2s ease, opacity .2s ease !important;\n\n &:before {\n transition: transform 0.4s ease, filter .2s ease, opacity .2s ease !important;\n transform: scale(1);\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .2s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: scale(0.9);\n filter: opacity(0);\n }\n }\n }\n\n &.hover-animation-slide-up {\n\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateY(0);\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateY(100%);\n filter: opacity(0);\n }\n }\n }\n\n &.hover-animation-slide-right {\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateX(0);\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateX(-100%);\n filter: opacity(0);\n }\n }\n }\n\n &.hover-animation-slide-left {\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateX(100%);\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateX(0);\n filter: opacity(0);\n }\n }\n }\n\n &.hover-animation-slide-down {\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateY(-100%);\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateY(0);\n filter: opacity(0);\n }\n }\n }\n }\n}\n","$enable-wix-style-css: false;\n@import 'modules/mixins-utils';\n@import 'modules/mixins-tpa';\n$wix-color-white: #ffffff;\n$wix-color-red03: #d6453d;\n$wix-color-red10: #ee5951;\n$wix-color-dark60: #dfe5eb;\n$dialog-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2),\n0 13px 19px 2px rgba(0, 0, 0, 0.14),\n0 5px 24px 4px rgba(0, 0, 0, 0.12);\n$wix-dialog-shadow: 0 0 21px 2px rgba(22, 45, 61, 0.6);\n$background-gray: #e0e9f2;\n$background-gray-light: #f1f1f1;\n$background-gray-lighter: #f7f7f7;\n$background-gray-lightest: #fefefe;\n$text-darker: #20303c;\n$text-dark: #2b5672;\n$text-darkest: #162d3d;\n$text-normal: #7a92a5;\n$text-light: #b0bec5;\n$text-placeholder: #b6c1cd;\n$blackish-opacity: rgba(0, 0, 0, 0.2);\n$black-opacity: rgba(0, 0, 0, 0.4);\n$blacker-opacity: rgba(0, 0, 0, 0.7);\n$blackest-opacity: rgba(0, 0, 0, 0.9);\n$whitest-opacity: rgba(255, 255, 255, 0.95);\n$whiter-opacity: rgba(255, 255, 255, 0.8);\n$white-opacity: rgba(255, 255, 255, 0.2);\n$wix-menu-background: #edf2f7;\n$wix-menu-button: #2b81cb;\n$wix-menu-button-hover: #0d487f;\n$wix-menu-border: #d9e1e8;\n$wix-menu-button-danger: #c15150;\n$wix-menu-button-danger-hover: #942b28;\n$input-background: #fcfdff;\n$input-border: #c4e1f9;\n$border-separator: #d6e1e8;\n$symbol-color: #7fccf7;\n$background-menu: #d3edff;\n$wix-blue: #116dff;\n$wix-blue-selected: #b9e0fb;\n$wix-color-blue01: #0048ae;\n$wix-color-blue35: #d9e3f3;\n$wix-color-dark75: #f0f3f5;\n$wix-blue-hover: #4eb7f5;\n$wix-header-bg: #e7eff5;\n$divider-color: #d9e1e8;\n$arrow-box-shadow: rgba(52, 94, 151, .43);\n$arrow-hover-box-shadow: rgba(56, 153, 236, .9);\n$gray-url-svg: #797979;\n$disabled-label: #939393;\n$disabled-input-placeholder: #7a7a7a;\n$white: #fff;\n$black: #000;\n$header-color: #3899ec;\n$light-blue: #eaf7ff;\n$light-blue-active: #daeffe;\n$light-blue-hover: #d3edff;\n$light-blue-hover-border: #c6e2f7;\n$orange-hover: #fc975c;\n$light-sky-blue: #7ecaf5;\n$menu-opacity: rgba(22, 45, 61, 0.7);\n$figcaption-box-shadow: rgba(22, 45, 61, .5);\n$main-text-size: 14px;\n$padding: 24px;\n$link-text-color: #3899ec;\n$share-item-border: #d5d5d5;\n@mixin font($weight) {\n @if $weight=='ulight' {\n font-family: $font-ulight;\n font-weight: 100;\n }\n @else if $weight=='light' {\n font-family: $font-light;\n font-weight: 200;\n }\n @else if $weight=='thin' {\n font-family: $font-thin;\n font-weight: 300;\n }\n @else if $weight=='thin-400-weight' {\n font-family: $font-thin;\n font-weight: 400;\n }\n @else if $weight=='normal' {\n font-family: $font-normal;\n font-weight: 400;\n }\n @else if $weight=='normal-300-weight' {\n font-family: $font-normal;\n font-weight: 300;\n }\n @else if $weight=='medium' {\n font-family: $font-medium;\n font-weight: 600;\n }\n @else if $weight=='bold' {\n font-family: $font-bold;\n font-weight: 600;\n }\n @else {\n font-family: $font-thin;\n font-weight: 300;\n }\n}\n\n$wix-font-family-helvetica-25: \"HelveticaNeueW01-UltLt\",\n\"HelveticaNeueW02-UltLt\",\n\"HelveticaNeueW10-25UltL\",\nsans-serif;\n$wix-font-family-helvetica-35: \"HelveticaNeueW01-Thin\",\n\"HelveticaNeueW02-Thin\",\n\"HelveticaNeueW10-35Thin\",\nsans-serif;\n$wix-font-family-helvetica-45: \"HelveticaNeueW01-45Ligh\",\n\"HelveticaNeueW02-45Ligh\",\n\"HelveticaNeueW10-45Ligh\",\nsans-serif;\n$wix-font-family-helvetica-55: \"HelveticaNeueW01-55Roma\",\n\"HelveticaNeueW02-55Roma\",\n\"HelveticaNeueW10-55Roma\",\nsans-serif;\n$wix-font-family-helvetica-65: \"HelveticaNeueW01-65Medi\",\n\"HelveticaNeueW02-65Medi\",\n\"HelveticaNeueW10-65Medi\",\nsans-serif;\n$wix-font-family-helvetica-75: \"HelveticaNeueW01-75Bold\",\n\"HelveticaNeueW02-75Bold\",\n\"HelveticaNeueW10-75Bold\",\nsans-serif;\n$font-ulight: $wix-font-family-helvetica-25;\n$font-thin: $wix-font-family-helvetica-35;\n$font-light: $wix-font-family-helvetica-45;\n$font-normal: $wix-font-family-helvetica-55;\n$font-medium: $wix-font-family-helvetica-65;\n$font-bold: $wix-font-family-helvetica-75;\n$white: #fff;\n$red: #e03939;\n$wix-blue: #116dff;\n$dark-gray: #111;\n$medium-gray: #49494b;\n$light-gray: #dbdbe0;\n$lighter-gray: #cdcdd0;\n$light-border: #eeeeee;\n$dark-border: #333333;\n$separator-gray: #d7dfe6;\n$tooltip-text: #171616;\n$tooltip-border: rgba(203, 203, 203, 1);\n$panel-danger: #ec5a56;\n$panel-primary: #3f9ae9;\n$hover-icons: #ffffff;\n$social-icons: #5d5d61;\n$facebook-hover: #36609f;\n$twitter-hover: #2aa9e0;\n$pinterest-hover: #ca2027;\n$tumblr-hover: #37465d;\n$mail-hover: #448ccb;\n$divider: rgba(8, 8, 8, 0.2);\n$bg-bright: #ffffff;\n$icons-bright: #080808;\n$social-bright: #5d5d61;\n$bg-brightless: #e9e9e9;\n$bg-dark: #080808;\n$bg-dark-opacity: rgba(8, 8, 8, 0.75);\n$icons-dark: #ffffff;\n$social-dark: #dbdbe0;\n$light-red: #ff9999;\n$light-green: #c1f0c1;\n$animated-bright-bg: rgba(241, 241, 241, 0.2);\n$animated-dark-bg: rgba(241, 241, 241, 1);\n@mixin placeholder($color, $size:'') {\n &::-webkit-input-placeholder {\n color: $color;\n @if $size !='' {\n font-size: $size;\n }\n }\n &:-moz-placeholder {\n color: $color;\n @if $size !='' {\n font-size: $size;\n }\n }\n &:-ms-input-placeholder {\n color: $color;\n @if $size !='' {\n font-size: $size;\n }\n }\n}\n",".animation-slide {\n transition: width 0.4s ease, height 0.4s ease, top 0.4s ease, left 0.4s ease;\n}\n\n.item-with-secondary-media-container {\n .secondary-media-item.hide {\n opacity: 0,;\n }\n\n .secondary-media-item.show {\n opacity: 1;\n }\n}","@import 'consts.scss';\n@import 'hoverEffects.scss';\n@import 'animations.scss';\n\n[data-collapsed=\"true\"] .pro-gallery-parent-container .gallery-item,\n[data-hidden=\"true\"] .pro-gallery-parent-container .gallery-item {\n background-image: none !important;\n}\n\nhtml.pro-gallery {\n width: 100%;\n height: auto;\n}\n\nbody.pro-gallery {\n // opacity: 0;\n transition: opacity 2s ease;\n}\n\n#gallery-loader {\n position: fixed;\n top: 50%;\n}\n\n.show-more-container {\n text-align: center;\n line-height: 138px;\n\n i.show-more {\n color: $social-bright;\n font-size: 40px;\n cursor: pointer;\n margin-top: -3px;\n }\n\n button.show-more {\n display: inline-block;\n padding: 11px 29px;\n border-radius: 0;\n border: 2px solid $social-icons;\n font-family: $font-light;\n font-size: 12px;\n color: $social-icons;\n background: transparent;\n cursor: pointer;\n\n &:hover {\n background: rgba(0, 0, 0, 0.1);\n }\n }\n}\n\n.more-items-loader {\n display: block;\n width: 100%;\n text-align: center;\n line-height: 50px;\n font-size: 30px;\n color: $wix-blue;\n}\n\n.version-header {\n color: $red;\n text-align: left;\n font-family: \"Consolas\", monospace;\n font-size: 13px;\n position: absolute;\n top: 0;\n left: 0;\n width: 320px;\n height: 100px;\n line-height: 30px;\n background: rgba(255, 255, 255, 0.8);\n z-index: 100;\n}\n\n.auto-slideshow-button {\n margin-top: 19px; //24 $padding(consts.scss) - 5px padding top\n padding: 5px;\n height: 28px; //18px icon + 5px padding top + 5px padding bottom\n width: 20px; //10px icon + 5px padding top + 5px padding bottom\n left: auto;\n z-index: 1;\n position: absolute;\n display: flex;\n text-align: center;\n cursor: pointer;\n opacity: 0.9;\n}\n\n.auto-slideshow-counter {\n margin-top: 24px; //24 $padding(consts.scss)\n left: auto;\n z-index: 1;\n position: absolute;\n display: flex;\n text-align: center;\n opacity: 0.9;\n font-size: 15px;\n line-height: normal;\n}\n@keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n.mouse-cursor {\n display: flex;\n width: 100%;\n position: absolute;\n}\n\n.follow-mouse-cursor {\n position: absolute;\n transition: all 0.2s ease;\n > div {\n pointer-events: none;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n}\n\n.nav-arrows-container {\n left: auto;\n position: absolute;\n display: flex;\n text-align: center;\n cursor: pointer;\n opacity: 0.9;\n //font-size: 40px;\n align-items: center;\n background: transparent;\n border: none;\n outline: none;\n justify-content: center;\n\n\n &:hover {\n opacity: 1;\n }\n\n &.shadow svg {\n filter: drop-shadow(0px 1px 0.15px #B2B2B2);\n }\n .slideshow-arrow {\n flex-shrink: 0;\n }\n}\n\n.arrow-portal-container {\n span {\n animation: fadeIn 0.1s ease-in-out;\n position: fixed;\n transition: top 50ms, left 50ms;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\ndiv.gallery-slideshow {\n\n div.pro-gallery,\n .gallery-column {\n box-sizing: content-box !important;\n }\n\n .gallery-group,\n .gallery-item-container,\n .gallery-item-wrapper {\n overflow: visible !important;\n }\n\n &.streched {\n .gallery-slideshow-info {\n padding-left: 50px !important;\n padding-right: 50px !important;\n }\n }\n\n div.pro-gallery {\n @media (max-width: 500px) {\n .gallery-slideshow-info {\n padding-left: 20px;\n padding-right: 20px;\n }\n }\n\n .gallery-item-container {\n\n .gallery-slideshow-info {\n position: absolute;\n padding-top: 0px;\n bottom: -220px;\n height: 220px;\n width: 100%;\n box-sizing: border-box;\n display: flex;\n z-index: 15;\n }\n }\n }\n}\n\n.gallery-thumbnails {\n div.pro-gallery {\n .gallery-item-container {\n .gallery-item-wrapper {\n .gallery-item-hover {\n padding: 30px 60px;\n }\n }\n }\n }\n}\n\n.gallery-slider {\n div.pro-gallery {\n .gallery-item-container {\n .gallery-item-wrapper {\n .gallery-item-hover {\n padding: 30px 10px 50px;\n }\n }\n }\n }\n}\n\n.gallery-columns {\n div.pro-gallery {\n .gallery-item-container {\n .gallery-item-wrapper {\n .gallery-item-hover {\n padding: 30px;\n }\n }\n }\n }\n}\n\ndiv.pro-gallery {\n width: 100%;\n height: 100%;\n overflow: hidden;\n backface-visibility: hidden;\n position: relative;\n\n .gallery-column {\n float: left;\n overflow: hidden;\n position: relative;\n transform-style: preserve-3d;\n backface-visibility: hidden;\n\n .gallery-left-padding {\n display: inline-block;\n height: 100%;\n }\n\n .gallery-top-padding {\n display: block;\n width: 100%;\n }\n }\n\n .gallery-group {\n float: left;\n overflow: hidden;\n position: relative;\n transform-style: preserve-3d;\n backface-visibility: hidden;\n box-sizing: border-box;\n padding: 0;\n font-family: $font-light;\n font-size: 11px;\n\n &.debug {\n &.gallery-group-gone {\n background: $lighter-gray;\n }\n\n &.gallery-group-visible {\n background: $light-green;\n }\n\n &.gallery-group-hidden {\n background: $light-red;\n }\n }\n }\n\n .gallery-item-container {\n position: absolute;\n display: inline-block;\n vertical-align: top;\n border: none;\n padding: 0;\n border-radius: 0;\n box-sizing: border-box;\n overflow: hidden;\n transform-style: preserve-3d;\n backface-visibility: hidden;\n outline: none;\n text-decoration: none;\n color: inherit;\n will-change: top, left, width, height;\n box-sizing: border-box;\n font-family: $font-light;\n font-size: 11px;\n cursor: default;\n scroll-snap-align: center;\n .item-action {\n width: 1px;\n height: 1px;\n overflow: hidden;\n position: absolute;\n pointer-events: none;\n z-index: -1;\n &:focus {\n --focus-ring-box-shadow: none !important;\n outline: none !important;\n box-shadow: none !important;\n }\n }\n &:hover {\n .gallery-item-common-info {\n cursor: pointer;\n\n button {\n text-decoration: underline;\n cursor: pointer;\n }\n }\n }\n\n &.visible {\n transform: translate3d(0, 0, 0);\n }\n\n &.clickable {\n cursor: pointer;\n }\n\n .gallery-item-wrapper {\n position: relative;\n width: 100%;\n height: 100%;\n overflow: hidden;\n\n .item-with-secondary-media-container {\n .secondary-media-item {\n position: absolute;\n z-index: 1;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n .gallery-item {\n object-fit: cover;\n }\n .text-item > div {\n width: 100% !important;\n height: 100% !important;\n }\n }\n }\n\n &.transparent,\n &.cube-type-fit {\n background: transparent;\n }\n\n .gallery-item-preload {\n display: none;\n }\n\n &.cube-type-fit .gallery-item {\n background: transparent;\n object-fit: contain;\n }\n\n .gallery-item {\n object-fit: cover;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n overflow: hidden;\n border-radius: 0;\n\n &.text-item {\n\n box-sizing: border-box;\n /! autoprefixer: ignore next /\n -webkit-font-smoothing: antialiased;\n white-space: initial;\n\n .te-pro-gallery-text-item {\n line-height: normal !important;\n letter-spacing: normal !important;\n }\n\n > div {\n background: initial !important;\n box-sizing: border-box;\n }\n\n p,\n span,\n div,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n i {\n margin: 0;\n padding: 0;\n }\n\n }\n\n .pro-circle-preloader {\n top: 50%;\n left: 50%;\n height: 30px;\n width: 15px;\n z-index: -1;\n opacity: 0.4;\n }\n\n img.gallery--placeholder-item {\n width: 100% !important;\n height: 100% !important;\n object-fit: cover;\n object-position: center;\n }\n\n &.gallery-item-loaded {\n background-color: transparent;\n opacity: 1 !important;\n // filter: none !important;\n animation: none !important;\n\n &.image-item:after {\n display: none !important;\n }\n\n ~.pro-circle-preloader {\n display: none;\n }\n }\n\n &.error {\n opacity: 0 !important;\n }\n\n &.gallery-item-preloaded {\n background-size: cover;\n background-repeat: no-repeat;\n background-position: center center;\n\n &.grid-fit {\n background-size: contain;\n }\n }\n &.gallery-item-3d-placeholder {\n &.three-d-loaded {\n img {\n opacity: 0;\n pointer-events: none;\n }\n }\n &.three-d-loading {\n img {\n opacity: 1;\n }\n }\n img {\n transition: opacity .2s ease;\n }\n }\n &.gallery-item-video {\n overflow: hidden;\n text-align: center; //for grid crop\n\n iframe {\n left: 0;\n top: 0;\n }\n &.playedOnce {\n ~ .image-item {\n pointer-events: none;\n opacity: 0;\n transition: opacity .2s ease;\n }\n }\n }\n &.gallery-item-video, &.gallery-item-3d-placeholder, &.thumbnailItem {\n\n &.playing {\n\n button,\n i {\n display: none;\n }\n }\n\n button,\n i {\n display: inline-block;\n text-rendering: auto;\n /! autoprefixer: ignore next /\n -webkit-font-smoothing: antialiased;\n position: absolute;\n z-index: 11;\n top: 50%;\n left: 50%;\n height: 60px;\n text-align: center;\n margin: -30px 0 0 -30px;\n background: $bg-dark;\n color: $white;\n border-radius: 50px;\n opacity: 0.7;\n\n &.play-triangle {\n opacity: 1;\n }\n\n &.play-triangle,\n &.play-background {\n //padding-left: 6px;\n //width: 54px;\n //line-height: 58px;\n font-size: 26px;\n }\n\n &:hover {\n opacity: 0.9;\n }\n\n &:before {\n font-size: 2.3em;\n opacity: 1;\n }\n }\n }\n\n }\n\n .gallery-item-info {\n position: absolute;\n bottom: -220px;\n height: 220px;\n width: 100%;\n box-sizing: border-box;\n display: flex;\n //border-radius: $image-radius+px;\n z-index: 15;\n\n >div {\n height: 100%;\n width: 100%;\n }\n }\n\n .gallery-item-hover {\n white-space: initial;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n box-sizing: border-box;\n border-radius: 0;\n //border-radius: $image-radius+px;\n z-index: 15;\n overflow: hidden;\n .gallery-item-hover-inner {\n height: 100%;\n }\n\n &.no-hover-bg {\n &:before {\n opacity: 0 !important;\n }\n }\n\n &:before {\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n box-sizing: border-box;\n z-index: -1;\n }\n\n }\n\n }\n\n .gallery-item-common-info {\n box-sizing: border-box;\n cursor: pointer;\n }\n }\n .thumbnailItem {\n\n &.playing {\n\n button,\n i {\n display: none;\n }\n }\n\n button,\n i {\n display: inline-block;\n text-rendering: auto;\n /! autoprefixer: ignore next /\n -webkit-font-smoothing: antialiased;\n position: absolute;\n z-index: 11;\n top: 50%;\n left: 50%;\n height: 28px;\n width: 28px;\n text-align: center;\n margin: -16px -1px 0 -16px;\n background: $bg-dark;\n color: $white;\n border-radius: 100%;\n opacity: 0.7;\n\n &.play-triangle {\n opacity: 1;\n }\n\n &:before {\n font-size: 2.3em;\n opacity: 1;\n }\n }\n }\n &.one-row {\n //overflow-x: scroll;\n white-space: nowrap;\n float: left;\n\n .gallery-column {\n width: 100%;\n float: none;\n //overflow-x: scroll;\n white-space: nowrap;\n\n .gallery-group {\n display: inline-block;\n float: none;\n }\n }\n\n &.slider {\n .gallery-column {\n overflow-x: scroll;\n\n &.scroll-snap {\n scroll-snap-type: x mandatory;\n }\n\n }\n }\n\n .gallery-horizontal-scroll-inner {\n position: relative;\n will-change: transform;\n }\n }\n\n &.thumbnails-gallery {\n overflow: hidden;\n float: left;\n\n .galleryColumn {\n position: relative;\n overflow: visible;\n }\n\n .thumbnailItem {\n position: absolute;\n background-color: white;\n background-size: cover;\n background-position: center;\n overflow-y: inherit;\n border-radius: 0px;\n cursor: pointer;\n \n &.pro-gallery-highlight::after {\n content: '';\n display: block;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n background-color: rgba(255, 255, 255, .6);\n }\n }\n }\n\n @media (max-width: 500px) {\n &.thumbnails-gallery {\n overflow: visible;\n }\n }\n\n *:focus {\n box-shadow: none; //remove wix's default blue shadow\n }\n\n &.accessible {\n\n i,\n button:not(.nav-arrows-container, .has-custom-focus) {\n &:focus {\n box-shadow: 0 0 0 1px $white, 0 0 1px 2px $wix-blue;\n }\n }\n\n .has-custom-focus {\n &:focus {\n box-shadow: inset 0 0 0 1px $white, inset 0 0 1px 4px $wix-blue;\n }\n }\n\n .gallery-item-hover {\n\n i,\n button {\n &:focus {\n box-shadow: none;\n }\n }\n }\n\n\n .thumbnailItem.pro-gallery-highlight::after {\n box-shadow: inset 0 0 1px 2px $wix-blue, inset 0 0 7px 0 $white, 0 0 10px -5px $wix-blue;\n }\n\n .gallery-item-container:has(.item-action:focus)::after {\n content: ' ';\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n box-shadow: inset 0 0 1px 2px $wix-blue, inset 0 0 7px 0 $white, inset 0 0 10px -5px $wix-blue;\n pointer-events: none;\n border-radius: inherit;\n z-index: 15;\n }\n\n .pro-gallery-thumbnails-highlighted::before {\n box-shadow: inset 0 0 1px 2px $wix-blue, inset 0 0 7px 0 $white, inset 0 0 10px -5px $wix-blue;\n }\n\n .pro-gallery-thumbnails-highlighted::after {\n content: ' ';\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n box-shadow: inset 0 0 1px 2px $wix-blue, inset 0 0 7px 0 $white, 0 0 10px -5px $wix-blue;\n pointer-events: none;\n border-radius: inherit;\n }\n }\n\n .hide-scrollbars {\n -ms-overflow-style: none;\n overflow: -moz-scrollbars-none;\n scrollbar-width: none;\n\n &::-webkit-scrollbar,\n ::-webkit-scrollbar {\n width: 0 !important;\n height: 0 !important;\n }\n }\n\n .rtl {\n direction: rtl;\n }\n .ltr {\n direction: ltr;\n }\n\n}\n\n.sr-only {\n &.out-of-view-component{\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip-path: circle(0%);\n border: 0;\n }\n}\n\n.screen-logs {\n word-wrap: break-word;\n background: $white;\n width: 280px;\n font-size: 10px;\n}\n\n.fade {\n display: block;\n transition: opacity 600ms ease;\n}\n\n.fade-visible {\n opacity: 1;\n}\n\n.fade-hidden {\n opacity: 0;\n}\n\n.deck-before {\n display: block;\n z-index: 1;\n transition: transform 600ms ease;\n transform: translateX(-(100%));\n}\n\n.deck-before-rtl {\n display: block;\n z-index: 1;\n transition: transform 600ms ease;\n transform: translateX(100%);\n}\n\n.deck-current {\n display: block;\n z-index: 0;\n transition: transform 600ms ease;\n transform: translateX(0);\n\n .override {\n transition: transform 600ms ease, opacity 0.1s ease 200ms !important;\n }\n}\n\n.deck-after {\n display: block;\n transition: opacity .2s ease 600ms;\n z-index: -1;\n opacity: 0;\n\n .override {\n transition: opacity 0.1s ease 0s !important;\n }\n}\n\n.disabled-transition {\n transition: none !important;\n}\n\n@keyframes changing_background {\n 0% {\n background-color: rgba(241, 241, 241, 0.2);\n }\n\n 50% {\n background-color: rgba(241, 241, 241, 0.8);\n }\n\n 100% {\n background-color: rgba(241, 241, 241, 0.2);\n }\n}\n\n@mixin scroll-snap-element {\n content:'';\n position: absolute;\n scroll-snap-align: center;\n top: var(--group-top);\n left: var(--group-left);\n width: var(--group-width);\n right: var(--group-right);\n height: 1px;\n pointer-events: none;\n}\n\n$group-view: '[data-hook=\"group-view\"]';\n\n.pro-gallery-parent-container{\n &.gallery-slideshow #{$group-view}::before { \n @include scroll-snap-element;\n }\n &:not(.gallery-slideshow) {\n & #{$group-view} .item-link-wrapper::before { \n @include scroll-snap-element;\n }\n }\n} \n\n.gallery-item-container {\n scroll-snap-align: none !important;\n}\n\n.gallery-slideshow {\n .gallery-item-container:not(.clickable) a {\n cursor: default;\n }\n}"]}
1	+ {"version":3,"sourceRoot":"","sources":["../../src/components/styles/_hoverEffects.scss","../../src/components/styles/consts.scss","../../src/components/styles/animations.scss","../../src/components/styles/gallery.scss"],"names":[],"mappings":"AAUK;EACC;;AAMI;EACE;;AAQN;EACE;;AAIA;EACE;;AAEF;EACE;;AAEF;EACE;;AAQJ;EACE;;AAIA;EACE;;AAMJ;EACE;;AAME;EACE;;AAON;EACE;;AAKA;EACE;;AAKN;EACE;EACA;;AAEA;EAEE;;AAEA;EACE;;AAMJ;EACE;;AAKA;EACE;;AAMJ;EACE;EACA;;AAKA;EACE;;AAMJ;EACE;EACA;;AAKA;EACE;;AA0BN;EACE;;AAEA;EACE;;AAGF;EACE;;AAKJ;EAGE;;AAEA;EACE;EACA,YClBU;;ADqBZ;AAAA;AAAA;EAEE;;AAQF;EACE;;AAEA;EACE;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAOJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAOJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAgCN;EACE;;AAEA;EACE;EACA,YC1NU;;AD6NZ;EACE;;AAGF;AAAA;EAEE;;AAKJ;EAGE;;AAEA;EACE;;AAGF;AAAA;AAAA;EAEE;;AAQF;EACE;;AAEA;EACE;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAOJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;;AAGF;AAAA;EAEE;;AAOF;EACE;EACA;;;AEnjBV;EACI;;;AAIF;EACE;;AAGF;EACE;;;ACNJ;AAAA;EAEE;;;AAGF;EACE;EACA;;;AAGF;EAEE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;AAEA;EACE,OFmIY;EElIZ;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA,aF0E2B;EEzE3B;EACA,OF6GW;EE5GX;EACA;;AAEA;EACE;;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA,OFgFS;;;AE7EX;EACE,OF2EI;EE1EJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAGF;EACE;;AAEF;EACE;;AAGF;EACE;;;AAKF;EACA;EACA;EACA;EACA;EACA;EACA;;;AAKA;AAAA;EAEE;;AAGF;AAAA;AAAA;EAGE;;AAIA;EACE;EACA;;AAKF;EACE;IACE;IACA;;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAUA;EACE;;;AAWF;EACE;;;AAWF;EACE;;;AAOV;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,aFrK2B;EEsK3B;;AAGE;EACE,YF9IO;;AEiJT;EACE,YFzHM;;AE4HR;EACE,YF9HI;;AEmIV;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,aFvM2B;EEwM3B;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AAIF;EACE;;AAEA;EACE;EACA;;AAKN;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAGE;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEF;EACE;EACA;;AAKN;EAEE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;AACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAUE;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EAEA;;AAEA;EACE;;AAGF;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;AAKA;EACE;EACA;;AAIF;EACE;;AAGJ;EACE;;AAGJ;EACE;EACA;;AAEA;EACE;EACA;;AAGA;EACE;EACA;EACA;;AAQF;AAAA;AAAA;AAAA;EAEE;;AAIJ;AAAA;AAAA;AAAA;EAEE;EACA;AACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YFhXF;EEiXE,OF3YJ;EE4YI;EACA;;AAEA;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;EACE;EACA;;AAOR;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AACA;EACE;;AAIA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAON;EACE;EACA;;AAOA;AAAA;EAEE;;AAIJ;AAAA;EAEE;EACA;AACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YFleI;EEmeJ,OF7fE;EE8fF;EACA;;AAEA;AAAA;EACE;;AAGF;AAAA;EACE;EACA;;AAIN;EAEE;EACA;;AAEA;EACE;EACA;EAEA;;AAEA;EACE;EACA;;AAKF;EACE;;AAEA;EACE;;AAMN;EACE;EACA;;AAIJ;EACE;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKR;EACE;IACE;;;AAIJ;EACE;;AAOE;AAAA;EACE;;AAKF;EACE;;AAQA;AAAA;EACE;;AAMN;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;;AAEA;AAAA;EAEE;EACA;;AAIJ;EACE;;AAEF;EACE;;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE;EACA,YFtrBM;EEurBN;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;;;AAGF;EACE;IACE;;EAGF;IACE;;EAGF;IACE;;;AAmBF;EAdA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAUE;EAlBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAgBF;EACI;;;AAIF;EACI","file":"main.css","sourcesContent":["@import 'consts.scss';\n\ndiv.pro-gallery {\n //common\n .gallery-item-container {\n //===================================================================\n //image hover animations\n\n &.main-color-on-hover:not(.hide-hover) {\n\n .gallery-item-content .gallery-item {\n transition: opacity .4s ease !important;\n }\n\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n .gallery-item {\n opacity: 0;\n }\n }\n }\n }\n\n &.zoom-in-on-hover:not(.hide-hover) {\n\n .gallery-item-hover:not(.hide-hover), .gallery-item-content, .hover-info-element {\n transition: transform 2.2s cubic-bezier(.14, .4, .09, .99) !important;\n }\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n transform: scale(1.1);\n }\n .gallery-item-hover:not(.hide-hover) {\n transform: scale(1.110); //make sure overlay cover all edges of an image.\n }\n .gallery-item-hover:not(.hide-hover) .hover-info-element {\n transform: scale(calc(1/1.110));\n }\n\n }\n }\n\n &.tilt-on-hover:not(.hide-hover) {\n\n .gallery-item-hover:not(.hide-hover), .gallery-item-content, .hover-info-element {\n transition: transform 1.2s cubic-bezier(.14, .4, .09, .99) !important;\n }\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n transform: scale(0.845) rotate(calc(var(--tiltAngleValue) * 1deg));\n }\n }\n }\n\n &.blur-on-hover:not(.hide-hover) {\n .gallery-item-content {\n transition: filter .4s linear !important;\n }\n\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n .gallery-item {\n filter: blur(6px);\n }\n }\n }\n }\n\n &.grayscale-on-hover:not(.hide-hover) {\n .gallery-item-content {\n transition: filter .6s ease !important;\n }\n\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n filter: grayscale(1);\n }\n }\n }\n\n &.shrink-on-hover:not(.hide-hover) {\n transition: background-color .4s ease !important;\n transition: transform .4s ease !important;\n\n &.simulate-hover,\n &:hover {\n transform: scale(0.985);\n\n div {\n transform: none !important;\n }\n }\n }\n\n &.invert-on-hover:not(.hide-hover) {\n .gallery-item-content {\n transition: filter .6s ease !important;\n }\n\n &.simulate-hover,\n &:hover {\n .gallery-item-content {\n filter: invert(1);\n }\n }\n }\n\n &.color-in-on-hover {\n .gallery-item-content {\n filter: grayscale(1);\n transition: filter .6s ease !important;\n }\n\n &.simulate-hover:not(.hide-hover),\n &:hover:not(.hide-hover) {\n .gallery-item-content {\n filter: grayscale(0);\n }\n }\n }\n\n &.darkened-on-hover {\n .gallery-item-content {\n filter: brightness(1);\n transition: filter .6s ease !important;\n }\n\n &.simulate-hover:not(.hide-hover),\n &:hover:not(.hide-hover) {\n .gallery-item-content {\n filter: brightness(0.7);\n }\n }\n }\n\n //&.slide-up-on-hover:not(.hide-hover) {\n // &.simulate-hover,\n // &:hover {\n // transition: transform .8s ease !important;\n // transform: translateY(-5%);\n // }\n //}\n\n //&.expand-on-hover:not(.hide-hover) {\n // &.simulate-hover,\n // &:hover {\n // transition: transform .4s ease !important;\n // transform: scale(1.03);\n // z-index: 9999;\n // }\n //}\n }\n\n //regular hover\n .gallery-item-container:not(.invert-hover) {\n\n .gallery-item-hover {\n transition: none;\n\n &:before {\n opacity: 0;\n }\n\n .gallery-item-hover-inner {\n opacity: 0;\n }\n\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n transition: none;\n\n &:before {\n opacity: 1;\n background: $bg-dark-opacity;\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n opacity: 1 !important;\n }\n }\n\n //===================================================================\n //overlay animations\n\n &.hover-animation-fade-in {\n .gallery-item-hover {\n transition: filter .4s ease, opacity .4s ease !important;\n\n &:before {\n transition: filter .4s ease, opacity .4s ease !important;\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n filter: opacity(1);\n }\n }\n }\n\n &.hover-animation-expand {\n .gallery-item-hover {\n transition: transform .4s ease, filter .2s ease, opacity .2s ease !important;\n\n &:before {\n transition: transform .4s ease, filter .2s ease, opacity .2s ease !important;\n transform: scale(0.9);\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .2s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: scale(1);\n filter: opacity(1);\n }\n }\n }\n\n &.hover-animation-slide-up {\n\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateY(100%);\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateY(0);\n filter: opacity(1);\n }\n }\n }\n\n &.hover-animation-slide-right {\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateX(-100%);\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateX(0);\n filter: opacity(1);\n }\n }\n }\n\n &.hover-animation-slide-left {\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateX(100%);\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateX(0);\n filter: opacity(1);\n }\n }\n }\n\n &.hover-animation-slide-down {\n\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateY(-100%);\n filter: opacity(0);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateY(0);\n filter: opacity(1);\n }\n }\n }\n\n //&.hover-animation-radius {\n // .gallery-item-hover {\n // &:before {\n // transform: scale(0);\n // border-radius: 100%;\n // }\n // }\n //\n // .gallery-item-hover.force-hover,\n //\n // &:hover .gallery-item-hover:not(.hide-hover) {\n //\n // transition: opacity .2s ease .6s !important;\n //\n //\n // &:before {\n // transition: transform .8s ease, border-radius .8s ease !important;\n // transform: scale(1);\n // border-radius: 0;\n // }\n // }\n //}\n }\n\n //invert-hover\n .gallery-item-container.invert-hover {\n\n .gallery-item-hover {\n transition: none;\n\n &:before {\n opacity: 1;\n background: $bg-dark-opacity;\n }\n\n .gallery-item-hover-inner {\n opacity: 1;\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n opacity: 1 !important;\n }\n\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n transition: none;\n\n &:before {\n opacity: 0;\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n opacity: 0 !important;\n }\n }\n\n //===================================================================\n //overlay animations\n\n &.hover-animation-fade-in {\n .gallery-item-hover {\n transition: filter .4s ease, opacity .4s ease !important;\n\n &:before {\n transition: filter .4s ease, opacity .4s ease !important;\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n filter: opacity(0);\n }\n }\n }\n\n &.hover-animation-expand {\n .gallery-item-hover {\n transition: transform 0.4s ease, filter .2s ease, opacity .2s ease !important;\n\n &:before {\n transition: transform 0.4s ease, filter .2s ease, opacity .2s ease !important;\n transform: scale(1);\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .2s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: scale(0.9);\n filter: opacity(0);\n }\n }\n }\n\n &.hover-animation-slide-up {\n\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateY(0);\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateY(100%);\n filter: opacity(0);\n }\n }\n }\n\n &.hover-animation-slide-right {\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateX(0);\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateX(-100%);\n filter: opacity(0);\n }\n }\n }\n\n &.hover-animation-slide-left {\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateX(100%);\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateX(0);\n filter: opacity(0);\n }\n }\n }\n\n &.hover-animation-slide-down {\n .gallery-item-hover {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n\n &:before {\n transition: transform .4s cubic-bezier(.3, .13, .12, 1), filter .5s ease, opacity .5s ease !important;\n transform: translateY(-100%);\n filter: opacity(1);\n }\n\n .gallery-item-hover-inner,\n .info-member:not(.hidden) {\n transition: opacity .4s ease;\n }\n }\n\n .gallery-item-hover.force-hover,\n &:hover .gallery-item-hover:not(.hide-hover) {\n\n &:before {\n transform: translateY(0);\n filter: opacity(0);\n }\n }\n }\n }\n}\n","$enable-wix-style-css: false;\n@import 'modules/mixins-utils';\n@import 'modules/mixins-tpa';\n$wix-color-white: #ffffff;\n$wix-color-red03: #d6453d;\n$wix-color-red10: #ee5951;\n$wix-color-dark60: #dfe5eb;\n$dialog-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2),\n0 13px 19px 2px rgba(0, 0, 0, 0.14),\n0 5px 24px 4px rgba(0, 0, 0, 0.12);\n$wix-dialog-shadow: 0 0 21px 2px rgba(22, 45, 61, 0.6);\n$background-gray: #e0e9f2;\n$background-gray-light: #f1f1f1;\n$background-gray-lighter: #f7f7f7;\n$background-gray-lightest: #fefefe;\n$text-darker: #20303c;\n$text-dark: #2b5672;\n$text-darkest: #162d3d;\n$text-normal: #7a92a5;\n$text-light: #b0bec5;\n$text-placeholder: #b6c1cd;\n$blackish-opacity: rgba(0, 0, 0, 0.2);\n$black-opacity: rgba(0, 0, 0, 0.4);\n$blacker-opacity: rgba(0, 0, 0, 0.7);\n$blackest-opacity: rgba(0, 0, 0, 0.9);\n$whitest-opacity: rgba(255, 255, 255, 0.95);\n$whiter-opacity: rgba(255, 255, 255, 0.8);\n$white-opacity: rgba(255, 255, 255, 0.2);\n$wix-menu-background: #edf2f7;\n$wix-menu-button: #2b81cb;\n$wix-menu-button-hover: #0d487f;\n$wix-menu-border: #d9e1e8;\n$wix-menu-button-danger: #c15150;\n$wix-menu-button-danger-hover: #942b28;\n$input-background: #fcfdff;\n$input-border: #c4e1f9;\n$border-separator: #d6e1e8;\n$symbol-color: #7fccf7;\n$background-menu: #d3edff;\n$wix-blue: #116dff;\n$wix-blue-selected: #b9e0fb;\n$wix-color-blue01: #0048ae;\n$wix-color-blue35: #d9e3f3;\n$wix-color-dark75: #f0f3f5;\n$wix-blue-hover: #4eb7f5;\n$wix-header-bg: #e7eff5;\n$divider-color: #d9e1e8;\n$arrow-box-shadow: rgba(52, 94, 151, .43);\n$arrow-hover-box-shadow: rgba(56, 153, 236, .9);\n$gray-url-svg: #797979;\n$disabled-label: #939393;\n$disabled-input-placeholder: #7a7a7a;\n$white: #fff;\n$black: #000;\n$header-color: #3899ec;\n$light-blue: #eaf7ff;\n$light-blue-active: #daeffe;\n$light-blue-hover: #d3edff;\n$light-blue-hover-border: #c6e2f7;\n$orange-hover: #fc975c;\n$light-sky-blue: #7ecaf5;\n$menu-opacity: rgba(22, 45, 61, 0.7);\n$figcaption-box-shadow: rgba(22, 45, 61, .5);\n$main-text-size: 14px;\n$padding: 24px;\n$link-text-color: #3899ec;\n$share-item-border: #d5d5d5;\n@mixin font($weight) {\n @if $weight=='ulight' {\n font-family: $font-ulight;\n font-weight: 100;\n }\n @else if $weight=='light' {\n font-family: $font-light;\n font-weight: 200;\n }\n @else if $weight=='thin' {\n font-family: $font-thin;\n font-weight: 300;\n }\n @else if $weight=='thin-400-weight' {\n font-family: $font-thin;\n font-weight: 400;\n }\n @else if $weight=='normal' {\n font-family: $font-normal;\n font-weight: 400;\n }\n @else if $weight=='normal-300-weight' {\n font-family: $font-normal;\n font-weight: 300;\n }\n @else if $weight=='medium' {\n font-family: $font-medium;\n font-weight: 600;\n }\n @else if $weight=='bold' {\n font-family: $font-bold;\n font-weight: 600;\n }\n @else {\n font-family: $font-thin;\n font-weight: 300;\n }\n}\n\n$wix-font-family-helvetica-25: \"HelveticaNeueW01-UltLt\",\n\"HelveticaNeueW02-UltLt\",\n\"HelveticaNeueW10-25UltL\",\nsans-serif;\n$wix-font-family-helvetica-35: \"HelveticaNeueW01-Thin\",\n\"HelveticaNeueW02-Thin\",\n\"HelveticaNeueW10-35Thin\",\nsans-serif;\n$wix-font-family-helvetica-45: \"HelveticaNeueW01-45Ligh\",\n\"HelveticaNeueW02-45Ligh\",\n\"HelveticaNeueW10-45Ligh\",\nsans-serif;\n$wix-font-family-helvetica-55: \"HelveticaNeueW01-55Roma\",\n\"HelveticaNeueW02-55Roma\",\n\"HelveticaNeueW10-55Roma\",\nsans-serif;\n$wix-font-family-helvetica-65: \"HelveticaNeueW01-65Medi\",\n\"HelveticaNeueW02-65Medi\",\n\"HelveticaNeueW10-65Medi\",\nsans-serif;\n$wix-font-family-helvetica-75: \"HelveticaNeueW01-75Bold\",\n\"HelveticaNeueW02-75Bold\",\n\"HelveticaNeueW10-75Bold\",\nsans-serif;\n$font-ulight: $wix-font-family-helvetica-25;\n$font-thin: $wix-font-family-helvetica-35;\n$font-light: $wix-font-family-helvetica-45;\n$font-normal: $wix-font-family-helvetica-55;\n$font-medium: $wix-font-family-helvetica-65;\n$font-bold: $wix-font-family-helvetica-75;\n$white: #fff;\n$red: #e03939;\n$wix-blue: #116dff;\n$dark-gray: #111;\n$medium-gray: #49494b;\n$light-gray: #dbdbe0;\n$lighter-gray: #cdcdd0;\n$light-border: #eeeeee;\n$dark-border: #333333;\n$separator-gray: #d7dfe6;\n$tooltip-text: #171616;\n$tooltip-border: rgba(203, 203, 203, 1);\n$panel-danger: #ec5a56;\n$panel-primary: #3f9ae9;\n$hover-icons: #ffffff;\n$social-icons: #5d5d61;\n$facebook-hover: #36609f;\n$twitter-hover: #2aa9e0;\n$pinterest-hover: #ca2027;\n$tumblr-hover: #37465d;\n$mail-hover: #448ccb;\n$divider: rgba(8, 8, 8, 0.2);\n$bg-bright: #ffffff;\n$icons-bright: #080808;\n$social-bright: #5d5d61;\n$bg-brightless: #e9e9e9;\n$bg-dark: #080808;\n$bg-dark-opacity: rgba(8, 8, 8, 0.75);\n$icons-dark: #ffffff;\n$social-dark: #dbdbe0;\n$light-red: #ff9999;\n$light-green: #c1f0c1;\n$animated-bright-bg: rgba(241, 241, 241, 0.2);\n$animated-dark-bg: rgba(241, 241, 241, 1);\n@mixin placeholder($color, $size:'') {\n &::-webkit-input-placeholder {\n color: $color;\n @if $size !='' {\n font-size: $size;\n }\n }\n &:-moz-placeholder {\n color: $color;\n @if $size !='' {\n font-size: $size;\n }\n }\n &:-ms-input-placeholder {\n color: $color;\n @if $size !='' {\n font-size: $size;\n }\n }\n}\n",".animation-slide {\n transition: width 0.4s ease, height 0.4s ease, top 0.4s ease, left 0.4s ease;\n}\n\n.item-with-secondary-media-container {\n .secondary-media-item.hide {\n opacity: 0,;\n }\n\n .secondary-media-item.show {\n opacity: 1;\n }\n}","@import 'consts.scss';\n@import 'hoverEffects.scss';\n@import 'animations.scss';\n\n[data-collapsed=\"true\"] .pro-gallery-parent-container .gallery-item,\n[data-hidden=\"true\"] .pro-gallery-parent-container .gallery-item {\n background-image: none !important;\n}\n\nhtml.pro-gallery {\n width: 100%;\n height: auto;\n}\n\nbody.pro-gallery {\n // opacity: 0;\n transition: opacity 2s ease;\n}\n\n#gallery-loader {\n position: fixed;\n top: 50%;\n}\n\n.show-more-container {\n text-align: center;\n line-height: 138px;\n\n i.show-more {\n color: $social-bright;\n font-size: 40px;\n cursor: pointer;\n margin-top: -3px;\n }\n\n button.show-more {\n display: inline-block;\n padding: 11px 29px;\n border-radius: 0;\n border: 2px solid $social-icons;\n font-family: $font-light;\n font-size: 12px;\n color: $social-icons;\n background: transparent;\n cursor: pointer;\n\n &:hover {\n background: rgba(0, 0, 0, 0.1);\n }\n }\n}\n\n.more-items-loader {\n display: block;\n width: 100%;\n text-align: center;\n line-height: 50px;\n font-size: 30px;\n color: $wix-blue;\n}\n\n.version-header {\n color: $red;\n text-align: left;\n font-family: \"Consolas\", monospace;\n font-size: 13px;\n position: absolute;\n top: 0;\n left: 0;\n width: 320px;\n height: 100px;\n line-height: 30px;\n background: rgba(255, 255, 255, 0.8);\n z-index: 100;\n}\n\n.auto-slideshow-button {\n margin-top: 19px; //24 $padding(consts.scss) - 5px padding top\n padding: 5px;\n height: 28px; //18px icon + 5px padding top + 5px padding bottom\n width: 20px; //10px icon + 5px padding top + 5px padding bottom\n left: auto;\n z-index: 1;\n position: absolute;\n display: flex;\n text-align: center;\n cursor: pointer;\n opacity: 0.9;\n}\n\n.auto-slideshow-counter {\n margin-top: 24px; //24 $padding(consts.scss)\n left: auto;\n z-index: 1;\n position: absolute;\n display: flex;\n text-align: center;\n opacity: 0.9;\n font-size: 15px;\n line-height: normal;\n}\n@keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n.mouse-cursor {\n display: flex;\n width: 100%;\n position: absolute;\n}\n\n.follow-mouse-cursor {\n position: absolute;\n transition: all 0.2s ease;\n > div {\n pointer-events: none;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n}\n\n.nav-arrows-container {\n left: auto;\n position: absolute;\n display: flex;\n text-align: center;\n cursor: pointer;\n opacity: 0.9;\n align-items: center;\n background: transparent;\n border: none;\n justify-content: center;\n\n\n &:hover {\n opacity: 1;\n }\n\n &.shadow svg {\n filter: drop-shadow(0px 1px 0.15px #B2B2B2);\n }\n .slideshow-arrow {\n flex-shrink: 0;\n }\n\n &:focus {\n box-shadow: inset 0 0 0 1px $white, inset 0 0 1px 4px $wix-blue !important;\n }\n}\n\n.arrow-portal-container {\n span {\n animation: fadeIn 0.1s ease-in-out;\n position: fixed;\n transition: top 50ms, left 50ms;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n}\ndiv.gallery-slideshow {\n\n div.pro-gallery,\n .gallery-column {\n box-sizing: content-box !important;\n }\n\n .gallery-group,\n .gallery-item-container,\n .gallery-item-wrapper {\n overflow: visible !important;\n }\n\n &.streched {\n .gallery-slideshow-info {\n padding-left: 50px !important;\n padding-right: 50px !important;\n }\n }\n\n div.pro-gallery {\n @media (max-width: 500px) {\n .gallery-slideshow-info {\n padding-left: 20px;\n padding-right: 20px;\n }\n }\n\n .gallery-item-container {\n\n .gallery-slideshow-info {\n position: absolute;\n padding-top: 0px;\n bottom: -220px;\n height: 220px;\n width: 100%;\n box-sizing: border-box;\n display: flex;\n z-index: 15;\n }\n }\n }\n}\n\n.gallery-thumbnails {\n div.pro-gallery {\n .gallery-item-container {\n .gallery-item-wrapper {\n .gallery-item-hover {\n padding: 30px 60px;\n }\n }\n }\n }\n}\n\n.gallery-slider {\n div.pro-gallery {\n .gallery-item-container {\n .gallery-item-wrapper {\n .gallery-item-hover {\n padding: 30px 10px 50px;\n }\n }\n }\n }\n}\n\n.gallery-columns {\n div.pro-gallery {\n .gallery-item-container {\n .gallery-item-wrapper {\n .gallery-item-hover {\n padding: 30px;\n }\n }\n }\n }\n}\n\ndiv.pro-gallery {\n width: 100%;\n height: 100%;\n overflow: hidden;\n backface-visibility: hidden;\n position: relative;\n\n .gallery-column {\n float: left;\n overflow: hidden;\n position: relative;\n transform-style: preserve-3d;\n backface-visibility: hidden;\n\n .gallery-left-padding {\n display: inline-block;\n height: 100%;\n }\n\n .gallery-top-padding {\n display: block;\n width: 100%;\n }\n }\n\n .gallery-group {\n float: left;\n overflow: hidden;\n position: relative;\n transform-style: preserve-3d;\n backface-visibility: hidden;\n box-sizing: border-box;\n padding: 0;\n font-family: $font-light;\n font-size: 11px;\n\n &.debug {\n &.gallery-group-gone {\n background: $lighter-gray;\n }\n\n &.gallery-group-visible {\n background: $light-green;\n }\n\n &.gallery-group-hidden {\n background: $light-red;\n }\n }\n }\n\n .gallery-item-container {\n position: absolute;\n display: inline-block;\n vertical-align: top;\n border: none;\n padding: 0;\n border-radius: 0;\n box-sizing: border-box;\n overflow: hidden;\n transform-style: preserve-3d;\n backface-visibility: hidden;\n outline: none;\n text-decoration: none;\n color: inherit;\n will-change: top, left, width, height;\n box-sizing: border-box;\n font-family: $font-light;\n font-size: 11px;\n cursor: default;\n scroll-snap-align: center;\n .item-action {\n width: 1px;\n height: 1px;\n overflow: hidden;\n position: absolute;\n pointer-events: none;\n z-index: -1;\n &:focus {\n --focus-ring-box-shadow: none !important;\n outline: none !important;\n box-shadow: none !important;\n }\n }\n &:hover {\n .gallery-item-common-info {\n cursor: pointer;\n\n button {\n text-decoration: underline;\n cursor: pointer;\n }\n }\n }\n\n &.visible {\n transform: translate3d(0, 0, 0);\n }\n\n &.clickable {\n cursor: pointer;\n }\n\n .gallery-item-wrapper {\n position: relative;\n width: 100%;\n height: 100%;\n overflow: hidden;\n\n .item-with-secondary-media-container {\n .secondary-media-item {\n position: absolute;\n z-index: 1;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n .gallery-item {\n object-fit: cover;\n }\n .text-item > div {\n width: 100% !important;\n height: 100% !important;\n }\n }\n }\n\n &.transparent,\n &.cube-type-fit {\n background: transparent;\n }\n\n .gallery-item-preload {\n display: none;\n }\n\n &.cube-type-fit .gallery-item {\n background: transparent;\n object-fit: contain;\n }\n\n .gallery-item {\n object-fit: cover;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n overflow: hidden;\n border-radius: 0;\n\n &.text-item {\n\n box-sizing: border-box;\n /! autoprefixer: ignore next /\n -webkit-font-smoothing: antialiased;\n white-space: initial;\n\n .te-pro-gallery-text-item {\n line-height: normal !important;\n letter-spacing: normal !important;\n }\n\n > div {\n background: initial !important;\n box-sizing: border-box;\n }\n\n p,\n span,\n div,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n i {\n margin: 0;\n padding: 0;\n }\n\n }\n\n .pro-circle-preloader {\n top: 50%;\n left: 50%;\n height: 30px;\n width: 15px;\n z-index: -1;\n opacity: 0.4;\n }\n\n img.gallery--placeholder-item {\n width: 100% !important;\n height: 100% !important;\n object-fit: cover;\n object-position: center;\n }\n\n &.gallery-item-loaded {\n background-color: transparent;\n opacity: 1 !important;\n // filter: none !important;\n animation: none !important;\n\n &.image-item:after {\n display: none !important;\n }\n\n ~.pro-circle-preloader {\n display: none;\n }\n }\n\n &.error {\n opacity: 0 !important;\n }\n\n &.gallery-item-preloaded {\n background-size: cover;\n background-repeat: no-repeat;\n background-position: center center;\n\n &.grid-fit {\n background-size: contain;\n }\n }\n &.gallery-item-3d-placeholder {\n &.three-d-loaded {\n img {\n opacity: 0;\n pointer-events: none;\n }\n }\n &.three-d-loading {\n img {\n opacity: 1;\n }\n }\n img {\n transition: opacity .2s ease;\n }\n }\n &.gallery-item-video {\n overflow: hidden;\n text-align: center; //for grid crop\n\n iframe {\n left: 0;\n top: 0;\n }\n &.playedOnce {\n ~ .image-item {\n pointer-events: none;\n opacity: 0;\n transition: opacity .2s ease;\n }\n }\n }\n &.gallery-item-video, &.gallery-item-3d-placeholder, &.thumbnailItem {\n\n &.playing {\n\n button,\n i {\n display: none;\n }\n }\n\n button,\n i {\n display: inline-block;\n text-rendering: auto;\n /! autoprefixer: ignore next /\n -webkit-font-smoothing: antialiased;\n position: absolute;\n z-index: 11;\n top: 50%;\n left: 50%;\n height: 60px;\n text-align: center;\n margin: -30px 0 0 -30px;\n background: $bg-dark;\n color: $white;\n border-radius: 50px;\n opacity: 0.7;\n\n &.play-triangle {\n opacity: 1;\n }\n\n &.play-triangle,\n &.play-background {\n //padding-left: 6px;\n //width: 54px;\n //line-height: 58px;\n font-size: 26px;\n }\n\n &:hover {\n opacity: 0.9;\n }\n\n &:before {\n font-size: 2.3em;\n opacity: 1;\n }\n }\n }\n\n }\n\n .gallery-item-info {\n position: absolute;\n bottom: -220px;\n height: 220px;\n width: 100%;\n box-sizing: border-box;\n display: flex;\n //border-radius: $image-radius+px;\n z-index: 15;\n\n >div {\n height: 100%;\n width: 100%;\n }\n }\n\n .gallery-item-hover {\n white-space: initial;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n box-sizing: border-box;\n border-radius: 0;\n //border-radius: $image-radius+px;\n z-index: 15;\n overflow: hidden;\n .gallery-item-hover-inner {\n height: 100%;\n }\n\n &.no-hover-bg {\n &:before {\n opacity: 0 !important;\n }\n }\n\n &:before {\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n margin: 0;\n box-sizing: border-box;\n z-index: -1;\n }\n\n }\n\n }\n\n .gallery-item-common-info {\n box-sizing: border-box;\n cursor: pointer;\n }\n }\n .thumbnailItem {\n\n &.playing {\n\n button,\n i {\n display: none;\n }\n }\n\n button,\n i {\n display: inline-block;\n text-rendering: auto;\n /! autoprefixer: ignore next /\n -webkit-font-smoothing: antialiased;\n position: absolute;\n z-index: 11;\n top: 50%;\n left: 50%;\n height: 28px;\n width: 28px;\n text-align: center;\n margin: -16px -1px 0 -16px;\n background: $bg-dark;\n color: $white;\n border-radius: 100%;\n opacity: 0.7;\n\n &.play-triangle {\n opacity: 1;\n }\n\n &:before {\n font-size: 2.3em;\n opacity: 1;\n }\n }\n }\n &.one-row {\n //overflow-x: scroll;\n white-space: nowrap;\n float: left;\n\n .gallery-column {\n width: 100%;\n float: none;\n //overflow-x: scroll;\n white-space: nowrap;\n\n .gallery-group {\n display: inline-block;\n float: none;\n }\n }\n\n &.slider {\n .gallery-column {\n overflow-x: scroll;\n\n &.scroll-snap {\n scroll-snap-type: x mandatory;\n }\n\n }\n }\n\n .gallery-horizontal-scroll-inner {\n position: relative;\n will-change: transform;\n }\n }\n\n &.thumbnails-gallery {\n overflow: hidden;\n float: left;\n\n .galleryColumn {\n position: relative;\n overflow: visible;\n }\n\n .thumbnailItem {\n position: absolute;\n background-color: white;\n background-size: cover;\n background-position: center;\n overflow-y: inherit;\n border-radius: 0px;\n cursor: pointer;\n \n &.pro-gallery-highlight::after {\n content: '';\n display: block;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n background-color: rgba(255, 255, 255, .6);\n }\n }\n }\n\n @media (max-width: 500px) {\n &.thumbnails-gallery {\n overflow: visible;\n }\n }\n\n *:focus {\n box-shadow: none; //remove wix's default blue shadow\n }\n\n &.accessible {\n\n i,\n button:not(.nav-arrows-container, .has-custom-focus) {\n &:focus {\n box-shadow: 0 0 0 1px $white, 0 0 1px 2px $wix-blue;\n }\n }\n\n .has-custom-focus {\n &:focus {\n box-shadow: inset 0 0 0 1px $white, inset 0 0 1px 4px $wix-blue;\n }\n }\n\n .gallery-item-hover {\n\n i,\n button {\n &:focus {\n box-shadow: none;\n }\n }\n }\n\n\n .thumbnailItem.pro-gallery-highlight::after {\n box-shadow: inset 0 0 1px 2px $wix-blue, inset 0 0 7px 0 $white, 0 0 10px -5px $wix-blue;\n }\n\n .gallery-item-container:has(.item-action:focus)::after {\n content: ' ';\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n box-shadow: inset 0 0 1px 2px $wix-blue, inset 0 0 7px 0 $white, inset 0 0 10px -5px $wix-blue;\n pointer-events: none;\n border-radius: inherit;\n z-index: 15;\n }\n\n .pro-gallery-thumbnails-highlighted::before {\n box-shadow: inset 0 0 1px 2px $wix-blue, inset 0 0 7px 0 $white, inset 0 0 10px -5px $wix-blue;\n }\n\n .pro-gallery-thumbnails-highlighted::after {\n content: ' ';\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n box-shadow: inset 0 0 1px 2px $wix-blue, inset 0 0 7px 0 $white, 0 0 10px -5px $wix-blue;\n pointer-events: none;\n border-radius: inherit;\n }\n }\n\n .hide-scrollbars {\n -ms-overflow-style: none;\n overflow: -moz-scrollbars-none;\n scrollbar-width: none;\n\n &::-webkit-scrollbar,\n ::-webkit-scrollbar {\n width: 0 !important;\n height: 0 !important;\n }\n }\n\n .rtl {\n direction: rtl;\n }\n .ltr {\n direction: ltr;\n }\n\n}\n\n.sr-only {\n &.out-of-view-component{\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip-path: circle(0%);\n border: 0;\n }\n}\n\n.screen-logs {\n word-wrap: break-word;\n background: $white;\n width: 280px;\n font-size: 10px;\n}\n\n.fade {\n display: block;\n transition: opacity 600ms ease;\n}\n\n.fade-visible {\n opacity: 1;\n}\n\n.fade-hidden {\n opacity: 0;\n}\n\n.deck-before {\n display: block;\n z-index: 1;\n transition: transform 600ms ease;\n transform: translateX(-(100%));\n}\n\n.deck-before-rtl {\n display: block;\n z-index: 1;\n transition: transform 600ms ease;\n transform: translateX(100%);\n}\n\n.deck-current {\n display: block;\n z-index: 0;\n transition: transform 600ms ease;\n transform: translateX(0);\n\n .override {\n transition: transform 600ms ease, opacity 0.1s ease 200ms !important;\n }\n}\n\n.deck-after {\n display: block;\n transition: opacity .2s ease 600ms;\n z-index: -1;\n opacity: 0;\n\n .override {\n transition: opacity 0.1s ease 0s !important;\n }\n}\n\n.disabled-transition {\n transition: none !important;\n}\n\n@keyframes changing_background {\n 0% {\n background-color: rgba(241, 241, 241, 0.2);\n }\n\n 50% {\n background-color: rgba(241, 241, 241, 0.8);\n }\n\n 100% {\n background-color: rgba(241, 241, 241, 0.2);\n }\n}\n\n@mixin scroll-snap-element {\n content:'';\n position: absolute;\n scroll-snap-align: center;\n top: var(--group-top);\n left: var(--group-left);\n width: var(--group-width);\n right: var(--group-right);\n height: 1px;\n pointer-events: none;\n}\n\n$group-view: '[data-hook=\"group-view\"]';\n\n.pro-gallery-parent-container{\n &.gallery-slideshow #{$group-view}::before { \n @include scroll-snap-element;\n }\n &:not(.gallery-slideshow) {\n & #{$group-view} .item-link-wrapper::before { \n @include scroll-snap-element;\n }\n }\n} \n\n.gallery-item-container {\n scroll-snap-align: none !important;\n}\n\n.gallery-slideshow {\n .gallery-item-container:not(.clickable) a {\n cursor: default;\n }\n}"]}