こんにちは、こずえです。
プログラミング学習記録44日目です。
サイト模写の続きです。
所感：そろそろジム再開しようかな。
合計学習時間
前回までの時間：83.00[h]
今回の時間：7.25[h]
合計時間：90.25[h]
学習内容
前回に引き続きAirbnbのサイト模写です。
サイト模写の経過
今回は以下の変更を行いました。
- ヘッダーアイコンのアコーディオン追加
- サーチバーのクリック後のレイアウト追加(以下3枚目)
※1枚目の画像のレイアウトが崩れていたので修正しました。(2019/04/30 0:40)
最小サイズのレイアウトはこれで一旦完成とします。
ヘッダー手強いです。
ヘッダーのアイコンをクリックするとアコーディオンが展開します。
実装はアコーディオン部分の表示にあわせてメインコンテンツとフッターを非表示にするようにしています。
理想は展開したアコーディオンが上に重なる形なのですが、アコーディオン内部の要素にあわせる＆画面縦幅100%の実現ができませんでした。
どうやるのでしょうか…。
サーチバーをクリックするとヘッダーのレイアウトが変化してサーチバーとキャンセルのみとなります。
こちらもアコーディオンと同様の実装方法です。
納得いかない部分も多々ありますが、次のサイズ（レスポンシブ対応）に移ります。
ひとまず自分おつかれさま！(｀・ω・´)<自分をほめてく！