Лагерь: Отзывы
This commit is contained in:
parent
9b44b1ac4e
commit
999ff72c7e
@ -1886,89 +1886,183 @@ html {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* contact END */
|
/* contact END */
|
||||||
/* reviews */
|
/* ═══════════════════════════════════════════════
|
||||||
.camp-reviews-wrapper {
|
REVIEWS — Yandex-style via lazeweb utilities
|
||||||
position: relative;
|
═══════════════════════════════════════════════ */
|
||||||
|
.lw-scroll-x {
|
||||||
|
overflow-x: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
padding-bottom: 8px;
|
||||||
|
}
|
||||||
|
.lw-scroll-x::-webkit-scrollbar {
|
||||||
|
height: 6px;
|
||||||
|
}
|
||||||
|
.lw-scroll-x::-webkit-scrollbar-thumb {
|
||||||
|
background: #ccc;
|
||||||
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .reviews__item-client_name {
|
.lw-grid {
|
||||||
font-size: 16px;
|
display: grid;
|
||||||
font-weight: 400;
|
}
|
||||||
text-align: start;
|
.lw-grid--3 {
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
}
|
||||||
|
.lw-grid--2 {
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
}
|
||||||
|
.lw-gap-20 {
|
||||||
|
gap: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .reviews__item-client_text {
|
.lw-flex {
|
||||||
text-align: start;
|
display: flex;
|
||||||
line-height: 1.4;
|
}
|
||||||
font-size: 16px;
|
.lw-flex--row {
|
||||||
font-weight: 400;
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
.lw-flex--col {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.lw-gap-12 {
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
.lw-gap-8 {
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
.lw-items-center {
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.lw-justify-between {
|
||||||
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .reviews-wrapper {
|
.lw-card {
|
||||||
margin-top: 0;
|
background: #fff;
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: 20px;
|
||||||
|
box-shadow: 0 2px 12px rgba(0,0,0,0.06);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
transition: box-shadow .2s;
|
||||||
|
}
|
||||||
|
.lw-card:hover {
|
||||||
|
box-shadow: 0 4px 20px rgba(0,0,0,0.1);
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .reviews__item,
|
.lw-avatar {
|
||||||
.camp-reviews-wrapper .reviews__item-wrapper {
|
border-radius: 50%;
|
||||||
min-height: auto;
|
overflow: hidden;
|
||||||
width: 100%;
|
flex-shrink: 0;
|
||||||
|
background: #e8f5e9;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
}
|
}
|
||||||
.camp-reviews-wrapper .reviews__item-wrapper:before {
|
.lw-avatar--48 {
|
||||||
display: none;
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
}
|
}
|
||||||
.camp-reviews-wrapper .custom-button-next,
|
.lw-avatar__img {
|
||||||
.camp-reviews-wrapper .custom-button-prev {
|
width: 100%;
|
||||||
position: absolute;
|
height: 100%;
|
||||||
top: var(--swiper-navigation-top-offset, 50%);
|
object-fit: cover;
|
||||||
width: 54px;
|
display: block;
|
||||||
height: 54px;
|
|
||||||
margin-top: calc(0px -(var(--swiper-navigation-size) / 2));
|
|
||||||
z-index: 10;
|
|
||||||
cursor: pointer;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
color: var(--swiper-navigation-color, var(--swiper-theme-color));
|
|
||||||
background-image: none;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .custom-button-next {
|
.lw-text-dark {
|
||||||
right: -50px;
|
color: #1c2b2d;
|
||||||
}
|
}
|
||||||
.camp-reviews-wrapper .custom-button-prev {
|
.lw-text-gray {
|
||||||
left: -50px;
|
color: #888;
|
||||||
|
}
|
||||||
|
.lw-text-sm {
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
.lw-text-xs {
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
.lw-font-medium {
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
.lw-font-semibold {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.lw-font-bold {
|
||||||
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .custom-button-next:after {
|
.lw-mt-8 {
|
||||||
content: 'next';
|
margin-top: 8px;
|
||||||
|
}
|
||||||
|
.lw-mb-8 {
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
.lw-mb-12 {
|
||||||
|
margin-bottom: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .custom-button-next:after,
|
.lw-badge {
|
||||||
.camp-reviews-wrapper .custom-button-prev:after {
|
display: inline-flex;
|
||||||
font-family: swiper-icons;
|
align-items: center;
|
||||||
color: #fff;
|
padding: 4px 10px;
|
||||||
font-weight: 600;
|
border-radius: 50px;
|
||||||
font-size: 26px;
|
font-size: 11px;
|
||||||
padding: 5px;
|
font-weight: 600;
|
||||||
border-radius: 50%;
|
line-height: 1.2;
|
||||||
height: 54px;
|
white-space: nowrap;
|
||||||
width: 54px;
|
margin-left: auto;
|
||||||
display: flex;
|
flex-shrink: 0;
|
||||||
background: #3bb273;
|
}
|
||||||
align-items: center;
|
.lw-badge--verified {
|
||||||
justify-content: center;
|
background: #e8f5e9;
|
||||||
|
color: #2e7d32;
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .custom-button-next:after {
|
.lw-stars {
|
||||||
content: 'next';
|
display: flex;
|
||||||
|
gap: 2px;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.lw-star {
|
||||||
|
color: #e0e0e0;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.lw-star--filled {
|
||||||
|
color: #FFD43E;
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .custom-button-prev:after {
|
.lw-card__text {
|
||||||
content: 'prev';
|
font-size: 14px;
|
||||||
|
line-height: 1.55;
|
||||||
|
color: #444;
|
||||||
|
word-break: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .swiper-button-disabled {
|
@media (max-width: 768px) {
|
||||||
opacity: 0;
|
.lw-grid--3,
|
||||||
|
.lw-grid--2 {
|
||||||
|
display: flex;
|
||||||
|
gap: 16px;
|
||||||
|
overflow-x: auto;
|
||||||
|
scroll-snap-type: x mandatory;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
padding-bottom: 4px;
|
||||||
|
}
|
||||||
|
.lw-grid--3 .lw-card,
|
||||||
|
.lw-grid--2 .lw-card {
|
||||||
|
flex: 0 0 300px;
|
||||||
|
scroll-snap-align: start;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 480px) {
|
||||||
|
.lw-grid--3 .lw-card,
|
||||||
|
.lw-grid--2 .lw-card {
|
||||||
|
flex: 0 0 260px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* reviews END*/
|
/* reviews END*/
|
||||||
@ -2665,29 +2759,6 @@ html {
|
|||||||
height: clamp(292px, 37.5vw, 450px);
|
height: clamp(292px, 37.5vw, 450px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.camp-reviews-wrapper .reviews__item-client_name {
|
|
||||||
font-size: clamp(10px, 1.33vw, 16px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.camp-reviews-wrapper .reviews__item-client_text {
|
|
||||||
font-size: clamp(10px, 1.33vw, 16px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.camp-reviews-wrapper .custom-button-next,
|
|
||||||
.camp-reviews-wrapper .custom-button-prev {
|
|
||||||
width: clamp(35px, 4.5vw, 54px);
|
|
||||||
height: clamp(35px, 4.5vw, 54px);
|
|
||||||
margin-top: calc(1px -(var(--swiper-navigation-size) / 2));
|
|
||||||
}
|
|
||||||
|
|
||||||
.camp-reviews-wrapper .custom-button-next:after,
|
|
||||||
.camp-reviews-wrapper .custom-button-prev:after {
|
|
||||||
font-size: clamp(17px, 2.17vw, 26px);
|
|
||||||
padding: clamp(3px, .42vw, 5px);
|
|
||||||
height: clamp(35px, 4.5vw, 54px);
|
|
||||||
width: clamp(35px, 4.5vw, 54px);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (width < 780px) {
|
@media (width < 780px) {
|
||||||
@ -2909,11 +2980,6 @@ html {
|
|||||||
left: 10px;
|
left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.more .btn-more {
|
|
||||||
height: 24px;
|
|
||||||
background: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.faq-wrapper {
|
.faq-wrapper {
|
||||||
gap: 0;
|
gap: 0;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
@ -2964,14 +3030,6 @@ html {
|
|||||||
.mentors__item_img {
|
.mentors__item_img {
|
||||||
max-height: 195px;
|
max-height: 195px;
|
||||||
}
|
}
|
||||||
.camp-reviews-wrapper .custom-button-next {
|
|
||||||
right: -20px;
|
|
||||||
top: 40%;
|
|
||||||
}
|
|
||||||
.camp-reviews-wrapper .custom-button-prev {
|
|
||||||
left: -20px;
|
|
||||||
top: 40%;
|
|
||||||
}
|
|
||||||
.modal-mentors-wrapper {
|
.modal-mentors-wrapper {
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
@ -3027,12 +3085,6 @@ html {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
}
|
}
|
||||||
.camp-reviews-wrapper .custom-button-next:after, .camp-reviews-wrapper .custom-button-prev:after {
|
|
||||||
font-size: 12px;
|
|
||||||
height: 27px;
|
|
||||||
width: 27px;
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.modal-camp-request-form {
|
.modal-camp-request-form {
|
||||||
|
|||||||
@ -464,90 +464,63 @@ $metrics = [
|
|||||||
<section class="section-reveal section-bg camp-reviews" data-bg="white">
|
<section class="section-reveal section-bg camp-reviews" data-bg="white">
|
||||||
<h2 class="camp_title">Что говорят о нас родители</h2>
|
<h2 class="camp_title">Что говорят о нас родители</h2>
|
||||||
<?php
|
<?php
|
||||||
|
$key = array(
|
||||||
$key = [
|
array(
|
||||||
[
|
'key' => 'review_type',
|
||||||
'key' => 'review_type',
|
'value' => 'camp',
|
||||||
'value' => 'camp',
|
'compare' => '='
|
||||||
'compare' => '='
|
)
|
||||||
]
|
);
|
||||||
];
|
$args = array(
|
||||||
|
'posts_per_page' => -1,
|
||||||
?>
|
'post_type' => 'reviews',
|
||||||
<div class="camp-reviews-wrapper">
|
'orderby' => 'date',
|
||||||
<div class="reviews-wrapper">
|
'order' => 'DESC',
|
||||||
<div class='swiper reviews-owl'>
|
'suppress_filters' => true,
|
||||||
<div class='swiper-wrapper'>
|
'meta_query' => $key,
|
||||||
<?php
|
);
|
||||||
$args = array(
|
$the_query = new WP_Query($args);
|
||||||
'posts_per_page' => -1,
|
if ($the_query->have_posts()) :
|
||||||
'post_type' => 'reviews',
|
?>
|
||||||
'orderby' => 'date',
|
<div class="lw-scroll-x">
|
||||||
'order' => 'DESC',
|
<div class="lw-grid lw-grid--3 lw-gap-20">
|
||||||
'suppress_filters' => true,
|
<?php while ($the_query->have_posts()) : $the_query->the_post();
|
||||||
'meta_query' => $key,
|
$review_id = get_the_ID();
|
||||||
);
|
$avatar = carbon_get_post_meta($review_id, 'review_avatar');
|
||||||
$the_query = new WP_Query($args);
|
$stars = carbon_get_post_meta($review_id, 'review_star');
|
||||||
if ($the_query->have_posts()) :
|
$text = carbon_get_post_meta($review_id, 'review_text');
|
||||||
while ($the_query->have_posts()) : $the_query->the_post();
|
$date = get_the_date('d.m.Y');
|
||||||
|
$name = get_the_title();
|
||||||
$review_id = get_the_ID();
|
if (!$stars) $stars = 5;
|
||||||
|
if (!$text) continue;
|
||||||
$review_date = get_the_date( 'd.m.Y');
|
?>
|
||||||
$review_level = carbon_get_post_meta( $review_id, 'review_level' );
|
<div class="lw-card">
|
||||||
|
<div class="lw-flex lw-flex--row lw-gap-12 lw-items-center">
|
||||||
$avatar = carbon_get_post_meta( $review_id, 'review_avatar' );
|
<div class="lw-avatar lw-avatar--48">
|
||||||
|
<?php if ($avatar) : ?>
|
||||||
$stars = carbon_get_post_meta( $review_id, 'review_star' );
|
<img class="lw-avatar__img" src="<?php echo wp_get_attachment_url($avatar); ?>" alt="<?php echo esc_attr($name); ?>" loading="lazy">
|
||||||
$tekst_otzyva = carbon_get_post_meta( $review_id, 'review_text' );
|
<?php endif; ?>
|
||||||
$prepodavatel = carbon_get_post_meta( $review_id, 'review_teacher' );
|
|
||||||
|
|
||||||
$add_class= "more";
|
|
||||||
|
|
||||||
if ( strlen($tekst_otzyva) < 350 ) $add_class= "";
|
|
||||||
|
|
||||||
if ( $tekst_otzyva ) : ?>
|
|
||||||
<div class="swiper-slide reviews__item">
|
|
||||||
<div class="reviews__item-wrapper">
|
|
||||||
<div class="reviews__item-client">
|
|
||||||
<div class="reviews__item-client_avatar" style="background: <?php echo esc_attr(rand_color()); ?>">
|
|
||||||
<?php if ($avatar) : ?>
|
|
||||||
<img loading="lazy" width="57" height="57" class="reviews__item-client_avatar-img" src="<?php echo wp_get_attachment_url($avatar); ?>" alt="<?php echo get_post_meta( $avatar, '_wp_attachment_image_alt', true ); ?>">
|
|
||||||
<?php endif; ?>
|
|
||||||
</div>
|
|
||||||
<div class="reviews__item-client_data">
|
|
||||||
<div class="reviews__item-client_name"><?php the_title(); ?></div>
|
|
||||||
<div class="reviews__item-client_lavel" ><?php echo esc_html($review_level); ?></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="reviews__item-client_stars">
|
|
||||||
<?php
|
|
||||||
if (!$stars) $stars = 5;
|
|
||||||
for ($i = 1; $i <= $stars; $i++) { ?>
|
|
||||||
<svg width="20" height="20" viewBox="0 0 21 19" fill="none">
|
|
||||||
<path d="M9.58463 1.50884C9.89101 0.602477 11.1729 0.602476 11.4793 1.50884L13.1158 6.35007C13.2531 6.75637 13.6343 7.02985 14.0631 7.02985H19.2721C20.2504 7.02985 20.6467 8.28958 19.8447 8.84971L15.6995 11.7446C15.335 11.9991 15.1823 12.4636 15.3247 12.8847L16.9239 17.6158C17.233 18.5302 16.1954 19.3085 15.404 18.7559L11.1045 15.7533C10.7606 15.5131 10.3033 15.5131 9.95941 15.7533L5.65991 18.7559C4.86857 19.3085 3.83092 18.5302 4.14001 17.6158L5.73926 12.8847C5.8816 12.4636 5.72891 11.9991 5.36448 11.7446L1.21924 8.84971C0.417196 8.28958 0.813532 7.02985 1.79181 7.02985H7.00081C7.42969 7.02985 7.81081 6.75637 7.94815 6.35007L9.58463 1.50884Z" fill="#FFD43E" />
|
|
||||||
</svg>
|
|
||||||
<?php } ?>
|
|
||||||
<span><?php echo esc_html($review_date); ?></span>
|
|
||||||
</div>
|
|
||||||
<div class="reviews__item-client_text <?php echo esc_attr($add_class); ?>">
|
|
||||||
<?php echo wp_kses_post($tekst_otzyva); ?>
|
|
||||||
<button class="btn-more"><span onclick='this.parentNode.parentNode.classList.remove("more")'>... Читать еще</span></button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<?php
|
|
||||||
endif;
|
|
||||||
endwhile; ?>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="lw-flex lw-flex--col">
|
||||||
|
<div class="lw-text-dark lw-font-semibold"><?php echo esc_html($name); ?></div>
|
||||||
|
<div class="lw-text-xs lw-text-gray"><?php echo esc_html($date); ?></div>
|
||||||
|
</div>
|
||||||
|
<div class="lw-badge lw-badge--verified">Проверенный отзыв</div>
|
||||||
</div>
|
</div>
|
||||||
<?php endif; ?>
|
<div class="lw-stars lw-mt-8">
|
||||||
|
<?php for ($i = 1; $i <= 5; $i++) : ?>
|
||||||
|
<svg class="lw-star <?php echo $i <= $stars ? 'lw-star--filled' : ''; ?>" width="16" height="16" viewBox="0 0 21 19" fill="none">
|
||||||
|
<path d="M9.58463 1.50884C9.89101 0.602477 11.1729 0.602476 11.4793 1.50884L13.1158 6.35007C13.2531 6.75637 13.6343 7.02985 14.0631 7.02985H19.2721C20.2504 7.02985 20.6467 8.28958 19.8447 8.84971L15.6995 11.7446C15.335 11.9991 15.1823 12.4636 15.3247 12.8847L16.9239 17.6158C17.233 18.5302 16.1954 19.3085 15.404 18.7559L11.1045 15.7533C10.7606 15.5131 10.3033 15.5131 9.95941 15.7533L5.65991 18.7559C4.86857 19.3085 3.83092 18.5302 4.14001 17.6158L5.73926 12.8847C5.8816 12.4636 5.72891 11.9991 5.36448 11.7446L1.21924 8.84971C0.417196 8.28958 0.813532 7.02985 1.79181 7.02985H7.00081C7.42969 7.02985 7.81081 6.75637 7.94815 6.35007L9.58463 1.50884Z" fill="currentColor"/>
|
||||||
|
</svg>
|
||||||
|
<?php endfor; ?>
|
||||||
|
</div>
|
||||||
|
<div class="lw-card__text lw-mt-8"><?php echo wp_kses_post($text); ?></div>
|
||||||
</div>
|
</div>
|
||||||
<div class='custom-button-next reviews-owl-next'></div>
|
<?php endwhile; ?>
|
||||||
<div class='custom-button-prev reviews-owl-prev'></div>
|
|
||||||
<?php wp_reset_postdata(); ?>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</div>
|
||||||
|
<?php endif; wp_reset_postdata(); ?>
|
||||||
|
</section>
|
||||||
|
|
||||||
<section class="section-reveal section-bg camp-faq" data-bg="mint">
|
<section class="section-reveal section-bg camp-faq" data-bg="mint">
|
||||||
<h2 class="camp_title">Часто задаваемые вопросы</h2>
|
<h2 class="camp_title">Часто задаваемые вопросы</h2>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user