Skip to content

Commit

Permalink
Improve Testimonial Widget style.
Browse files Browse the repository at this point in the history
  • Loading branch information
sonvnn committed Jul 23, 2024
1 parent 2df408c commit 028f05a
Show file tree
Hide file tree
Showing 5 changed files with 62 additions and 27 deletions.
12 changes: 11 additions & 1 deletion assets/vendor/astroid/scss/utilities/_carousel.scss
Original file line number Diff line number Diff line change
Expand Up @@ -67,12 +67,22 @@
content: "\f053";
}
}
&.nav-outside {
.slick-next {
right: auto;
left: 100%;
}
.slick-prev {
left: auto;
right: 100%;
}
}

.slick-dots {
display: block;
width: 100%;
padding: 0;
margin: 10px 0 0;
margin: 10px -6px 0;
list-style: none;
text-align: center;
li {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,6 @@
defined('_JEXEC') or die;
extract($displayData);
$item = $options['article'];
if ($item->other_params->get('show_page_heading')) {
if (isset($item->other_params) && $item->other_params->get('show_page_heading')) {
echo '<h1>'.$item->other_params->get('page_heading').'</h1>';
}
57 changes: 32 additions & 25 deletions framework/elements/testimonials/testimonials.php
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
defined('_JEXEC') or die;
use Joomla\CMS\Factory;
use Astroid\Helper\Style;
use Astroid\Helper;

extract($displayData);
$testimonials = $params->get('testimonials', '');
Expand All @@ -28,14 +29,14 @@
$enable_slider = $params->get('enable_slider', 0);
$slider_autoplay = $params->get('slider_autoplay', 0);
$slider_nav = $params->get('slider_nav', 1);
$nav_position = $params->get('nav_position', '');
$nav_position = $nav_position !== '' ? ' ' . $nav_position : $nav_position;
$slider_dotnav = $params->get('slider_dotnav', 0);
$dot_alignment = $params->get('dot_alignment', '');
$interval = $params->get('interval', 3);
$slide_settings = array();
$slide_responsive = array();

$style = new Style('#'. $element->id);
$style_dark = new Style('#'. $element->id, 'dark');

$row_column_cls = 'row';

$xxl_column = $params->get('xxl_column', '');
Expand Down Expand Up @@ -206,12 +207,17 @@

$overlay_text_color = $params->get('overlay_text_color', '');
$overlay_text_color = $overlay_text_color !== '' ? ' ' . $overlay_text_color : '';
echo '<div class="astroid-grid '.($enable_slider ? 'astroid-slick opacity-0' : $row_column_cls).$gutter_cls.$overlay_text_color.'">';
echo '<div class="astroid-grid '.($enable_slider ? 'astroid-slick opacity-0' . $nav_position : $row_column_cls).$gutter_cls.$overlay_text_color.'">';
foreach ($testimonials as $key => $testimonial) {
$testimonial_params = Style::getSubFormParams($testimonial->params);
$media = '<div class="as-author-avatar d-inline-block position-relative overflow-hidden' . $image_border_radius . $box_shadow . $hover_effect . $transition . '">';
$media .= '<img class="' . ($avatar_position == 'left' || $avatar_position == 'right' ? 'object-fit-cover w-100 h-100 ' : '') .'" src="'. Astroid\Helper\Media::getPath() . '/' . $testimonial_params['avatar'].'" alt="'.$testimonial_params['title'].'">';
$media .= '</div>';
$testimonial_params = Helper::loadParams($testimonial->params);
$avatar = $testimonial_params->get('avatar', '');
$media = '';
if ($avatar) {
$media = '<div class="as-author-avatar d-inline-block position-relative overflow-hidden' . $image_border_radius . $box_shadow . $hover_effect . $transition . '">';
$media .= '<img class="' . ($avatar_position == 'left' || $avatar_position == 'right' ? 'object-fit-cover w-100 h-100 ' : '') .'" src="'. Astroid\Helper\Media::getPath() . '/' . $avatar .'" alt="'.$testimonial_params->get('title', '').'">';
$media .= '</div>';
}


echo '<div id="testimonial-'. $testimonial -> id .'"><div class="card' . $card_style . $box_shadow . $box_shadow_hover .$bd_radius . $card_hover_transition . ($enable_grid_match ? ' h-100' : '') . '">';
if ($avatar_position == 'left' || $avatar_position == 'right') {
Expand All @@ -231,23 +237,23 @@
if ($avatar_position == 'top') {
echo $media;
}
if (!empty($testimonial_params['message'])) {
echo '<div class="as-author-message">' . $testimonial_params['message'] . '</div>';
if (!empty($testimonial_params->get('message', ''))) {
echo '<div class="as-author-message">' . $testimonial_params->get('message', '') . '</div>';
}
if ($avatar_position == 'bottom') {
echo $media;
}
if (!empty($testimonial_params['designation']) && $designation_position == 'before') {
echo '<div class="as-author-designation">' . $testimonial_params['designation'] . '</div>';
if (!empty($testimonial_params->get('designation', '')) && $designation_position == 'before') {
echo '<div class="as-author-designation">' . $testimonial_params->get('designation', '') . '</div>';
}
if (!empty($testimonial_params['title'])) {
echo '<'.$title_html_element.' class="as-author-name">'. $testimonial_params['title'] . '</'.$title_html_element.'>';
if (!empty($testimonial_params->get('title', ''))) {
echo '<'.$title_html_element.' class="as-author-name">'. $testimonial_params->get('title', '') . '</'.$title_html_element.'>';
}
if (!empty($testimonial_params['designation']) && $designation_position == 'after') {
echo '<div class="as-author-designation">' . $testimonial_params['designation'] . '</div>';
if (!empty($testimonial_params->get('designation', '')) && $designation_position == 'after') {
echo '<div class="as-author-designation">' . $testimonial_params->get('designation', '') . '</div>';
}
if (!empty($testimonial_params['link']) && !empty($testimonial_params['link_title'])) {
echo '<a class="as-author-url" href="'.$testimonial_params['link'].'" target="_blank">' . $testimonial_params['link_title'] . '</a>';
if (!empty($testimonial_params->get('link', '')) && !empty($testimonial_params->get('link_title', ''))) {
echo '<a class="as-author-url" href="'.$testimonial_params->get('link', '').'" target="_blank">' . $testimonial_params->get('link_title', '') . '</a>';
}

echo '</div>'; // End Card-Body
Expand All @@ -274,33 +280,34 @@
if (!empty($card_padding)) {
$padding = \json_decode($card_padding, false);
foreach ($padding as $device => $props) {
$style->child('.card-size-custom')->addStyle(Style::spacingValue($props, "padding"), $device);
$element->style->child('.card-size-custom')->addStyle(Style::spacingValue($props, "padding"), $device);
}
}
}
if (!empty($image_max_width)) {
$style->child('.as-author-avatar > img')->addCss('max-width', $image_max_width . 'px');
$element->style->child('.as-author-avatar > img')->addCss('max-width', $image_max_width . 'px');
}
if (!empty($title_heading_margin)) {
$margin = \json_decode($title_heading_margin, false);
foreach ($margin as $device => $props) {
$style->child('.as-author-name')->addStyle(Style::spacingValue($props, "margin"), $device);
$element->style->child('.as-author-name')->addStyle(Style::spacingValue($props, "margin"), $device);
}
}
if (!empty($designation_heading_margin)) {
$margin = \json_decode($designation_heading_margin, false);
foreach ($margin as $device => $props) {
$style->child('.as-author-designation')->addStyle(Style::spacingValue($props, "margin"), $device);
$element->style->child('.as-author-designation')->addStyle(Style::spacingValue($props, "margin"), $device);
}
}
if (!empty($content_margin)) {
$margin = \json_decode($content_margin, false);
foreach ($margin as $device => $props) {
$style->child('.as-author-message')->addStyle(Style::spacingValue($props, "margin"), $device);
$element->style->child('.as-author-message')->addStyle(Style::spacingValue($props, "margin"), $device);
}
}
if (!empty($image_border)) {
Style::addBorderStyle('#'. $element->id . ' .as-author-avatar', $image_border);
}
$style->render();
$style_dark->render();
if (!empty($dot_alignment)) {
$element->style->child('.astroid-slick .slick-dots')->addCss('text-align', $dot_alignment);
}
10 changes: 10 additions & 0 deletions framework/elements/testimonials/testimonials.xml
Original file line number Diff line number Diff line change
Expand Up @@ -365,7 +365,17 @@
<field astroidgroup="slider_options" ngShow="[enable_slider]==1" name="slider_autoplay" type="astroidradio" astroid-switch="true" default="0" label="ASTROID_WIDGET_AUTOPLAY"/>
<field astroidgroup="slider_options" ngShow="[enable_slider]==1 AND [slider_autoplay]==1" name="interval" type="astroidrange" min="1" max="10" step="1" default="3" label="ASTROID_WIDGET_INTERVAL" postfix="seconds" />
<field astroidgroup="slider_options" ngShow="[enable_slider]==1" name="slider_nav" type="astroidradio" astroid-switch="true" default="1" label="ASTROID_WIDGET_NAVIGATION"/>
<field astroidgroup="slider_options" ngShow="[enable_slider]==1 AND [slider_nav]==1" type="astroidlist" name="nav_position" label="ASTROID_WIDGET_NAV_POSITION" default="">
<option value="">ASTROID_WIDGET_NAV_POSITION_INSIDE</option>
<option value="nav-outside">ASTROID_WIDGET_NAV_POSITION_OUTSIDE</option>
</field>
<field astroidgroup="slider_options" ngShow="[enable_slider]==1" name="slider_dotnav" type="astroidradio" astroid-switch="true" default="0" label="ASTROID_WIDGET_DOT_NAVIGATION"/>
<field astroidgroup="slider_options" ngShow="[enable_slider]==1 AND [slider_dotnav]==1" type="astroidlist" name="dot_alignment" label="ASTROID_WIDGET_DOT_ALIGNMENT" default="">
<option value="">JGLOBAL_INHERIT</option>
<option value="left">JGLOBAL_LEFT</option>
<option value="center">JGLOBAL_CENTER</option>
<option value="right">JGLOBAL_RIGHT</option>
</field>

<field astroidgroup="avatar_options" type="astroidlist" name="avatar_position" label="ASTROID_WIDGET_TESTIMONIALS_AVATAR_POSITION_LABEL" default="top">
<option value="top">ASTROID_TOP</option>
Expand Down
8 changes: 8 additions & 0 deletions language/en-GB/en-GB.astroid.ini
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ ASTROID_HOURS="Hours"
ASTROID_MINUTES="Minutes"
ASTROID_SECONDS="Seconds"
ASTROID_BACK="Back"
ASTROID_POSITION="Position"
TPL_ASTROID_CONTAINER="Container"
TPL_ASTROID_MODULE_POSITION_LABEL="Module Position"
TPL_ASTROID_SITE_MODULE_POSITION_LABEL="Site Module Position"
Expand Down Expand Up @@ -891,6 +892,9 @@ ASTROID_ARTICLE_LEAD_HEADING_FONTSIZE_LABEL="Lead Heading Fontsize"
ASTROID_ARTICLE_LEAD_HEADING_FONTSIZE_DESC="Fontsize of Lead items in Category Blog Layout"
ASTROID_ARTICLE_INTRO_HEADING_FONTSIZE_LABEL="Intro Heading Fontsize"
ASTROID_ARTICLE_INTRO_HEADING_FONTSIZE_DESC="Fontsize of Intro items in Category Blog Layout"
ASTROID_ARTICLE_POSTION_ABOVE_TITLE="Above Title"
ASTROID_ARTICLE_POSTION_BEFORE_CONTENT="Before Content"
ASTROID_ARTICLE_POSTION_AFTER_CONTENT="After Content"

; Author
ASTROID_AUTHOR_PROFILE_TAB_LABEL="<span><span style='background-image: linear-gradient( 109.6deg, rgba(133,253,174,1) 11.2%, rgba(114,173,255,1) 91.1% ); display: inline-block; width: 10px; height: 10px; border-radius: 10px;'></span> Author Profile</span>"
Expand Down Expand Up @@ -1493,6 +1497,10 @@ ASTROID_WIDGET_XS_COLUMN_AVATAR_WIDTH="Avatar Width X-Small Screen"
ASTROID_WIDGET_NAME_LABEL="Name"
ASTROID_WIDGET_AVATAR_LABEL="Avatar"
ASTROID_WIDGET_MESSAGE_LABEL="Message"
ASTROID_WIDGET_DOT_ALIGNMENT="Dots Alignment"
ASTROID_WIDGET_NAV_POSITION="Navigation Position"
ASTROID_WIDGET_NAV_POSITION_INSIDE="Inside"
ASTROID_WIDGET_NAV_POSITION_OUTSIDE="Outside"

; Map
ASTROID_WIDGET_MAP_LABEL="Map"
Expand Down

0 comments on commit 028f05a

Please sign in to comment.