Какой браузер корректно отображает мобильную версию?

Поддержка
1

image
image595×244 6.11 KB

Попробовал Edge, Firefox, Brave и Chrome. Ни один из них не отображает правильный мобильный вид. Я пытаюсь изменить выпадающее меню для мобильных устройств, но отображается меню для десктопной версии.

На моем iPhone в Safari и Chrome всё отображается корректно.

2

Обычно это делалось путем добавления ?mobile_view=1 в конец URL. Discourse переходит на адаптивный дизайн, основанный на размере области просмотра, поэтому в зависимости от темы этот переопределитель может перестать работать.

1 лайк
3

Вы имеете в виду настройку сайта navigation menu?

1 лайк
4

К сожалению, я считаю, что это было удалено несколько дней назад:

3 лайка
5

Да, параметр ?mobile_view=1 устарел и считается устаревшим — новый мобильный стиль был включен в прошлом году:

Не знаю, какие кастомизации вы внедрили на своём форуме, но я не могу воспроизвести эту проблему ни на одном экземпляре или устройстве. Проверяли ли вы это в безопасном режиме?

Screenshot 2026-03-07 at 7.07.32 PM
Screenshot 2026-03-07 at 7.07.32 PM1186×1224 167 KB

4 лайка
6

Мне удалось заставить отображаться мобильный вид в Chrome, но в Firefox, Edge или Brave браузеры по-прежнему не показывают мобильную версию.

Мне нужны точки перелома Viewport во всём моём мобильном коде? Нужно ли размещать их в разделе «Мобильный»? Большая часть моего мобильного CSS — это просто изменения цветов, иконки в заголовке, ширина боковой панели, размеры эмодзи и шрифтов. Поэтому, кажется, мне не нужны какие-либо специфические настройки Viewport.

image
image642×369 13.5 KB

Мне удалось исправить необходимый код:

/* ==========================================================================
   МОБИЛЬНОЕ ВЫПАДАЮЩЕЕ МЕНЮ - АКТИВНОЕ СОСТОЯНИЕ
   ========================================================================== */

/* 1. Принудительно сделать текст активной ссылки чёрным */
.d-modal__body .dropdown-menu li.active a,
.d-modal__body .dropdown-menu li.active {
    color: #000000 !important;
}

/* 2. Обратная связь для сенсорных экранов (стандарт Discourse) */
html.discourse-touch {
    /* Сделать текст чёрным, пока палец нажат */
    .d-modal__body .dropdown-menu li a:active {
        color: #000000 !important;
    }

}

/* 3. Убедиться, что другие элементы навигации следуют правилу */
.dropdown-menu li a {
    transition: color 0.1s ease;
}

У меня были запросы @media в CSS, которые, похоже, мешали правильной загрузке браузера Brave на мобильных устройствах.

7

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.