Skip to content

Commit

Permalink
img
Browse files Browse the repository at this point in the history
  • Loading branch information
@Ayronhayd
Ayronhayd committed Aug 15, 2024
1 parent 01aec8c commit a25f228
Show file tree
Hide file tree
Showing 21 changed files with 98 additions and 26 deletions.
Binary file removed source/img/training/training-1.jpg
View file
Binary file not shown.
Binary file removed source/img/training/training-1.webp
View file
Binary file not shown.
Binary file removed source/img/training/[email protected]
View file
Binary file not shown.
Binary file removed source/img/training/[email protected]
View file
Binary file not shown.
Binary file removed source/img/training/training-2.jpg
View file
Binary file not shown.
Binary file removed source/img/training/training-2.webp
View file
Binary file not shown.
Binary file removed source/img/training/[email protected]
View file
Binary file not shown.
Binary file removed source/img/training/[email protected]
View file
Binary file not shown.
Binary file removed source/img/training/training-3.jpg
View file
Binary file not shown.
Binary file removed source/img/training/training-3.webp
View file
Binary file not shown.
Binary file removed source/img/training/[email protected]
View file
Binary file not shown.
Binary file removed source/img/training/[email protected]
View file
Binary file not shown.
Binary file removed source/img/training/training-4.jpg
View file
Binary file not shown.
Binary file removed source/img/training/training-4.webp
View file
Binary file not shown.
Binary file removed source/img/training/[email protected]
View file
Binary file not shown.
Binary file removed source/img/training/[email protected]
View file
Binary file not shown.
Binary file added source/img/training/training-5.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added source/img/training/[email protected]
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
101 changes: 78 additions & 23 deletions source/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -403,10 +403,10 @@ <h3 class="tours__card-title">Восхождение

<section class="training container" data-test="training">
<h2 class="training__title title" data-shadow="Обучение">Обучение</h2>
<p>Обучение проводится квалифицированными специалистами, за плечами которых десятки пройденных маршрутов Кавказа,
<p>Обучение проводится квалифицированными специалистами,<br> за плечами которых десятки пройденных маршрутов Кавказа,
Крыма, Гималаев, Эльбруса, Алтая, Карелии, Адыгеи и других.</p>

<div>

<h2 class="training__instructors">Наши инструкторы</h2>
<div class="button-swiper">
<div class="training__button-prev swiper-button"></div>
Expand All @@ -418,22 +418,40 @@ <h2 class="training__instructors">Наши инструкторы</h2>
<li class="training__slide swiper-slide">
<picture>
<source type="image/webp" width="260" height="200"
srcset="./img/training/training-3.webp 1x, ./img/training/training-3@2x.webp 2x">
<img class="training__img" src="./img/training/training-3.jpg" srcset="./img/training/training-3@2x.jpg"
width="260" height="200" alt="Надежда Колесниченко.">
srcset="./img/training/training-1.webp 1x, ./img/training/training-1@2x.webp 2x">
<img class="training__img" src="./img/training/training-1.jpg" srcset="./img/training/training-1@2x.jpg"
width="260" height="200" alt="Александр Прокофьев.">
</picture>
<div class="training__content">
<h3>Надежда Колесниченко</h3>
<a class="training__vk-link" href="#">
<span class="visually-hidden">Открыть страницу в контакте.</span>
<svg class="training__icon" width="16" height="9">
<use href="/__spritemap#sprite-vk"></use>
</svg>
</a>
<h3>Александр Прокофьев</h3>
<a class="training__vk-link" href="#">
<span class="visually-hidden">Открыть страницу в контакте.</span>
<svg class="training__icon" width="16" height="9">
<use href="/__spritemap#sprite-vk"></use>
</svg>
</a>
</div>
<p>Участники говорят, что Надежда ответственная, приятная в общении,
и в поездках с ней чувствуешь себя
спокойно и уверенно.</p>
<p>Строгий и внимательный инструктор, весёлый и общительный человек. Любит природу.</p>
</li>

<li class="training__slide swiper-slide">
<picture>
<source type="image/webp" width="260" height="200"
srcset="./img/training/training-2.webp 1x, ./img/training/[email protected] 2x">
<img class="training__img" src="./img/training/training-2.jpg" srcset="./img/training/[email protected]"
width="260" height="200" alt="Светлана Афиногенова.">
</picture>
<div class="training__content">
<h3>Светлана Афиногенова</h3>
<a class="training__vk-link" href="#">
<span class="visually-hidden">Открыть страницу в контакте.</span>
<svg class="training__icon" width="16" height="9">
<use href="/__spritemap#sprite-vk"></use>
</svg>
</a>
</div>
<p>Видеть мир вокруг, познавать его опасности, находить друг друга, становиться ближе, чувствовать —
в этом назначение жизни.</p>
</li>

