Привет! Я перешёл с ветки stable на последнюю esr, и, похоже, больше нет возможности явно переключаться между мобильной и десктопной версией? В левом нижнем углу боковой панели я больше не вижу переключателя, а параметры ?mobile_view=1 / ?mobile_view=0 больше не работают. Теперь переход от десктопного режима (с боковой панелью и гамбургер-меню слева) к мобильному (без боковой панели и с меню справа) происходит автоматически при горизонтальном изменении размера окна браузера. Получается, что теперь всё зависит только от ширины браузера? Раньше можно было при желании использовать упрощённую мобильную версию на планшете с широким экраном или, наоборот, включать десктопный режим (с более подробным списком тем, например) на телефоне с небольшим экраном или в узком окне браузера, если пользователю это было удобнее.
Верно — мы переходим к упрощению макетов для обеспечения корректной адаптивности, поскольку использование контрольных точек, зависящих от ширины, является более общепринятым стандартом в дизайне. Мы также обнаружили, что такой подход проще поддерживать, а макет, основанный на ширине, хорошо сочетается с другими внешними элементами дизайна, например, при интеграции общих баннеров на основном сайте и форуме.
Один из недостатков этого подхода заключается в том, что в инициализаторе нельзя выполнить логику, специфичную для устройства.
Классический пример — установка разных стартовых страниц для мобильных устройств и настольных компьютеров; сейчас это сделать невозможно.
По моему мнению, это потребует гораздо более динамичного подхода к созданию шаблонов.
Спасибо за ответ. В принципе это имеет смысл, но на практике это создаёт определённые трудности для более продвинутых и активных пользователей. Как я уже упоминал, в режиме сокращённого отображения в списке тем видно гораздо меньше информации, особенно по сравнению с десктопной версией, например, как на Sam's Simple Theme. Поэтому некоторые пользователи предпочитали принудительно включать десктопный макет, и даже в этом случае он корректно адаптировался, помещаясь по горизонтали без переполнения.
У этого метода были ограничения, которые мы устранили с помощью новых методов — определение возможностей на этапе инициализации довольно негибко: если что-то изменится, нам пришлось бы перезагружать всю страницу.
Это полезно, потому что устройства стали менее предсказуемыми: телефоны могут разворачиваться в планшеты, ноутбуки могут превращаться в планшеты, клавиатуру и мышь можно подключить к стольким устройствам…
Если вы привыкли к старому подходу, то новый может показаться другим, но всё, что вы делали в инициализаторе, скорее всего, всё ещё возможно — и при этом более отзывчиво к изменяющимся возможностям.
Теперь это возможно: подход стал более детальным, и вы условно показываете или скрываете контент внутри одного шаблона, а не заменяете его целиком. Например, теперь в нашем сервисе возможностей есть объект viewport…
В шаблоне…
{{#if this.capabilities.viewport.lg}}
Контент для больших экранов
{{/if}}
{{#if this.capabilities.viewport.sm}}
Контент для очень маленьких экранов
{{/if}}
или в JS…
get myContent() {
if (this.capabilities.viewport.sm) {
return "короткий контент";
} else {
return "очень-очень длинный контент";
}
}
А в CSS вы можете использовать те же контрольные точки, например…
@use "lib/viewport";
.my-element {
font-size: 1em;
@include viewport.until(sm) {
font-size: 2em;
}
}
Конечно, я в курсе этих замен.
Однако я с нетерпением жду, когда такие подходы станут применяться более фундаментально.
Например, если на десктопной версии моей главной страницы отображаются категории, то я должен видеть список тем.
Список тем, по логике вещей, должен отображаться и на мобильных устройствах… В текущем виде элемент списка тем теряется.
Именно поэтому существовал TC «Принудительная мобильная главная страница»…
Надеюсь, я объясняюсь понятно…
Да, это логично. Думаю, мы будем постепенно вносить подобные поддерживающие изменения… Просто это непросто, когда мы построили так много, используя старые подходы, и должны поддерживать их так, чтобы это не сразу ломало кастомизацию.
К сожалению, мне нужно немного подробнее раскрыть эту тему, так как есть пользователи, которые очень не любят упрощённую мобильную разметку. Особенно это касается пользователей планшетов в портретной ориентации.
Поэтому я, наверное, всё ещё немного запутался: что именно изменилось? Была ли просто удалена кнопка переключения
/
из боковой панели? Можно ли вызвать тот же метод JS с помощью пользовательского скрипта или что-то в этом роде? Или же произошли изменения в коде разметки для настольных компьютеров, из-за которых она больше не будет адаптивно подстраиваться под меньшую ширину окна браузера?
Похоже, что переключатель «Версия для ПК» в браузере (проверено в Chrome и Firefox на Android-планшете) принудительно включает старую разметку, которая ранее соответствовала собственному переключателю
/
в Discourse, и она по-прежнему адаптивна без переполнения. Однако текст, кажется, стал намного меньше, чем я помню.
Я также знаю, как выбирать определённые контрольные точки по ширине, например @media screen and (max-width: 1000px) {… но не уверен, можно ли что-то сделать там с помощью переопределений CSS.
Я согласен с этим. Мне никогда особенно не нравилась мобильная версия на телефоне: она кажется гораздо более ограничивающей, и всё выглядит слишком крупно, если не уменьшить масштаб примерно вдвое. Я всегда использовал здесь десктопную версию, пока буквально не стал не в состоянии.
Понимаю простоту поддержки одного макета и отсутствие необходимости переключаться, но иногда выбор — это приятно.
Нет, он не просто убран из боковой панели. Мы удалили базовую структуру для переключения.
Это значит, что Force Mobile Homepage нужно пометить тегом broken?
Я пометил это как неработающее.
Вот почему:
Итак, чтобы предотвратить возврат к упрощенной мобильной разметке при нормальных вертикальных ширинах планшета, могу ли я использовать что-то вроде этого в CSS: @media screen and (max-width: 700px) {…
Или переключатель «Версия для ПК» в мобильном браузере — это единственный вариант, который можно рекомендовать пользователям?
Могли бы они протестировать использование «Запросить версию для ПК» вместе с увеличением размера шрифта в https://meta.discourse.org/my/preferences/interface?
Привет, спасибо за ответ.
Один пользователь попробовал переключатель «Версия для ПК» в браузере, но сообщил, что это не помогло. На моём планшете интерфейс действительно меняется на полноценную версию для ПК, но даже при настройке «Максимальный» текст едва достаточно велик. При этом нецелесообразно задавать это в настройках пользователя, так как на других устройствах, например на ПК, использующих ту же учётную запись, текст становится слишком крупным.
Полагаю, «обычный» — это ваш текущий выбор по умолчанию. Вы пробовали выбрать что-то другое?
Ох, конечно.
Спасибо, это немного помогает, я полагаю.
Честно говоря, не помню, как работало масштабирование размера шрифта в старом явном режиме для рабочего стола на экране с меньшей вертикалью, но мне кажется, что в целом они были крупнее. Возможно, придется добавить некоторые переопределения CSS для настройки «Самый большой»…

