[Minor] Bottom bar looks odd on iPhones with rounded borders (iPhones X, 11-13)

[NovaAndrom3da]

Summary

The current bottom padding amount looks odd on the iPhone X, 11, 12, and 13. This is not a major issue.

[syuilo]

Can someone provide a screenshot?

[NovaAndrom3da]

@syuilo Sadly iOS screenshots do not show the screen border radius so it yields the same screenshot a device with a rectangular screen would provide. I can take a picture of my phone separately though.

Also, the emoji picker (both the one for a reaction and for when composing a note) are too cut off by the border radius.

[rinsuki]

@Froggo8311 do you mean like this?

[syuilo]

セーフエリア考慮したCSS書いてるから↑のようにはならないはずなんだけどな
(ただ実機で動作確認したことは無し)

[syuilo]

(Misskeyのバージョンが古いとかかしら)

[rinsuki]

misskey.io って古いんだっけ、最新のやつ走ってるとこある？

[syuilo]

https://sushi.ski/ が最新かつ誰でも登録できる

[rinsuki]

sushi.skiだとこんな感じ (あんま変わんない気がする)

[syuilo]

あー動いてなさそう
ありがとう🙏

[syuilo]

セーフエリア考慮したCSS書いてる箇所は #8311 (comment) の三枚目のUIだけだった

[rinsuki]

それも結局だめそう

[syuilo]

あれー
こういう書き方じゃ効かないのかしら

misskey/packages/client/src/components/ui/menu.vue

Line 254 in 64f4231

padding: 12px 0 calc(env(safe-area-inset-bottom, 0px) + 12px) 0;

[rinsuki]

https://developer.mozilla.org/ja/docs/Web/CSS/env()

ブラウザーに画面上の利用可能な範囲全体を使用するように指示し、 env() 変数を使用できるようにするには、新しいビューポートのメタ値を追加する必要があります。

これかな

[rinsuki]

↑これ追加したらまあまあな感じになった

[NovaAndrom3da]

The new tab bar position looks better, but the emoji picker is still very close to the screen border.

[NovaAndrom3da]

The settings > privacy screen now isnt long enough so the "keep content warnings" checkbox is unaccessible