Conversation
| @@ -0,0 +1,110 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| --btn-visited-color: #9CA3AF; | ||
| --white-color: #FFFFFF; | ||
| --bg-sky-color: #CFE5FF; | ||
| --emelent-gray-color: #9CA3AF; |
There was a problem hiding this comment.
--emelent 부분이 오타인 것 같습니다.
| } | ||
|
|
||
| :root { | ||
| --element-gray-color: #374151; |
There was a problem hiding this comment.
--element-gray-color, --emelent-gray-color 두 가지가 서로 다른 회색을 표현하는 것이라면 light-gray 등의 표현을 통해 구분을 해주시는 게 좋을 것 같습니다. 🤗
| <img src="image/panda_face.png" alt="판다 얼굴"> | ||
| <a href="/"><img src="image/panda_market_logo.png" alt="판다마켓 로고"></a> | ||
| </div> | ||
| <span class="empty-center"></span> |
There was a problem hiding this comment.
별도의 빈공간을 위한 요소를 추가하기 보다는 css 속성을 이용해 로고와 로그인 버튼의 배치를 조정해주시면 더 좋을 것 같습니다.
(해당 코드는 css 파일쪽에 코멘트 달아두었습니다.)
|
|
||
| .header-top-line { | ||
| display: flex; | ||
| justify-content: center; |
There was a problem hiding this comment.
| justify-content: center; | |
| justify-content: space-between; |
span 태그를 이용해 빈공간을 만들기 보다는 css 속성을 이용해 배치를 해주시면 더 좋을 것 같습니다. 🤗
| <body> | ||
| <header> | ||
| <section class="header-top-line"> | ||
| <div class="logo-set"> |
There was a problem hiding this comment.
logo-set이라는 표현을 보면 좀 더 많은 로고들의 리스트가 떠오르는 것 같습니다.
정확한 용어의 경우 아래 링크에 잘 정리되어 있는데 자주 사용하는 용어는 아닌지라 home-button 정도로 지칭하면 자연스러울 듯 하네요 🤗
| <section class="footer-main"> | ||
| <h1> | ||
| 믿을 수 있는<br> | ||
| 판다마켓 중고거래 | ||
| </h1> | ||
| <img src="image/footer_picture.png" alt="하단 그림"> | ||
| </section> |
There was a problem hiding this comment.
이 부분은 footer에 속하기 보다는 별도의 card 또는 배너 영역으로 보여집니다. 왜냐하면 사이트 전반적으로 보여지는 부분이 아니라 주로 랜딩페이지 하단에 속하는 내용이기 때문입니다. 위치를 옮겨주시면 좋을 것 같습니다.
| <div class="footer-line-left"> | ||
| @codeit - 2024 | ||
| </div> |
There was a problem hiding this comment.
변경에 유연한 코드 작성을 위해 위치 기반의 네이밍 보다는 copyright처럼 해당 영역의 내용을 이름에 표현해 주시면 좋을 것 같습니다. 😃
| <div class="footer-line-left"> | ||
| @codeit - 2024 | ||
| </div> | ||
| <div class="footer-line-center"> |
There was a problem hiding this comment.
마찬가지로 위치 대신 information 정도의 섹션으로 네이밍 해주시면 좋을 것 같아요!
| <a href="/privacy">Privacy Policy</a> | ||
| <a href="/faq">FAQ</a> | ||
| </div> | ||
| <div class="footer-line-right"> |
There was a problem hiding this comment.
SNS가 포함 된 이름으로 네이밍 해주시면 더 좋을 것 같습니다!
| <body> | ||
| <header> | ||
| <section class="header-top-line"> | ||
| <div class="logo-set"> |
There was a problem hiding this comment.
아니면 이미지를 다운로드 하실 때 두 개의 영역을 합쳐 다운로드 하시는 것도 좋을 것 같습니다.
요구사항
기본
심화
주요 변경사항
스크린샷
https://pandamarket-leetaejin.netlify.app/
멘토에게