@import "../../../base/less/mixins";
.widget-function('import_google_font');
@testimonial_padding: 10px;
@testimonial_background: transparent;
@text_background: #f0f0f0;
@text_color: #666;
@text_border_radius: 4px;
@title_font_family: default;
@title_font_weight: default;
@title_font_size: default;
@name_font_family: default;
@name_font_weight: default;
@name_font_size: default;
@location_font_family: default;
@location_font_weight: default;
@location_font_size: default;
@text_font_family: default;
@text_font_weight: default;
@text_font_size: default;
// Testimonial sizes
@testimonial_size: 33.333%;
@tablet_testimonial_size: 50%;
@mobile_testimonial_size: 100%;
// Image Sizes
@image_size: 75px;
@tablet_image_size: default;
@mobile_image_size: default;
// Responsive breakpoints
@tablet_width: 800px;
@mobile_width: 480px;
.widget-title {
font-family: @title_font_family;
font-weight: @title_font_weight;
font-size: @title_font_size;
}
.sow-testimonials {
.sow-testimonial-wrapper {
width: @testimonial_size;
@media screen and (max-width: @tablet_width) {
width: @tablet_testimonial_size;
}
@media screen and (max-width: @mobile_width) {
width: @mobile_testimonial_size;
}
}
.sow-testimonial {
background: @testimonial_background;
}
.sow-testimonial-name {
font-family: @name_font_family;
font-weight: @name_font_weight;
font-size: @name_font_size;
}
.sow-testimonial-location {
font-family: @location_font_family;
font-weight: @location_font_weight;
font-size: @location_font_size;
}
.sow-testimonial-text {
font-family: @text_font_family;
font-weight: @text_font_weight;
font-size: @text_font_size;
background: @text_background;
color: @text_color;
padding: @testimonial_padding @testimonial_padding*1.5;
.rounded(@text_border_radius);
}
.sow-round-image-frame {
border-radius: @image_size;
width: @image_size;
height: @image_size;
@media screen and (max-width: @tablet_width) {
width: @tablet_image_size;
height: @tablet_image_size;
}
@media screen and (max-width: @mobile_width) {
width: @mobile_image_size;
height: @mobile_image_size;
}
}
// All the specific layouts
.sow-testimonial-wrapper {
.clearfix();
&.sow-layout-side {
&.sow-user-left,
&.sow-user-middle {
.sow-testimonial-user {
width: 33%;
float: left;
padding: @testimonial_padding @testimonial_padding*2 @testimonial_padding @testimonial_padding;
img {
margin: 0 auto;
max-width: 100%;
height: auto;
@media screen and (max-width: @tablet_width) {
width: @tablet_image_size;
}
@media screen and (max-width: @mobile_width) {
width: @mobile_image_size;
}
}
}
.sow-testimonial-text {
margin-left: 33%;
}
}
&.sow-user-right {
.sow-testimonial-user {
width: 33%;
float: right;
padding: @testimonial_padding @testimonial_padding @testimonial_padding @testimonial_padding*2;
img {
width: @image_size;
margin: 0 auto;
max-width: 100%;
height: auto;
}
}
.sow-testimonial-text {
margin-right: 33%;
}
}
}
&.sow-layout-text-above,
&.sow-layout-text-below {
.sow-testimonial-user {
width: auto;
padding: @testimonial_padding;
img {
width: @image_size;
height: auto;
}
}
.sow-testimonial-text {
}
}
&.sow-layout-text-below {
.sow-testimonial-user {
padding:@testimonial_padding;
}
}
}
}