グラブルのチャット使いづらいので調整したよ

面倒なので用件だけ書きます

縮小してると凄く見づらい。
だから高さを調整しました。

完成形

高さ800px で下記CSSを使うと右のように見やすくなります。満足。

必要なもの

・グラブルをブラウザ上で見られる環境（公式アプリは未確認）
・CSSを書き換えられる環境（Chromeなら「Stylist」や「Stylebot」。使い方は各自調べること）

やること

Chromeに先ほどの拡張を入れます。
そこへ以下のCSSを記入。

/* 縮小時の調整 */
/* 表示 高さ */
#general-chat #chat-body {
height: 30%!important;
}
/* 文字 高さ */
#general-chat #chat-body:not(.half):not(.full) #chat-content {
height: 90%!important;
}
#general-chat #chat-body.half #chat-content {
height: 90%!important;
}
/* 入力欄 位置 */
body.ios #chat-body.input:not(.full) {
padding-bottom:400px!important;
}

/* フルサイズ */
/* 表示 高さ */
#general-chat #chat-body.full {
height: 100%!important;
}
/* 入力欄 位置 */
body.ios #chat-body.input.full #chat-content {
height: 85%!important;
}

あとはChrome上でグラブルを開くとうまく行きます。

ただ急ぎなので不具合あるかも。
特に共闘やマルチみてないので。
そこは個々人で弄って下さい。

しかし「!important」で無理変えてるので何が起きるか分からないですね。こわいこわい。

追記

12月17日(木)
18

予想通り公式アプリ動かないですね。~考えます。~面倒くさくなったので辞めました。
18 チャット入力できませんね。修正します。
19 チャット欄を作るために90%から75%に修正。対策があるはずだけど時間が無いので。ただしFULLサイズにすると崩れるので注意。
19 縮小時のチャット欄を調整。そのため90%へ戻しました。まだFULLサイズは崩れます。
19 縮小時のCSS、パーセントに設定。これで設定の調整しやすくなるかも。
20 縮小・拡大のチャット欄、調整完了。高さによっては使いづらいかも知れないので、各自調整して下さい。
20 縮小時、パーセント指定だと横幅で酷いことになったのでpx指定。
20 マルチ等で見やすい30%に指定(縦800px時)。個々人で調整お願いします。

12月27日(日)
00

縮小時の表示がおかしくなっていたので修正。「#general-chat #chat-body(.half)(.full) #chat-content」が変わっていたのが原因でした。

4月10日(日)
「#general-chat #chat-body

(.half)(.full) #chat-content」「#general-chat #chat-body.half #chat-content」どちらでも対応するように修正。

〆

なんでチャットを小さくしたんでしょうかね。
チャットが2行と見づらいんですが……
もしかして設定とか登場する？観測的希望ではありますが。

さて、、アプリの方はどうしようかなあ。
修正できそうな箇所が分からない(´・ω・｀)