nowm

Замените - "80:5001" на - "5001:5001" в блоке services.backend, и должно заработать. Так же, нужно удостовериться в коде самого проекта NodeJS, что вы слушаете только порт 5001 и не трогаете порты 80 и 443.

В этой таблице подразумевется, что значение из первой колонки присваивается переменной x, а из второй — переменной y. После этого делаются сравнения x == y, x === y и Object.is(x, y).

Соответственно, шестая строка подразумевает, что вы делаете такое присваивание:

const x = {foo: "bar"};
const y = x;

Можно сделать так:

const colors = ['black', '#252240', /*далее все нужные цвета по этому же принципу*/];

// Это вместо всех блоков if (seconds.innerText == N)
seconds.style.color = colors[parseInt(seconds.innerText) || 0] || colors[0];

Это специфичное для blockquote определение, которое Eric Meyer (автор reset.css) позаимствовал у Paul Chaplin. Первая строка content: "" делает так, чтобы у blockquote исчезли кавычки — на случай, если вторая строка content: none не поддерживается браузером, потому что первая строка — это CSS 2, а вторая — это CSS 2.1. В одну строку их записать нельзя, потому что по стандарту для свойства «content» нельзя комбинировать ключевые слова «normal» и «none» с другими значениями.

Вообще, когда встречается перечисление одного и того же свойства с разными значениями, это делается для того, чтобы обеспечить совместимость с разными браузерами. То есть, если, например, браузер не поддерживает «content: none», он применит «content: ""», а другую запись проигнорирует.

Обычно дублирующие записи располагаются в определённом порядке. Первой записью идёт самый плохой вариант, который должен сработать везде. Затем идёт вариант, который более полно описывает вашу цель. Пример:

