Дмитрий Марков

Может добавить счётчик ?

const buttonNumber = document.querySelector('.number');
const block = document.querySelector('.block');
let counter = 0;
buttonNumber.addEventListener('click', event => {
    event.preventDefault();
    const newClass = 'block';
    block.classList.add(newClass+counter);
    counter++;
})

У Вас на странице вывода нету input.value :)
Вы должны передавать название ключа в localStorage.getItem('value')

Получилось только переборам $arr1 и пушем в $arr2

Придумал решение с использованием js. Нужно всего та после ввода 4той цифры перенести курсор в начало строки и снять фокус инпута. Изи.

const inputs = document.querySelectorAll('.input');


if( inputs.length ) {

    const inputSelection = input => {
        input.type = 'text';
        input.setSelectionRange(0,0);
        input.type = 'number';
        input.blur();
    }

    inputs.forEach(input => {
        input.addEventListener('input', event => {
            if( input.value.length == input.maxLength ) inputSelection(input);
    
            if( input.value.length > input.maxLength ) {
                input.value = input.value.slice(0, input.maxLength);
                inputSelection(input);
            }
        });
    });

}

Отбой. Проблема решена
Мне не хватало настройки сервера

devServer: {
		contentBase: './public',
		port: 3000,
		historyApiFallback: true
	}

<div class="flex-wrapper" />
 <img src="левое.jpg">
 <p>lorem100</p>
 <img src="правое.jpg" />
</div>

.flex-wrapper {
 display:flex;
}
.flex-wrapper img {
 width: 200px;
 flex-shrink: 0;
}
.flex-wrapper p {
 flex-grow: 1;
}

width: 100%%;

Одного css не хватит. Максимум можно сделать что бы меню выездало при фокусе кнопки, но это такое себе решение. Лучше потратить 5 минут и написать обработчик

Можно удаляющийся элемент сжать в 0px , затем уже удалять его

function toggleModal(event){
event.preventDefault();
modalCity.classList.toggle("is-open");
}