レスポンシブ対応
essea-numero2.comいざデプロイしたものの、
スマホのレイヤー崩れがとってもやばいなと思いました（小並感）
スマホでプレイする時に邪魔なUIが合ったので削減しました。
やったこと
- ログイン画面（トップ画面）を更新・現在のチャンプを表示。
- IDパスワードの入力可能桁数を変更。（8文字以内は流石にやばい）
- ログインと新規登録フォームを分割
- 現在のチャンプ一覧を横スクロール出来るように対応
- チャンプ戦テーブルを削除して、現在のチャンプ一覧に「チャンプに挑戦する」ボタン付属
- チャンプ挑戦テーブルがあった場所に探索テーブルを移動。その下に街の施設テーブルを移動。
- ステータスUIの下に自分の家テーブルを移動。
- ステータスUI＆自分の家テーブルをアコーディオンで閉じれるように変更（モバイル版では閉じた状態がデフォルト）
- その他、モバイル表示のUIの大きさを調整。
スマホを意識するとえらいミニマムになったけど、無駄が削ぎ落とされると考えれば悪くないかも？
もう少し改善したいところはあるけどこんなところです。
余談（？）
UI改善に関係するので余談と言えるかわからないですが
トップ画面は以前から「改善しなきゃ...」と思って放置していたので、
この機会に更新しました。
スマホで触る時に、探索ボタンまでのスクロールが煩わしかったので、
アコーディオンを導入してみました。
アコーディオンってなぜか苦手意識があったんですが、
vue.jsで一瞬でした。
ふれーむわーくすごい。
あと、レスポンシブ対応で
すごく久しぶりにmatchMediaを使ってみたのですが、
本当に謎技術ですよね。
自分でメソッド使っといてなんですが、
よくわからないまま動かしていますね。すごい。
しばらくは1人でテストプレイを進めていきます。
ある程度修正とか確認できたら、一般公開したいなぁ。
