Мобильный режим

Как выглядит Квас Про на телефоне и планшете: установка иконки приложения на iPhone и Android, выдвижное меню, карточки вместо таблиц — со снимками экранов.

Квас Про — та же панель управления, но она умеет подстраиваться под небольшой экран: телефон или планшет. Отдельного приложения для этого не нужно — открывается тот же адрес, что и на компьютере, а интерфейс сам перестраивается.

Панель ставится на домашний экран как приложение — это способ установки, который делает сам браузер (ниже — шаги для iPhone и Android). Приложение для телефона как отдельный продукт в планах есть, но это выпуск 2.0 (предложение) — см. Планы развития.

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

Монитор

Экран «Белый список» на телефоне: карточки групп доменовЭкран «Белый список» на телефоне: карточки групп доменов

Белый список

Экран «Настройки» на телефоне: разделы параметров и их содержимоеЭкран «Настройки» на телефоне: разделы параметров и их содержимое

Настройки

Как открыть панель с телефона

  1. Подключите телефон к той же сети, что и роутер (к домашнему или рабочему Wi-Fi).
  2. Откройте браузер и введите адрес панели — тот же, что на компьютере: например, по имени https://kvaspro.lan или по добавочному адресу роутера http://192.168.1.254 (порт указывать не нужно, и последнее число адреса — именно 254). Точный адрес вашей сети печатает установщик в конце установки, а посмотреть его в панели можно в «Диагностике» — строка «Добавочный LAN-адрес». Адрес самого роутера (обычно …1) панель не обслуживает: на нём работает встроенный веб-интерфейс роутера.
  3. Войдите по токену — так же, как на компьютере.

Если панель не открывается, проверьте, что телефон не в гостевой сети, а разрешённый круг адресов в «Настройках» → «Сеть и фильтры» включает вашу сеть.

Иконка приложения на экране телефона

Квас Про можно поставить на телефон как обычное приложение: на домашнем экране появится иконка с гербом, а панель будет открываться одним касанием — без адресной строки браузера. Отдельного файла для установки не нужно: всё делает сам браузер.

Что это даёт. Запуск в одно касание, отдельное окно без вкладок и поисковой строки, а при обрыве связи — понятная страница вместо ошибки браузера. Работает и на iPhone, и на Android.

Приложение предложит само. Если открыть панель с телефона, внизу появляется подсказка: на Android — «Установить Квас Про как приложение» с кнопкой «Установить», на iPhone — «Установить Квас Про на экран «Домой»» с подсказкой, куда нажать. Можно воспользоваться ею или пройти шаги ниже вручную.

iPhone и iPad (iOS, iPadOS)

Установка идёт только из браузера Safari — в других браузерах на iPhone такого пункта нет.

  1. Откройте панель Квас Про в Safari.
  2. Нажмите кнопку «Поделиться» — квадрат со стрелкой вверх, в нижней строке (на iPad — в верхней).
  3. В открывшемся списке прокрутите вниз и выберите «На экран „Домой“».
  4. Проверьте имя — по умолчанию подставится «Квас Про» — и нажмите «Добавить» в правом верхнем углу.

Иконка появится на домашнем экране. Запуск с неё открывает панель сразу в полноэкранном режиме, как отдельное приложение.

Android

Установка идёт из Chrome (в других браузерах пункт может называться иначе или отсутствовать).

  1. Откройте панель Квас Про в Chrome.
  2. Нажмите кнопку меню — три точки в правом верхнем углу.
  3. Выберите «Установить приложение». Если такого пункта нет, выберите «Добавить на главный экран».
  4. Подтвердите — нажмите «Установить» (или «Добавить»).

Иконка появится на главном экране; приложение откроется в отдельном окне.

Если пункта установки нет

  • Панель открыта по обычному адресу. Полноценную установку Chrome предлагает для защищённого адреса (по https). У Квас Про защищённый доступ включён по умолчанию, поэтому откройте панель по адресу https://<адрес роутера> — и пункт «Установить приложение» появится. По обычному http-адресу Chrome предложит только ярлык «Добавить на главный экран»: он тоже открывает панель, но в окне браузера.
  • На iPhone. Проверьте, что открыт именно Safari: из Chrome, Firefox и других браузеров на iOS добавить приложение на домашний экран нельзя.
  • Иконка или интерфейс не обновились после обновления приложения. Так бывает из-за кэша браузера и снимка иконки на рабочем столе: удалите старую иконку и добавьте заново. Подробнее — в разделе «Если что-то не так».

Что меняется на узком экране

Квас Про перестраивает интерфейс, когда ширина окна становится меньше примерно 1024 точек — то есть на телефоне в вертикальном положении и на небольшом планшете. Правила простые:

  • Левое меню прячется. Вместо списка разделов в левом верхнем углу появляется кнопка с тремя полосками — она выдвигает меню поверх экрана. Выбрали раздел — меню закрылось само.
  • Панель вида уезжает вправо. Тема, язык, плотность и уведомления открываются кнопкой с иконкой боковой панели в правом верхнем углу.
  • Таблицы становятся карточками. Каждая строка превращается в отдельную карточку со значками: так её видно целиком, без горизонтальной прокрутки. Действия над карточкой прячутся под кнопку «…».
  • Вкладки-фильтры становятся выпадающим списком. Вместо ряда вкладок — одна кнопка с текущим фильтром и списком под ней.
  • Кнопки и поля крупнее. Размер подобран под палец: не меньше 44 точек по высоте, поэтому промахнуться сложно.
  • Тулбар собирается в одну строку. Поиск, кнопки добавления и обновления стоят в один ряд по краям экрана; поиск при необходимости переезжает вниз.
  • Пояснения под заголовком скрываются. На телефоне остаётся название экрана и его содержимое, а длинные подписи уходят — они есть на компьютере.
  • Мастера открываются почти на весь экран и идут по шагам так же, как на компьютере.
Поворот экрана помогает. Если нужно увидеть сразу много — поверните телефон горизонтально: вёрстка станет шире и покажет больше элементов. Ограничения самого приложения при этом не меняются.
Документация КвасПро · v1.0.22