Сайты через DiscourseHub конфликтуют с элементами верхней панели на iPhone 14 Pro Max

Сайты через Safari работают нормально:

А вот те же сайты через DiscourseHub перекрываются в верхней части экрана:


Тестирую обе темы: «Светлая» и «Фокусная боковая панель».

При таком наложении довольно сложно активировать что-либо в верхней панели сайта.

iPhone 14 Pro Max, iOS 16.0.1 (текущая официальная версия).

3 лайка

Я только что оставил комментарий по адресу Titlebar is not displaying properly - #13 by spdegabrielle, но теперь, увидев ваш пост, я думаю, что они могут быть связаны.

1 лайк

Я тоже участвовал в том, он больше связан с темой сфокусированной боковой панели. Этот же специфичен для оборудования. В результате один из моих скриншотов выше демонстрирует оба.

1 лайк

Спасибо, @Stephen — у нас есть исправление для этой проблемы, оно уже в процессе выпуска, и мы обновим информацию здесь, когда оно будет опубликовано.

7 лайков

Трудно сказать наверняка, но это то же самое, что я вижу здесь, на https://community.wanikani.com? Разница в том, что я вижу это и в настольных, и в мобильных браузерах (я не использую DiscourseHub), поэтому я не был уверен.

Думаю, это происходит потому, что для логотипа используется height: 100%.

.d-header {
  #site-logo.logo-big {
    height: 100%;
  }
}

Скорее всего, стоит добавить в ядро для #site-logo свойство max-height: var(--header-offset), чтобы предотвратить это. :thinking:

Быстрое решение :arrow_down_small:

Удалите это из вашей кастомной темы

Для десктопа theme_1
Screenshot 2022-09-17 at 17.42.59

.d-header {
  #site-logo.logo-big {
    height: 100%;
  }
}

И для мобильных устройств theme_1
Screenshot 2022-09-17 at 17.46.52

.d-header {
  #site-logo {
    height: 100%;
    max-height: 100%;
  }
}
Добавьте это в вашу кастомную тему

Добавьте это в общий раздел :arrow_down_small:

.d-header {
  #site-logo {
    height: 100%;
    max-height: var(--header-offset);
  }
}

Добавьте это в раздел для десктопа :arrow_down_small:

.d-header {
  #site-logo.logo-small {
    height: 2.667em;
  }
}

Добавьте это в раздел для мобильных устройств :arrow_down_small:

.d-header {
  .title {
    max-width: 100%;
    #site-logo.logo-small {
      max-height: 2.4em;
    }
  }
}

После этих изменений :arrow_down_small:

Десктоп:

Мобильные устройства:
Screenshot 2022-09-17 at 18.04.00

2 лайка

Спасибо за предложение. К сожалению, я не администратор сайта, поэтому мало что могу сделать.

Обновление Discourse Hub вышло в App Store для iOS, и всё снова выглядит отлично.

2 лайка

Я думаю, это может быть iOS 16? Вижу, что вы его используете, и у меня сегодня возникла эта проблема в Roblox.

1 лайк

Совместимость с iPhone 14 Pro добавлена в Discourse Hub 1.8.3!

Сообщите, если появятся ещё какие-либо наложения между заголовком форума и интерфейсом iOS. :smiley: (не только на последних моделях iPhone)

4 лайка

Это релиз от шести дней назад или другой?

1 лайк

Да, именно этот!

3 лайка