GWなのでポートフォリオを育ててみる【take2】

GWなのでポートフォリオを育ててみる【take2】

さらに細かいところを少しずつアップデート。

  • ヘッダーの透過を調整
  • モバイル版のメニューを白文字+影でのアクティブ表示
  • Imageタグのfillだけ警告にsizesを追加(警告対策)
  • scroll-behavior: smoothの警告が出続けていたので修正
  • aboutページに資格や経歴を充実させる
  • hoogle search console上で、拡張機能が検知できるようにパンくずリストを追加
  • worksにカレンダーを追加(@holiday-jp/holiday_jpを利用)

今日の詰まりポイント

Next.jsはデフォルトで

window.scrollTo()

を実行します。ここで scroll-behavior: smooth があると

[browser] Detected scroll-behavior: smooth on the <html> element. To disable smooth scrolling during route transitions, add data-scroll-behavior="smooth" to your <html> element. Learn more: https://nextjs.org/docs/messages/missing-data-scroll-behavior

という警告が出てしまうようです。ので、Next.jsが出しているように <html>にdata-scroll-behavior="smooth"を付けました。

<html lang="ja" data-scroll-behavior="smooth">

これで無事解決です。

実行時警告を放置していましたが、そろそろ作品として育ってきたので一通り除去しました。見えないところを気にしてこそオシャレということです。


本日も、お疲れ様でした。