Лагерь: Секция AboutUs
This commit is contained in:
Dekart Deploy Bot
parent
fb52e9a556
commit
98f8ed161e
@ -196,6 +196,266 @@ p {
|
||||
}
|
||||
|
||||
/* banner END */
|
||||
|
||||
|
||||
/* =========================== */
|
||||
|
||||
/* about-us */
|
||||
|
||||
/* =========================== */
|
||||
|
||||
|
||||
|
||||
.about-us {
|
||||
|
||||
background: #ffffff;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__wrapper {
|
||||
|
||||
position: relative;
|
||||
|
||||
display: flex;
|
||||
|
||||
flex-direction: row;
|
||||
|
||||
align-items: center;
|
||||
|
||||
gap: 60px;
|
||||
|
||||
padding: 60px 75px;
|
||||
|
||||
overflow: visible;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__image-col {
|
||||
|
||||
flex: 0 0 45%;
|
||||
|
||||
max-width: 45%;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__image {
|
||||
|
||||
display: block;
|
||||
|
||||
width: 100%;
|
||||
|
||||
height: auto;
|
||||
|
||||
border-radius: 24px;
|
||||
|
||||
object-fit: cover;
|
||||
|
||||
aspect-ratio: 4 / 3;
|
||||
|
||||
box-shadow: 0 8px 32px rgba(0,0,0,0.10);
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__image-placeholder {
|
||||
|
||||
display: flex;
|
||||
|
||||
flex-direction: column;
|
||||
|
||||
align-items: center;
|
||||
|
||||
justify-content: center;
|
||||
|
||||
gap: 12px;
|
||||
|
||||
width: 100%;
|
||||
|
||||
aspect-ratio: 4 / 3;
|
||||
|
||||
border-radius: 24px;
|
||||
|
||||
background: #f0f0f0;
|
||||
|
||||
color: #999;
|
||||
|
||||
font-size: 14px;
|
||||
|
||||
font-family: Inter, sans-serif;
|
||||
|
||||
border: 2px dashed #ccc;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__image-placeholder svg {
|
||||
|
||||
width: 48px;
|
||||
|
||||
height: 48px;
|
||||
|
||||
color: #bbb;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__content-col {
|
||||
|
||||
flex: 1;
|
||||
|
||||
min-width: 0;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__title {
|
||||
padding-bottom: 10px;
|
||||
|
||||
text-align: center;
|
||||
|
||||
margin-bottom: 20px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__text {
|
||||
|
||||
font-family: Inter, sans-serif;
|
||||
|
||||
font-size: 18px;
|
||||
|
||||
line-height: 1.7;
|
||||
|
||||
font-weight: 400;
|
||||
|
||||
color: #333;
|
||||
|
||||
text-align: left;
|
||||
|
||||
margin: 0;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__doodle {
|
||||
|
||||
position: absolute;
|
||||
|
||||
object-fit: contain;
|
||||
|
||||
opacity: 0.15;
|
||||
|
||||
pointer-events: none;
|
||||
|
||||
z-index: 1;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__doodle--plane {
|
||||
|
||||
width: 78px;
|
||||
|
||||
height: 78px;
|
||||
|
||||
top: -5px;
|
||||
|
||||
right: -5px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__doodle--bulb {
|
||||
|
||||
width: 72px;
|
||||
|
||||
height: 72px;
|
||||
|
||||
bottom: -8px;
|
||||
|
||||
left: -8px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media (max-width: 780px) {
|
||||
|
||||
.about-us__wrapper {
|
||||
|
||||
flex-direction: column;
|
||||
|
||||
padding: 40px 20px;
|
||||
|
||||
gap: 30px;
|
||||
|
||||
}
|
||||
|
||||
.about-us__image-col {
|
||||
|
||||
flex: 0 0 100%;
|
||||
|
||||
max-width: 100%;
|
||||
|
||||
}
|
||||
|
||||
.about-us__title {
|
||||
padding-bottom: 10px;
|
||||
|
||||
font-size: 28px;
|
||||
|
||||
padding-bottom: 10px;
|
||||
|
||||
}
|
||||
|
||||
.about-us__text {
|
||||
|
||||
font-size: 16px;
|
||||
|
||||
line-height: 1.6;
|
||||
|
||||
}
|
||||
|
||||
.about-us__doodle--plane {
|
||||
|
||||
width: 48px;
|
||||
|
||||
height: 48px;
|
||||
|
||||
top: 10px;
|
||||
|
||||
right: 10px;
|
||||
|
||||
}
|
||||
|
||||
.about-us__doodle--bulb {
|
||||
|
||||
width: 44px;
|
||||
|
||||
height: 44px;
|
||||
|
||||
bottom: 10px;
|
||||
|
||||
left: 10px;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* suggestions */
|
||||
.suggestions {}
|
||||
|
||||
|
||||
@ -589,6 +589,11 @@ function add_carbon() {
|
||||
->set_width( 40 ),
|
||||
))
|
||||
->add_tab('ℹ️ О нас', array(
|
||||
Field::make( 'separator', 'about_us_sep', 'Текст и фото' ),
|
||||
Field::make( 'image', 'about_us_img', 'Фото (заглушка: 600×400 px)' )
|
||||
->set_help_text( 'Рекомендуемый размер: 600×400 px. Реальные дети, эмоции, крупные планы. Пока можно залить любую заглушку.' )
|
||||
->set_width( 30 ),
|
||||
|
||||
Field::make( 'textarea', 'about_us_text', 'Текст о нас' )
|
||||
->set_help_text( 'Краткий текст о лагере. Выводится на странице лагеря после Hero-секции.' )
|
||||
->set_default_value( 'Dekart — это сеть детских клубов, где наука, творчество и спорт объединяются в одну захватывающую программу. Мы помогаем детям раскрывать таланты, находить друзей и проводить лето с пользой. Наши вожатые — профессиональные педагоги и наставники, которые создают атмосферу доверия и вдохновения. Каждый день в лагере — это новое открытие.' ),
|
||||
|
||||
@ -125,18 +125,40 @@ $metrics = [
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="about-us" style="background: #ffffff;">
|
||||
<section class="about-us">
|
||||
<div class="container">
|
||||
<div class="about-us__wrapper" style="position: relative; padding: 35px 75px 45px 75px; overflow: visible;">
|
||||
<h2 class="camp_title" style="text-align:center;">О нас</h2>
|
||||
<p class="about-us__text"><?php echo wp_kses_post( carbon_get_post_meta( $post_id, 'about_us_text' ) ?: 'Dekart — это сеть детских клубов, где наука, творчество и спорт объединяются в одну захватывающую программу. Мы помогаем детям раскрывать таланты, находить друзей и проводить лето с пользой. Наши вожатые — профессиональные педагоги и наставники, которые создают атмосферу доверия и вдохновения. Каждый день в лагере — это новое открытие.'); ?></p>
|
||||
<img src="<?php echo get_template_directory_uri(); ?>/assets/images/doodles/doodle-paper-plane.svg"
|
||||
alt=""
|
||||
style="position: absolute; top: -5px; right: -5px; width: 78px; height: 78px; opacity: 0.9; z-index: 10; pointer-events: none;">
|
||||
|
||||
<div class="about-us__wrapper">
|
||||
<div class="about-us__image-col">
|
||||
<?php
|
||||
$about_img_id = carbon_get_post_meta( $post_id, 'about_us_img' );
|
||||
if ( $about_img_id ) :
|
||||
echo wp_get_attachment_image( $about_img_id, 'medium_large', false, [
|
||||
'class' => 'about-us__image',
|
||||
'loading' => 'lazy',
|
||||
'alt' => 'Фото детского лагеря Декарт'
|
||||
] );
|
||||
else :
|
||||
echo '<div class="about-us__image-placeholder">
|
||||
<svg width="64" height="64" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
||||
<rect x="3" y="3" width="18" height="18" rx="2"/>
|
||||
<circle cx="8.5" cy="8.5" r="1.5"/>
|
||||
<path d="M21 15l-5-5L5 21"/>
|
||||
</svg>
|
||||
<span>Добавьте фото</span>
|
||||
</div>';
|
||||
endif;
|
||||
?>
|
||||
</div>
|
||||
<div class="about-us__content-col">
|
||||
<h2 class="camp_title about-us__title">О нас</h2>
|
||||
<div class="about-us__text">
|
||||
<?php echo wp_kses_post( carbon_get_post_meta( $post_id, 'about_us_text' ) ?: 'Dekart — это сеть детских клубов, где наука, творчество и спорт объединяются в одну захватывающую программу. Мы помогаем детям раскрывать таланты, находить друзей и проводить лето с пользой. Наши вожатые — профессиональные педагоги и наставники, которые создают атмосферу доверия и вдохновения. Каждый день в лагере — это новое открытие.' ); ?>
|
||||
</div>
|
||||
</div>
|
||||
<img src="<?php echo get_template_directory_uri(); ?>/assets/images/doodles/doodle-paper-plane.svg"
|
||||
alt="" class="about-us__doodle about-us__doodle--plane">
|
||||
<img src="<?php echo get_template_directory_uri(); ?>/assets/images/doodles/doodle-lightbulb.svg"
|
||||
alt=""
|
||||
style="position: absolute; bottom: -8px; left: -8px; width: 72px; height: 72px; opacity: 0.9; z-index: 10; pointer-events: none;">
|
||||
alt="" class="about-us__doodle about-us__doodle--bulb">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user