サイト制作終盤。iOS Safari の 100vh が下部のメニューまで含んだサイズになっててみんなどうしてんだと思って調べたら height -webkit-fill-available に設定するとあって確かにそれでいけるんだけど幅の指定に数値以外に fit-content やら max-content みたいなのが増えてて勉強になった。Zoom ミーティングにカメラ OFF マイク OFF で参加してそのまま消えていくと呼ばなくてよかったんじゃないか的な雰囲気になるんだけど個人的にはオフィスの片隅でやってるミーティングをなんとなく聞いてる感じになっていて別に無駄な時間て感じでもなくてふと思ったのがこれは社内 Clubhouse 的なものがあってそこでブレストとかアイデア会議とかすると呼ばれなくても参加できたりしてよいのではないかということ。
英語版で微妙に変わっているフォントサイズやマージンをちまちま全部調整美しくなってきた。いまさら CSS Variables の便利さがわかってきてまたして作り直したい気持ちになってきたのをぐっとおさえて text-overflow: ellipsis と -webkit-line-clamp で複数行テキストがあふれたときに三点リーダーで切るとこの実装やってたらこれはどうやらブラウザのバグをふんでいるのかエフェクトとの相性なのか表示されたり消えたりしていて解決しなくてまた数時間かかりそうな予感がしたので放置してほかをやる。
iOS Safari の 100vh が下部メニュー含んでしまってる問題は height: -webkit-fill-available で解決したにみえたがスクロールすると消えるメニューたちに付随してその高さも変わってしまってキモい動きになってしまう問題が別途発生したのでどうにかならんか半日ぐらいグニグニしたあげくシンプルにページロード時に window.innerHeight で固定しちゃえばいいというシンプルな結論にたどり着く。自作キーボードの "0" キーの反応が悪くなってきて ")" も入力されづらくなってストレスなのでキーを交換しないといけない。キーのはんだ付けからやってるのでこういうときの修理は簡単だな。
