WapSter

Плохой вариант. Продублировать меню.
Еще хуже. При помощи js перемещать блок с логотипом по DOM дереву.
Нормальный. Сделать логотип относительно позиционированым. Вставить по центру, в мобильной версии делать статичным или просто изменить позицию.

Потому, что в коде, на момент исполнения выражения в sum let place = '', link = '', power = '' уже имеют значения, меняют их они уже гораздо позже.

$(window).on('load',function(){
        if (!localStorage.getItem('myModal') {
              $('#myModal').modal('show');
              localStorage.setItem('myModal' , true)
        }
});

Типо так? Правда хз при чем тут "условие с двумя переменными"

<div class="block">
  <div class="active"></div>
  <div class="active"></div>
  <div class="active"></div>
  <div class="active"></div>
  <div class="active"></div>
</div>

const count = $('.block').find('.active').length
console.log(count) // 5

margin-bottom

https://learn.javascript.ru/attributes-and-custom-...

MDN: In flexbox layouts, this property is ignored

array[3] у тебя равен 1 + 1 = 2, array[2] = 'Андрей'

height 100% никогда не с работает на любом элементе, если у родителя не задана в px. Используй object-fit cover

Делай просто оптимально. Для превью используй легкие, для показа уже более качественные. К тому же есть тэг picture и методы lazy-load

Что-то типо этого

label
   input
   span

input ~ span {}
input:checked ~ span {}

С телефона. Синтаксис html = pug. span нужно стилизовать в виде кнопки

label строчный, соответсвенно только строчные.

https://medium.com/@pppped/how-to-code-a-responsiv...