<li class="training__slide swiper-slide">
Expand All @@ -445,22 +463,59 @@ <h3>Надежда Колесниченко</h3>
</picture>
<div class="training__content">
<h3>Надежда Колесниченко</h3>
<a class="training__vk-link" href="#">
<span class="visually-hidden">Открыть страницу в контакте.</span>
<svg class="training__icon" width="16" height="9">
<use href="/__spritemap#sprite-vk"></use>
</svg>
</a>
<a class="training__vk-link" href="#">
<span class="visually-hidden">Открыть страницу в контакте.</span>
<svg class="training__icon" width="16" height="9">
<use href="/__spritemap#sprite-vk"></use>
</svg>
</a>
</div>
<p>Участники говорят, что Надежда ответственная, приятная в общении,
и в поездках с ней чувствуешь себя
спокойно и уверенно.</p>
</li>
</ul>

<li class="training__slide swiper-slide">
<picture>
<source type="image/webp" width="260" height="200"
srcset="./img/training/training-4.webp 1x, ./img/training/[email protected] 2x">
<img class="training__img" src="./img/training/training-4.jpg" srcset="./img/training/[email protected]"
width="260" height="200" alt="Федор Кайгородов.">
</picture>
<div class="training__content">
<h3>Федор Кайгородов</h3>
<a class="training__vk-link" href="#">
<span class="visually-hidden">Открыть страницу в контакте.</span>
<svg class="training__icon" width="16" height="9">
<use href="/__spritemap#sprite-vk"></use>
</svg>
</a>
</div>
<p>Опыт походов: Ходит в походы с 2001 года. В России побывал в горных районах Хибины, Архыз, много
путешествует по Европе.</p>
</li>

<li class="training__slide swiper-slide">
<picture>
<source type="image/webp" width="260" height="200"
srcset="./img/training/training-5.webp 1x, ./img/training/[email protected] 2x">
<img class="training__img" src="./img/training/training-5.jpg" srcset="./img/training/[email protected]"
width="260" height="200" alt="Даниэль Васнецов.">
</picture>
<div class="training__content">
<h3>Даниэль Васнецов</h3>
<a class="training__vk-link" href="#">
<span class="visually-hidden">Открыть страницу в контакте.</span>
<svg class="training__icon" width="16" height="9">
<use href="/__spritemap#sprite-vk"></use>
</svg>
</a>
</div>
<p>Покорял самые сложные вершины. Выбирался из под лавин, дружит с медведями и не только.</p>
</li>
</ul>
</div>

</div>


</section>
Expand Down
3 changes: 2 additions & 1 deletion source/js/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,11 +65,12 @@ const swiperTraining = new Swiper('.training__swiper', {

breakpoints: {
320: {
// initialSlide: 3,
initialSlide: 2,
slidesPerView: 1,
},
768: {
slidesPerView: 3,
initialSlide: 0,
},
1440: {
slidesPerView: 4,
Expand Down
20 changes: 18 additions & 2 deletions source/sass/blocks/training.scss
View file
Original file line number Diff line number Diff line change
@@ -1,23 +1,29 @@
.training {
color: $color-basic;
padding-top: 20px;
position: relative;

p {
font-size: 14px;
line-height: 20px;
margin: 0;
padding: 0;
padding-bottom: 29px;
margin-bottom: 29px;

@media (min-width: $tablet-width) {
font-size: 16px;
line-height: 24px;
margin-bottom: 30px;
}
}
}

.training__title {
margin: 17px 0 33px;

@media (min-width: $tablet-width) {
margin: 19px 0 34px;
}
}

.training__instructors {
Expand All @@ -27,11 +33,12 @@
line-height: 22px;
margin: 0;
padding: 0;
padding-bottom: 22px;
margin-bottom: 22px;

@media (min-width: $tablet-width) {
font-size: 25px;
line-height: 25px;
margin-bottom: 37px;
}

@media (min-width: $desktop-width) {
Expand All @@ -44,6 +51,10 @@
border: 1px solid rgba($border, 0.1);
padding: 14px;

@media (min-width: $tablet-width) {
min-height: 385px;
}

p {
font-size: 12px;
line-height: 16px;
Expand All @@ -59,11 +70,16 @@
object-fit: cover;
}


.training__swiper {
list-style: none;
margin: 0;
padding: 0;
width: 290px;

@media (min-width: $tablet-width) {
width: 678px;
}
}

.training__content {
Expand Down

0 comments on commit a25f228

Please sign in to comment.