Skip to content

Conversation

@snaka
Copy link
Member

@snaka snaka commented Oct 16, 2022

Backlog

実装

  • component(atom) 新規作成
    • Link : MUI の LInk の見た目に Next.js の Link の機能を組み合わせたコンポーネントを作成した
      • See also: [Next.jsとMaterial-UIのLinkを併用する方法 | りーほーブログ https://omkz.net/nextjs-mu-link/]
    • IconTwitter : Twitter アイコンを MUI の SvgIcon を利用して表示するだけのコンポーネント
  • component(organisms) 修正
    • Footer :
      • useSize を利用して PC 用 / モバイル用 のフッターレイアウトを切り替えるように実装を変更した
      • 各種 Link ( Code of Conduct など ) を埋め込んだ

動作確認

(PC)
image

(モバイル)
image

気になる点

  • Twitter の SVG アイコンは Figma から export したが、width , height の値を変更しないとアイコンの右側が切れて表示されていたので現在のような値 ( width: '32px', height: '24px' ) を設定している。SVG の扱いかたがよくわかっていないので、ちゃんとした方法があるのかもしれない ...
  • Colors への値の追加の方法とかあまりわかってない
  • Figma を参考に Footer の見た目を整えたが、Box の入れ子とそのプロパティが煩雑で構造が見づらい気がしている、なんかスッキリさせる方法があったら知りたい ...

snaka added 4 commits October 16, 2022 17:43
Component for Twitter icon
MUI の Link の見た目に Next.js の Link の動作を組み合わせて利用するためのコンポーネントを用意した

See also: https://omkz.net/nextjs-mu-link/
Copy link
Contributor

@maito1201 maito1201 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@snaka snaka merged commit 913ad4b into main Oct 17, 2022
@snaka snaka deleted the feat/footer branch October 17, 2022 14:43
@snaka snaka self-assigned this Oct 20, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants