Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.footer-auth width
Please enter the commit message for your changes. Lines starting
|
…min-width: 768px) and (max-width: 1199px)
|
수고 하셨습니다 ! 스프리트 미션 하시느라 정말 수고 많으셨어요. |
코드 리팩토링 할 때, 같은 요소가 있는 것 하나하나 다 쪼개는 게 좋은지, 아니면 공통 요소들이 있는 조금 더 큰 덩어리(예를 들면 2-3개 정도)로 쪼개는 게 좋은지 궁금합니다,,!커밋 단위를 질문하시는거라면 부담이 되지 않는 선에서 지금처럼 쪼개는게 베스트긴 하지요 ! 다만, 이렇게 쪼개면 개바할 때 힘들어하실 것 같군요 ㄷㄷㄷ 조금 더 �단위가 큰 기능 단위로 쪼개도 될 것 같아요 ! "네비게이션 바 퍼블리싱", "네비게이션 바 반응형 처리", "메인 섹션 컴포넌트 개발"처럼 기능 단위로 쪼개셔도 될 듯 합니다 ! |
kiJu2
approved these changes
Sep 23, 2024
There was a problem hiding this comment.
굳굳 svg로 바꾸셨군요 ! 👍👍👍
피드백을 잘 수용하셨네요 ㅎㅎㅎ 👍👍
Comment on lines
+6
to
+16
| <meta charset="utf-8" /> | ||
| <meta http-equiv="X-UA-Compatible" content="IE=edge" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <meta name="description" content="일상의 모든 물건을 거래해 보세요!" /> | ||
| <meta name="og:title" content="믿을 수 있는 중고거래, 판다마켓" /> | ||
| <meta property="og:type" content="website" /> | ||
| <meta property="og:image" content="images/home_bottom.png" /> | ||
| <meta | ||
| property="og:description" | ||
| content="일상의 모든 물건을 거래하다, 판다마켓" | ||
| /> |
| <img src="images/logo.png" alt="로고" /> | ||
| <h1><a href="index.html" class="title">판다마켓</a></h1> | ||
| </div> | ||
| <a href="site.html/login.html" class="button small-button"> 로그인 </a> |
There was a problem hiding this comment.
button과 small-button으로 나누셨군요 !
스타일에 맞는 이름 선정도 훌륭하고, 스타일을 나눔으로서 재사용성을 좋게하고 코드 중복을 줄일 수 있겠네요 👍👍
| <div class="top-text">일상의 모든 물건을 <br /></div> | ||
| <div class="top-text">거래해 보세요</div> | ||
| </h2> | ||
| <a href="site.html/items.html" class="button large-button"> |
There was a problem hiding this comment.
움 혹시 site.html/items.html은 의도된걸까요?
잘 동작하는지는 모르겠으나 items.html 이렇게 작성될텐데.. 싶어서 질문드립니다.
|
|
||
| <body> | ||
| <body> |
There was a problem hiding this comment.
어떤 차이인가 했는데 !
프리티어를 적용하신거였군요 ! 코드가 훨씬 보기 좋아졌네요. 굳굳 훌륭합니다 👍
Comment on lines
+38
to
+80
| <form class="email-form"> | ||
| <label for="signup-email" class="email-form__input" | ||
| >이메일<br /> | ||
| <input | ||
| id="signup-email" | ||
| name="email" | ||
| type="email" | ||
| placeholder="이메일을 입력해주세요" | ||
| /> | ||
| </label> | ||
| </form> | ||
| <form class="nickname-form"> | ||
| <label for="signup-nickname" class="nickname-form__input" | ||
| >닉네임<br /> | ||
| <input | ||
| id="signup-nickname" | ||
| name="nickname" | ||
| placeholder="닉네임을 입력해주세요" | ||
| /> | ||
| </label> | ||
| </form> | ||
| <form class="password-form"> | ||
| <label for="signup-password" class="password-form__input" | ||
| >비밀번호<br /> | ||
| <input | ||
| id="signup-password" | ||
| name="password" | ||
| type="password" | ||
| placeholder="비밀번호를 입력해주세요" | ||
| /> | ||
| </label> | ||
| </form> | ||
| <form class="password-form"> | ||
| <label for="checkout-password" class="password-form__input" | ||
| >비밀번호 확인<br /> | ||
| <input | ||
| id="checkout-password" | ||
| name="password" | ||
| type="password" | ||
| placeholder="비밀번호를 다시 한 번 입력해주세요" | ||
| /> | ||
| </label> | ||
| </form> |
There was a problem hiding this comment.
<form />은 제출할 input들을 감싸야 합니다 !
Suggested change
| <form class="email-form"> | |
| <label for="signup-email" class="email-form__input" | |
| >이메일<br /> | |
| <input | |
| id="signup-email" | |
| name="email" | |
| type="email" | |
| placeholder="이메일을 입력해주세요" | |
| /> | |
| </label> | |
| </form> | |
| <form class="nickname-form"> | |
| <label for="signup-nickname" class="nickname-form__input" | |
| >닉네임<br /> | |
| <input | |
| id="signup-nickname" | |
| name="nickname" | |
| placeholder="닉네임을 입력해주세요" | |
| /> | |
| </label> | |
| </form> | |
| <form class="password-form"> | |
| <label for="signup-password" class="password-form__input" | |
| >비밀번호<br /> | |
| <input | |
| id="signup-password" | |
| name="password" | |
| type="password" | |
| placeholder="비밀번호를 입력해주세요" | |
| /> | |
| </label> | |
| </form> | |
| <form class="password-form"> | |
| <label for="checkout-password" class="password-form__input" | |
| >비밀번호 확인<br /> | |
| <input | |
| id="checkout-password" | |
| name="password" | |
| type="password" | |
| placeholder="비밀번호를 다시 한 번 입력해주세요" | |
| /> | |
| </label> | |
| </form> | |
| <form class="email-form"> | |
| <label for="signup-email" class="email-form__input" | |
| >이메일<br /> | |
| <input | |
| id="signup-email" | |
| name="email" | |
| type="email" | |
| placeholder="이메일을 입력해주세요" | |
| /> | |
| </label> | |
| <label for="signup-nickname" class="nickname-form__input" | |
| >닉네임<br /> | |
| <input | |
| id="signup-nickname" | |
| name="nickname" | |
| placeholder="닉네임을 입력해주세요" | |
| /> | |
| </label> | |
| <label for="signup-password" class="password-form__input" | |
| >비밀번호<br /> | |
| <input | |
| id="signup-password" | |
| name="password" | |
| type="password" | |
| placeholder="비밀번호를 입력해주세요" | |
| /> | |
| </label> | |
| <label for="checkout-password" class="password-form__input" | |
| >비밀번호 확인<br /> | |
| <input | |
| id="checkout-password" | |
| name="password" | |
| type="password" | |
| placeholder="비밀번호를 다시 한 번 입력해주세요" | |
| /> | |
| </label> | |
| </form> |
input 하나 당 form 하나가 아닌, 서버에게 보낼 데이터들을 입력할 input들을 감싸야 합니다 ! 😊😊
Comment on lines
+11
to
+35
| @media (max-width: 1199px) { | ||
| .nickname-form__input { | ||
| display: flex; | ||
| gap: 16px; | ||
| flex-direction: column; | ||
| font-weight: 700; | ||
| font-size: 18px; | ||
| color: var(--gray-800); | ||
| line-height: 21px; | ||
| } | ||
| } | ||
|
|
||
| @media (min-width: 1200px) { | ||
| .nickname-form__input { | ||
| display: flex; | ||
| gap: 16px; | ||
| flex-direction: column; | ||
| font-weight: 700; | ||
| font-size: 18px; | ||
| color: var(--gray-800); | ||
| line-height: 21px; | ||
| } | ||
| } | ||
|
|
||
| @media (max-width: 767px) { |
Comment on lines
+61
to
+77
| * { | ||
| box-sizing: border-box; | ||
| margin: 0; | ||
| } | ||
|
|
||
| * { | ||
| --primary: #3692ff; | ||
| --cyan-blue: #cfe5ff; | ||
| --white: #ffffff; | ||
| --gray-400: #9ca3af; | ||
| --light-gray: #dfdfdf; | ||
| --gray-200: #e5e7eb; | ||
| --gray-100: #f3f4f6; | ||
| --gray-50: #f9fafb; | ||
| --gray-10: #fcfcfc; | ||
| --black-900: #111827; | ||
| --black-700: #374151; |
There was a problem hiding this comment.
해당 스타일이 반응형인 것은 의도된걸까요?
컬러 팔레트와 글로벌하게 적용될 스타일은 반응형으로 처리해두지 않아도 될 것 같아요 ! 미디어 쿼리를 사용하게 되면 불필요한 코드 중복이 생기게 됩니다 😊
|
수고 많으셨습니다 진희님 !! |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
요구사항
기본
-체크리스트 [심화]
스크린샷
멘토에게