Лагерь: Секция Программы - горизонтальный слайдер
This commit is contained in:
parent
a24b83c27d
commit
4b2376f78b
@ -1044,6 +1044,41 @@ html {
|
||||
|
||||
/* programs END */
|
||||
|
||||
/* ─── Programs: horizontal scroll on mobile ─── */
|
||||
@media (max-width: 768px) {
|
||||
.programs__scroll-x {
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
.programs__scroll-x::-webkit-scrollbar {
|
||||
height: 6px;
|
||||
}
|
||||
.programs__scroll-x::-webkit-scrollbar-thumb {
|
||||
background: #ccc;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.programs__scroll-x .programs__grid {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
overflow-x: auto;
|
||||
scroll-snap-type: x mandatory;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
.programs__scroll-x .programs__grid .programs__card {
|
||||
flex: 0 0 300px;
|
||||
min-width: 0;
|
||||
scroll-snap-align: start;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.programs__scroll-x .programs__grid .programs__card {
|
||||
flex: 0 0 260px;
|
||||
}
|
||||
}
|
||||
/* programs slider END */
|
||||
|
||||
/* modal */
|
||||
.modal-programs,
|
||||
.modal-mentors {
|
||||
|
||||
@ -816,7 +816,7 @@ function enqueue_template_specific_styles() {
|
||||
'template-specific-style',
|
||||
get_template_directory_uri() . '/assets/css/camp.css',
|
||||
array(),
|
||||
'1.4'
|
||||
'1.5'
|
||||
);
|
||||
wp_enqueue_script(
|
||||
'camp-script',
|
||||
|
||||
@ -334,6 +334,7 @@ $metrics = [
|
||||
<section class="section-bg programs" data-bg="mint">
|
||||
<div class="container">
|
||||
<h2 id="camp-programs" class="camp_title">Летние программы</h2>
|
||||
<div class="programs__scroll-x">
|
||||
<div class="programs__grid">
|
||||
<?php
|
||||
$programs = carbon_get_post_meta($post_id, 'programs');
|
||||
@ -364,6 +365,7 @@ $metrics = [
|
||||
}
|
||||
} ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user