iPhone 14 Pro MaxでDiscourseHub経由のサイトがトップバー要素と競合する

Safari を介したサイトは問題ありません。

一方、DiscourseHub を介した同じサイトは画面の上部で衝突します。


ライトテーマとフォーカスサイドバーテーマの両方をテストしました。

このように重なっていると、サイトのトップバーの何かをアクティブにするのはかなり難しいです。

iPhone 14 Pro Max、iOS 16.0.1 (現在のリテールリリース)。

「いいね!」 3

Titlebar is not displaying properly - #13 by spdegabrielle にコメントしましたが、あなたの投稿を見て、これらに関連があるかもしれないと思いました。

「いいね!」 1

私もそれに参加していましたが、それはより焦点を絞ったサイドバーのテーマに関連しています。これはハードウェア固有のものです。その結果、上記の私のスクリーンショットの1つは両方を示しています。

「いいね!」 1

@Stephen様、ありがとうございます。この問題の修正を開発中で、リリースされ次第こちらで更新します。

「いいね!」 7

はっきりとは分かりませんが、https://community.wanikani.com/ で見ているものと同じでしょうか?違いは、デスクトップとモバイルブラウザの両方でこれを見ていることです(DiscourseHub は使用していません)。そのため、確信が持てませんでした。

これは、ロゴに height: 100% が使用されているためだと思われます。

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

おそらく、これを防ぐために、コアの #site-logomax-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 のアップデートが iOS App Store にリリースされ、すべてが再び良好になりました。

「いいね!」 2

これはiOS 16ではないでしょうか?あなたがそれを使用しているのを見かけました。私も今日Robloxでこの問題が発生しました。

「いいね!」 1

Discourse Hub 1.8.3 で iPhone 14 Pro の互換性がリリースされました!

フォーラムヘッダーと iOS インターフェースの間に、これ以上競合がないか教えてください。 :smiley: (最新の iPhone だけではありません)

「いいね!」 4

それは6日前のリリースですか、それとも別のリリースですか?

「いいね!」 1

はい、それです!

「いいね!」 3