[Feat/#17] 모바일 Header 공통 컴포넌트 추가

[sinji2102]

• Closes [ Feat ] Header 공통 컴포넌트 구현 #17

🎟️ PR 유형

어떤 변경 사항이 있나요?

• 새 기능 추가
• 버그 수정
• CSS 등 사용자 UI 디자인 변경
• 리팩토링

Check List

• 🔀 PR 제목의 형식을 잘 작성했나요?
• 🏗️ yarn build는 성공했나요?
• 🧹 불필요한 코드는 제거했나요? (TODO, 주석, clg... etc.)
• ✅ 컨벤션을 지켰나요?
• 💭 이슈는 등록했나요?
• 🏷️ 라벨은 등록했나요?
• 🙇‍♂️ 리뷰어를 지정했나요?

✅ Key Changes

• 모바일 헤더 공통 컴포넌트 추가

📢 To Reviewers

일단.... next 개발도 처음이고 tailwind도 처음 써봐서 얼렁뚱땅 개발했는데 뭐든지 괜찮으니까 이거 좀 이상한데? 싶으면 코리 왕창 남겨주세요 ㅠㅠ 🥲

사용은 페이지 내에서

<Header title="페이지 이름" />

으로 사용하면 됩니다!

header를 봤을 때 우측에 햄버거바가 있는 친구가 있고 없는 친구가 있더라고요!! 기본 세팅은 false로 되어있으나 햄버거바가 필요한 페이지의 경우

사용은 페이지 내에서

<Header title="페이지 이름"  menu/>

로 이용하면 메뉴 아이콘이 생성됩니다!

현재 뒤로가기는 구현되어 있으나, 메뉴는 사이드바가 없어서 일단 콘솔로그 찍히게 두었습니다~

뷰는 mobile 페이지에서 확인할 수 있습니다!

노트북으로 봐서 그런가 글자 크기가 분명 맞는데.. 글자가 넘 작아보이는데 한 번씩 확인해주세요!

📸 스크린샷

• 햄버거바 없을 때
  

• 햄버거바 있을 때
  

[hyeonjin6530]

헉 너무 잘하신 거 같은데요?? 그리구 질문이 하나 있는데용 main에서 사용하는 헤더가 있는데 그건 따로 만들까용 아니면 이 코드에 추가해서 만들어둘까요?
왜냐면 확인해보니 height도 다르고, 같은 점은 햄버거 아이콘 밖에 없서서용

[sinji2102]

헉... 저도 안 그래도 그 부분 고민했는데 다른 부분이 넘 많아서 따로 만드는 게 좋을 것 같아요! #17 에 첨부해 두었습니당!

[daun-up]

헤더 기엽당... 헤더 글씨 크기의 경우 디자인적인 부분에서 놓친 것 같은데, 18px... 정도로 크게 해도 괜찮을 것 같긴 해요. + 위아래 패딩이 조금 있어도 될 것 같다는 생각이 들어요 이것도 디자인에서 놓친 부분! (내가)