diff --git a/assets/vendor/astroid/scss/widgets/_imagegroup.scss b/assets/vendor/astroid/scss/widgets/_imagegroup.scss new file mode 100644 index 00000000..c1ece7ef --- /dev/null +++ b/assets/vendor/astroid/scss/widgets/_imagegroup.scss @@ -0,0 +1,28 @@ +.astroid-imagegroup { + .as-image-group-item { + .astroid-heading { + opacity: 0; + transform:translate3d(0,100%,0); + transition: opacity 600ms, transform 600ms; + z-index: 1; + } + &:hover { + .astroid-heading { + opacity: 1; + transform:translateZ(0) + } + } + } + .astroid-image-overlay-cover { + &:after { + pointer-events: none; + opacity: 0; + transition: opacity 600ms; + } + &:hover { + &:after { + opacity: 1; + } + } + } +} \ No newline at end of file diff --git a/assets/vendor/astroid/scss/widgets/_widgets.scss b/assets/vendor/astroid/scss/widgets/_widgets.scss index e9ce517e..4414478a 100644 --- a/assets/vendor/astroid/scss/widgets/_widgets.scss +++ b/assets/vendor/astroid/scss/widgets/_widgets.scss @@ -4,4 +4,5 @@ @import "slideshow"; @import "list"; @import "articles_listing"; -@import "listing_pro"; \ No newline at end of file +@import "listing_pro"; +@import "imagegroup"; \ No newline at end of file diff --git a/framework/elements/articles/articles.xml b/framework/elements/articles/articles.xml index 7bf14874..80682d9a 100644 --- a/framework/elements/articles/articles.xml +++ b/framework/elements/articles/articles.xml @@ -462,6 +462,9 @@ +
+ +
diff --git a/framework/elements/imagegroup/imagegroup.php b/framework/elements/imagegroup/imagegroup.php index ccbc08ef..e8106f50 100644 --- a/framework/elements/imagegroup/imagegroup.php +++ b/framework/elements/imagegroup/imagegroup.php @@ -160,12 +160,21 @@ $box_shadow = $params->get('box_shadow', ''); $box_shadow = $box_shadow !== '' ? ' ' . $box_shadow : ''; $hover_effect = $params->get('hover_effect', ''); -$hover_effect = $hover_effect !== '' ? ' as-effect-' . $hover_effect : ''; +$hover_effect_cls = $hover_effect !== '' ? ' as-effect-' . $hover_effect : ' astroid-image-overlay-cover'; $transition = $params->get('hover_transition', ''); $transition = $transition !== '' ? ' as-transition-' . $transition : ''; $text_color_mode = $params->get('text_color_mode', ''); $text_color_mode = $text_color_mode !== '' ? ' ' . $text_color_mode : ''; + +$display_title = $params->get('display_title', 0); +$title_html_element = $params->get('title_html_element', 'h3'); +$title_font_style = $params->get('title_font_style'); +if (!empty($display_title) && !empty($title_font_style)) { + Style::renderTypography('#'.$element->id.' .astroid-heading', $title_font_style); +} + +$overlay_type = $params->get('overlay_type', ''); echo '
'; foreach ($images as $image) { $image_params = Style::getSubFormParams($image->params); @@ -176,8 +185,9 @@ } elseif ($use_lightbox) { echo ''; } - echo '
'; + echo '
'; echo ''.$image_params['title'].''; + echo !empty($display_title) && !empty($image_params['title']) ? '<'.$title_html_element.' class="astroid-heading position-absolute bottom-0 w-100 p-5 m-0 pe-none">'. $image_params['title'] .'' : ''; echo '
'; if ($image_params['use_link'] || $use_lightbox) { echo ''; @@ -205,4 +215,20 @@ } else { $element->style->child('.as-image-cover')->addCss('height', $min_height . 'px'); } +} + +if ($hover_effect == '') { + switch ($overlay_type) { + case 'color': + $overlay_color = Style::getColor($params->get('overlay_color', '')); + $element->style->child('.astroid-image-overlay-cover:after')->addCss('background-color', $overlay_color['light']); + $element->style_dark->child('.astroid-image-overlay-cover:after')->addCss('background-color', $overlay_color['dark']); + break; + case 'gradient': + $overlay_gradient = $params->get('overlay_gradient', ''); + if (!empty($overlay_gradient)) { + $element->style->child('.astroid-image-overlay-cover:after')->addCss('background-image', Style::getGradientValue($overlay_gradient)); + } + break; + } } \ No newline at end of file diff --git a/framework/elements/imagegroup/imagegroup.xml b/framework/elements/imagegroup/imagegroup.xml index f30404eb..38f98727 100644 --- a/framework/elements/imagegroup/imagegroup.xml +++ b/framework/elements/imagegroup/imagegroup.xml @@ -11,6 +11,7 @@ +
@@ -247,6 +248,13 @@ + + + + + + + @@ -277,6 +285,17 @@ + + + + + + + + + + +
diff --git a/language/en-GB/en-GB.astroid.ini b/language/en-GB/en-GB.astroid.ini index 585ceff7..a5214cf1 100644 --- a/language/en-GB/en-GB.astroid.ini +++ b/language/en-GB/en-GB.astroid.ini @@ -1573,6 +1573,7 @@ ASTROID_WIDGET_ARTICLES_ENABLE_SLIDER="Display Articler as Slider" ASTROID_WIDGET_IMAGE_GROUP_LABEL="Image Group" ASTROID_WIDGET_IMAGE_GROUP_DESC="Display image group with different styles" ASTROID_WIDGET_IMAGES_LABEL="Images" +ASTROID_WIDGET_DISPLAY_TITLE="Display Title" ; Testimonials ASTROID_WIDGET_TESTIMONIALS_LABEL="Testimonials"