Виталий Першин

Нужно задать минимальную высоту 100% высоты экрана для контейнера в котором находится футер, в ваше случае так:

.wrapper {
  min-height: 100vh
}

.container_wrap{
	display: flex;
	flex-direction: column;
	border: 4px solid green;
  min-height: 100vh
}

Canvas

Там же есть готовый пример, просто до листайте до 3-го слайда:
https://alvarotrigo.com/fullPage/extensions/scroll...

Вот только такие дополнения платные, можно добавить слайдер swiper или slick, но не думаю что кто-то будет за вас делать это бесплатно

Вчера переделывал эту анимацию по своему:

el.innerHTML = '<div id="bigdiv" style="width: 30%; padding: 15px; position: absolute; top: 10%; z-index: 100; left: 35%; background-color: rgb(51, 53, 65); border-radius: 0.625rem; box-shadow: rgb(255, 101, 47) 0px 0px 5px 0px; border: 1px solid rgb(255, 101, 47);">Content</div>';

https://learn.javascript.ru/modifying-document#ins...

document.querySelector('body').insertAdjacentHTML('beforebegin', '<div id="bigdiv" style="width: 30%; padding: 15px; position: absolute; top: 10%; z-index: 100; left: 35%; background-color: rgb(51, 53, 65); border-radius: 0.625rem; box-shadow: rgb(255, 101, 47) 0px 0px 5px 0px; border: 1px solid rgb(255, 101, 47);">Content</div>');

Чтобы при помощи clip-path зафиксировать угол, используйте calc:

Ключ-значение
block_size_small
block__element_size_small

В данном случае модификатор у нас size, а его значение может быть small, large и тд

А js обязательно? Без js это легко можно сделать так:

closest находит ближайшего родителя удовлетворяющего условию, а у вас search_family стоит даже не рядом с инпут. Вам нужно реализовать что-то вроде этого:


Находим родительский блок и внутри него ищем элемент который хотим скрыть, в вашем случае это search_family

Нет

let usersData = [];
let locDataStorage = JSON.parse(localStorage.getItem("UpdateLocData"));
locDataStorage.forEach(function (item) {
    usersData.push([item.label, item.userData]);
});
 console.log(usersData);
    let obj = {
      "login": localStorage.getItem('username'),
      "fio_operator_Start": localStorage.getItem('user_fio'),
      "id_client": localStorage.getItem('IDClient'),
      "fio_client": localStorage.getItem('fioClient'),
      "fin_phone": localStorage.getItem('Phone'),
      "thematic_id": localStorage.getItem('thematic_id'),
      "thematic_name": localStorage.getItem('thematic'),
      "userData": usersData 
    };

Сделал пример, можно доработать под себя или разобраться как работает и сделать по своему.
Я правда не понял какое вам нужно направление слайдов поэтому оставил горизонтальную:

Даже если не джун, что мешает использовать сторонние проверенные библиотеки. Для демонстрации своих навыков можете реализовать свой слайдер и выложить на GitHub, там пусть и смотрят

Набросал свой вариант:

Ищите по ключу parallax
Вот одна из самых популярных:
https://matthew.wagerfield.com/parallax/

Нужно отталкиваться от input в состоянии checked, а он может влиять только на элементы находящиеся после него

Если я правильно понял, перед
document.getElementById('icon').appendChild(icon);
Просто очищайте icon
document.getElementById('icon').innerHTML = "";
Что-то вроде этого:

function coords(lat, long) { 
fetch(`url`) 
.then((response) => response.json()) 
.then((data) => {
const icon = document.createElement('i');
icon.className = icons(data.weather[0].icon);
icon.style.fontSize = '120px';
document.getElementById('icon').innerHTML = "";
document.getElementById('icon').appendChild(icon);)}

Если отличия стилистические, то есть, можно предположить что в любом месте можно использовать один из двух вариантов, то лучше делать через модификатор с ключем и его значением. Например:
socials_theme_ligth
socials_theme_dark
где theme это ключ, а ligth и dark его значения, которые не могут быть использованы одновременно на одном блоке.
Для остальных изменений, которые необходимо внести только в footer мы применяем микс. К примеру нам нужна светлая тема, но в футере необходимо добавить отступ сверху или еще какие-то изменения в данном контексте. Выглядеть это может вот так:

<ul class="footer__socials  socials socials_theme_ligth">
...
</ul>

.socials {
  color: #000;
}
.socials_theme_ligth {
  color: #fff;
}
.footer__socials  {
  margin-top: 100px
}

Смотря как сверстаны внутренности, если на флексах, то отодвинуть вниз можно при помощи margin-top: auto; в bootstrap 4 это класс .mt-auto