.some-class {
    background: #e66465;
    background: linear-gradient(#e66465, #9198e5);
}

В этом коде, если браузер поддерживает градиентный фон, он сначала прочитает, что нужно использовать цвет «#e66465», а потом это перезапишется записью «linear-gradient», и итоговое значение будет «linear-gradient(#e66465, #9198e5);». Если же браузер не поддерживает градиент, он сначала прочитает, что нужно использовать «#e66465», а потом увидит неподдерживаемое определение «linear-gradient», проигнорирует его, и итоговое значение будет «#e66465».

В Firefox нет такой штуки, как ::-moz-scrollbar, но для элемента можно сделать scrollbar-width: none;:

div {
  max-height: 120px;
  overflow-y: auto;
  overflow-x: none;
  scrollbar-width: none;
}

div::-webkit-scrollbar {
  display: none;
}

Я ваш jsfiddle-пример протестировал с scrollbar-width, и скролбар после этого исчезает корректно в Firefox.

Вместо ${data.items[key].price*1.2} можно написать

${parseInt(data.items[key].price*1.2).toLocaleString('ru-RU')}

и не будет никакой проблемы, и не нужно будет дополнительно делать $('.content__api__price').each(function() {}) и фиксить формат.

(Извиняюсь за форматирование. Я всё писал в одну строку, просто «Хабр Q&A» не умеет переносить длинный код внутри строки и получается не очень красиво, когда он его начинает лепить с новой строки.)

В MongoDB, насколько я знаю, нет таких лимитов. Лимиты распространяются только на итоговый размер всего документа после конвертации в BSON (16 мегабайт). Так что, если вы хотите ввести какие-то лимиты, вроде максимальной длины имени пользователя в 20 символов, обрезать строки до нужной длины придётся самостоятельно где-то в коде.

В C++ есть getLine, и он читает всю строку:

#include <string>
#include <iostream>

int main()
{
   std::string words;
   
   std::cout << "Введите слова: ";
   std::getline(std::cin, words);
   
   std::cout << "Слова: " << words << "\n";
}

function cityToCountry(city) {
    const countries = ['Казахстан', 'Россия', 'Китай', 'США'];

    let cities = [[],[],[],[]]
    array[0][0] = 'Астана';
    array[0][1] = 'Караганда';
    array[0][2] = 'Актобе';
    array[0][3] = 'Алмата';
    array[1][0] = 'Москва';
    array[1][1] = 'Новосибирск';
    array[1][2] = 'Сочи';
    array[1][3] = 'Омск';
    array[2][0] = 'Пекин';
    array[2][1] = 'Шанхай';
    array[2][2] = 'Сиань';
    array[2][3] = 'Харбин';
    array[3][0] = 'Нью-йорк';
    array[3][1] = 'Чикаго';
    array[3][2] = 'Вашингтон';
    array[3][3] = 'Даллас';

    for (let i in cities) {
        if (!cities.hasOwnProperty(i)) {
            continue;
        }

        for (let j in cities[i]) {
            if (!cities[i].hasOwnProperty(j)) {
                continue;
            }

            if (cities[i][j] === city && countries[i]) {
                return countries[i];
            }
        }
    }

    return 'Город не найден';
}

let city = prompt('Введите название города:', '');

alert(cityToCountry(city));

Я где-то прочитал ваш комментарий о том, что вам обязательно нужно использовать массивы и конкретно в таком виде, как вы их описали. На эту тему могу сказать, что вам, возможно кто-то навязывает методы решения задачи, которые изначально заставляют вас ходить кругами и писать долбанутый код. Либо вы самостоятельно хотите нарезать круги вместо того, чтобы кратчайшим способом прийти к решению.

Самый короткий путь для решения такой задачи:

const cityToCountry = {
    'Астана': 'Казахстан',
    'Караганда': 'Казахстан',
    'Актобе': 'Казахстан',
    'Алмата': 'Казахстан',
    'Москва': 'Россия',
    'Новосибирск': 'Россия',
    'Сочи': 'Россия',
    'Омск': 'Россия',
    'Пекин': 'Китай',
    'Шанхай': 'Китай',
    'Сиань': 'Китай',
    'Харбин': 'Китай',
    'Нью-йорк': 'США',
    'Чикаго': 'США',
    'Вашингтон': 'США',
    'Даллас': 'США',
};

const city = prompt('Введите название города:', '');
if (!cityToCountry.hasOwnProperty(city)) {
    alert('Такого города не найдено');
} else {
    alert(`Для города «${city}» найдена страна «${cityToCountry[city]}»`);
}

Этот код работает быстрее, и подход, который в нём используется, уменьшает количество точек отказа. Если вы всегда будете стремиться идти к цели прямыми путями, а не нарезать круги, вы лучше состоитесь, как программист. Но это дело ваше.

Событие «load» не срабатывает из-за того, что этот код вызывается после того, как страница загрузилась.

window.addEventListener('load',  event => f(event))

Страница загрузилась и сработал window.onload, и только потом вы делаете фетч, который регистрирует прослушку этого события. Естественно, событие не поймается.

К слову, вообще непонятно, зачем вы его пытаетесь прослушивать. Можно без него обойтись, потому что оно к окончанию загрузки с помощью fetch не имеет вообще никакого отношения.

Вроде, такой подход должен сработать, если я правильно понял, что вы имели ввиду ActiveRecord:

$subQuery = chat_bot_clients::find()
    ->select('id')
    ->where(['chat_bot_user_id' => 1]);

$query = vk_users::find()
    ->where(['user_id' => 24])
    ->andWhere(['in', 'chat_bot_clients_id', $subQuery]);

$models = $query->all();

Как одна из причин, у вас может быть установлено какое-то расширение для тёмной темы (либо было когда-то давно установлено и некорректно удалилось), и это расширение так влияет на выделение.

Попробуйте в настройках сделать тему «по-умолчанию» и перезапустить Хром. Если исправится, значит дело было действительно в старой теме. Если не поможет, то я тоже больше ничего не подскажу.

Вообще, тут всё правильно (за исключением того, что нужно писать «снаружи», а не «с наружи»). Просто вы видите в консоли undefined из-за того, что пытаетесь читать значения снаружи до того, как нажали кнопку — переменным в этот момент тупо не присвоились никакие значения.

Чтобы вы понимали логику:

// Шаг 1: Определяются переменные
let control_input1;
let control_input2;

// Шаг 2: Вешается обработчик
Proekt_button.addEventListener('click',function(){
    // Шаг 4: Кнопка нажата
});

// Шаг 3: Что-то печатается в консоль
console.log('Данные снаружи функции',control_input1);
console.log('Данные снаружи функции', control_input2);

Так вот, шаги 1, 2, и 3 выполняются сразу — без задержек. А шаг 4 выполняется только когда вы нажимаете кнопку. То есть, в момент, когда выполняется шаг 4, шаг 3 уже давно прошёл и вы увидели в консоли значение undefined не после нажатия кнопки, а до.

Чтобы у вас всё время всё было заполнено, можно определять переменные так:

// Неправильно
// let control_input1;
// let control_input2;

// Правильно — вот так надо делать
let control_input1 = Control_1.value;
let control_input2 = Control_2.value;

То есть, если до нажатия кнопки в инпутах будут какие-то дефолтные значения, они сразу попадут в эти переменные — до нажатия кнопки.

onScroll может не работать из-за того, что скроллится не элемент, на который он навешан, а какой-нибудь другой родительский элемент. Например, по-умолчанию, если вы не позаботились отдельно, чтобы скроллился какой-то конкретный элемент, то скролл будет происходить в <body> и передаваться дочерним элементам не будет.

onWheel срабатывает, когда крутится колесо мыши, и поймать это событие можно тем элементом, на котором находится курсор в момент прокрутки.

Я надеюсь, вы поняли разницу между этими двумя событиями. Чтобы ловить скролл в данном конкретном случае, нужно удостовериться, что происходит скроллинг именно этого элемента. Например, можно сделать так:

body {
    max-height: 100vh;
    overflow: hidden;
}

.scrollable {
    max-height: 100vh;
    overflow: scroll;
}

export default function Home() {
    const handleScroll = event => {
        console.log('scrolling...', event);
    }

    return (
        <div onScroll={handleScroll} className='Home scrollable'>
            <Header/>
        </div>
    );
}

В монго, начиная с версии 3.6. есть такая штука, как Change Streams. Суть в том, что вы в коде, после соединения с БД, специальным образом подписываетесь на изменения данных. Например, если нужно отслеживать изменения в коллекции Books:

const collection = db.collection('Books');
const changeStream = collection.watch();
changeStream.on('change', event => {
  // event — см. типы событий: https://docs.mongodb.com/manual/reference/change-events/
});

Важный момент: Change Streams работает только если сервер MongoDB запущен в режиме кластера, а не как он по-умолчанию запускается. Немного подробностей о том, как это сделать: https://habr.com/ru/post/335772/ (см. раздел «Настройка и добавление серверов в Replica Set»).

Обычно ручной поиск сфокусированного элемента не срабатывает, потому что когда ты открываешь консоль разработчика, фокус с элемента слетает. Если снова его фокусируешь при открытой консоли, фокус слетает в тот момент, когда ты переключаешься в уже открытую консоль. Так что, самый подходящий вариант: можно прослушивать события фокуса и сразу печатать в лог, кто этот фокус получил. Должен помочь такой код:

window.addEventListener('focusin', event => console.log(new Date, event.target));

Если он ничего не выводит в момент смены фокуса, значит фокус ушёл за пределы страницы — например, в строку адреса в браузере, на какую-нибудь иконку на панели и так далее.

Мне нравится эта статья про CSS: сопособы добавления стилей на страницу. Она написана вполне доступным языком, описывает кучу способов, которыми можно решить вашу проблему, и очень легко ищется поисковиком.

Upd: Блок с бейджем рекаптчи использует класс grecaptcha-badge.

Это проблема с конкретным шрифтом на fonts.com. Возможно, у них старая версия, в которой хинтинг не доработан. Прямо на их же сайте в предпросмотре видно, что на маленьких размерах шрифта появляются проблемы. Я дополнительно проверял на сайте linotype (разработчики шрифта) и на сайте fontshop — там таких проблем вроде нет.

Ещё, конкретно в случае с этим шрифтом, можно написать на info@linotype.com — у них этот адрес вроде как для технической поддержки используется.